03096861 by zhangmeng

页面修改

1 parent 94d02189
...@@ -314,4 +314,8 @@ li.el-select-dropdown__item { ...@@ -314,4 +314,8 @@ li.el-select-dropdown__item {
314 color: #493CEB; 314 color: #493CEB;
315 } 315 }
316 316
317 .s{
318 cursor:pointer
319 }
320
317 </style> 321 </style>
......
1 <template>
2 <div>
3 <el-dialog
4 v-model="show" title="详情" :close-on-click-modal="true" width="800px">
5 <div v-html="content">
6 </div>
7 </el-dialog>
8 </div>
9 </template>
10
11 <script setup>
12 import {ref} from 'vue'
13 const show=ref(false)
14 const content=ref()
15
16 function open(row){
17 content.value=row
18 show.value=true
19 }
20
21 defineExpose({
22 open
23 })
24 </script>
25
26 <style lang="scss" scoped>
27
28 </style>
...@@ -60,15 +60,16 @@ ...@@ -60,15 +60,16 @@
60 <div> 60 <div>
61 <el-row justify="space-between"> 61 <el-row justify="space-between">
62 <el-row class="hz-p" style="flex: 1"> 62 <el-row class="hz-p" style="flex: 1">
63 <el-col :span="8"> 63 <el-col :span="12">
64 <div >{{ language==0?'套餐说明':'Package Description' }}: <span style="margin-right: 20px">{{n.introduction}}</span></div> 64 <div @click="hazelView(n)" :class="{esp_3:n.active}" >{{ language==0?'套餐说明':'Package Description' }}: <span style="margin-right: 20px">{{n.introduction}}</span></div>
65 </el-col> 65 </el-col>
66 66
67 <el-col :span="8"> 67 <el-col :span="5" style="padding-left: 20px">
68 <div>{{ language==0?'剩余':'' }}<span class="sign">{{ n.num-n.counts }}</span>{{language==0?'名额':'Places Remaining' }} </div> 68 <div>{{ language==0?'剩余':'' }}<span class="sign">{{ n.num-n.counts }}</span>{{language==0?'名额':'Places Remaining' }} </div>
69 </el-col> 69 </el-col>
70 <el-col :span="8"> 70 <el-col :span="7">
71 <div >{{n.goHome==1?language==0?'上门化妆':'Door-to-door makeup':''}}</div> 71 <div v-if="language==0" >地点:{{n.address}}</div>
72 <div v-else >address:{{n.addressEn}}</div>
72 </el-col> 73 </el-col>
73 </el-row> 74 </el-row>
74 <el-row> 75 <el-row>
...@@ -86,17 +87,20 @@ ...@@ -86,17 +87,20 @@
86 :image="`/img/order_no.png`" 87 :image="`/img/order_no.png`"
87 :image-size="200"/> 88 :image-size="200"/>
88 </div> 89 </div>
90 <Dailog ref="dialogRef"></Dailog>
89 </div> 91 </div>
90 </template> 92 </template>
91 93
92 <script setup> 94 <script setup>
93 import {ref} from "vue"; 95 import {ref,onMounted,getCurrentInstance} from "vue";
94 import {dayjs} from "element-plus"; 96 import {dayjs} from "element-plus";
95 import {useRoute,useRouter} from 'vue-router' 97 import {useRoute,useRouter} from 'vue-router'
96 import * as booking from "@/apiPc/booking" 98 import * as booking from "@/apiPc/booking"
97 import {useStorage} from "@vueuse/core/index"; 99 import {useStorage} from "@vueuse/core/index";
98 import useUserStore from "/@/store/modules/user"; 100 import useUserStore from "/@/store/modules/user";
99 101 import {getBaseInfoByActiveId} from "@/apiPc/booking";
102 import{ElMessageBox} from 'element-plus'
103 import Dailog from "/@/viewsPc/booking/component/dailog.vue";
100 const user = useUserStore().user 104 const user = useUserStore().user
101 const language = useStorage('language', 0) 105 const language = useStorage('language', 0)
102 const router = useRouter() 106 const router = useRouter()
...@@ -106,19 +110,45 @@ const currentDate1 = ref(new Date()) ...@@ -106,19 +110,45 @@ const currentDate1 = ref(new Date())
106 const calendarRange = ref([dayjs(currentDate.value).toDate(),(dayjs(currentDate.value).toDate())]) 110 const calendarRange = ref([dayjs(currentDate.value).toDate(),(dayjs(currentDate.value).toDate())])
107 const schList = ref([]) 111 const schList = ref([])
108 const loading = ref(false) 112 const loading = ref(false)
113 const formTime=ref()
114 const {proxy} = getCurrentInstance()
109 const query = ref({ 115 const query = ref({
110 lasId:route.params.id, 116 lasId:route.params.id,
111 }) 117 })
112 const value2=ref('') 118 const value2=ref('')
113 119
120 onMounted(() => {
121 getBaseInfoByActiveId(route.params.cptId).then(res=>{
122 formTime.value = res.data || null
123 }).catch(err=>{
124 console.log(err)
125 formTime.value = null
126 }).finally(()=>{
127 getData()
128 getScheduleList()
129 })
130 })
131
132 function getData(){
133 if (!formTime.value.mealStart) return
134 const toDay=dayjs(dayjs().format('YYYY-MM-DD')).valueOf()
135 const start=dayjs(formTime.value.mealStart).valueOf()
136 if(toDay<start){
137 currentDate1.value= query.value.currentDate = dayjs(start).format('YYYY-MM-DD')
138
139 }else{
140 currentDate1.value = query.value.currentDate = dayjs(toDay).format('YYYY-MM-DD')
141 }
142 }
114 143
115 getScheduleList()
116 function getScheduleList() { 144 function getScheduleList() {
117 loading.value = true 145 loading.value = true
118 query.value.currentDate = dayjs(currentDate.value).format('YYYY-MM-DD') 146 // query.value.currentDate = dayjs(currentDate.value).format('YYYY-MM-DD')
147 if(!query.value.currentDate)return proxy.$message.error('请选择时间')
119 booking.getActivityMealVoListByStudioId(query.value).then(res=>{ 148 booking.getActivityMealVoListByStudioId(query.value).then(res=>{
120 loading.value = false 149 loading.value = false
121 schList.value = res.data 150 schList.value = res.data
151 schList.value.forEach(item=>item.active=true)
122 }) 152 })
123 } 153 }
124 function selectDate(date) { 154 function selectDate(date) {
...@@ -133,12 +163,18 @@ function dateChange(){ ...@@ -133,12 +163,18 @@ function dateChange(){
133 getScheduleList() 163 getScheduleList()
134 } 164 }
135 165
166 function hazelView(n){
167 proxy.$refs['dialogRef'].open(n.details)
168 }
169
136 function goMatch(n) { 170 function goMatch(n) {
137 if (!user) { 171 if (!user) {
138 useUserStore().setVisitor() 172 useUserStore().setVisitor()
139 return 173 return
140 } 174 }
141 175
176 ElMessageBox.confirm(language.value==0?`你当前所预约的时间为${query.value.currentDate}是否确定?`:`Your current appointment is ${query.value.currentDate}. Are you sure?`,{type:'warning'})
177 .then(() => {
142 router.push({ 178 router.push({
143 name: 'makeUpOrder', 179 name: 'makeUpOrder',
144 params: { 180 params: {
...@@ -148,12 +184,15 @@ function goMatch(n) { ...@@ -148,12 +184,15 @@ function goMatch(n) {
148 date: dayjs(currentDate.value).format('YYYY-MM-DD') 184 date: dayjs(currentDate.value).format('YYYY-MM-DD')
149 } 185 }
150 }) 186 })
187 })
188 .catch(() => {
189 // catch error
190 })
191
192
193
151 } 194 }
152 195
153 // function disabledDate(e){
154 // return e.getTime()<=Date.now()
155 // console.log(e)
156 // }
157 </script> 196 </script>
158 197
159 <style scoped lang="scss"> 198 <style scoped lang="scss">
......
...@@ -97,6 +97,10 @@ ...@@ -97,6 +97,10 @@
97 </el-col> 97 </el-col>
98 <el-col :span="8" v-else>{{ language==0?'无早餐':'No breakfast' }}</el-col> 98 <el-col :span="8" v-else>{{ language==0?'无早餐':'No breakfast' }}</el-col>
99 </el-row> 99 </el-row>
100 <div class="tagbox esp">
101 <span v-for="(t,index) in r.label?.split(',')" v-show="index<4">{{t}}</span>
102 <a v-show="r.label?.split(',').length>4">{{ language==0?'更多':'MORE' }} ></a>
103 </div>
100 </el-col> 104 </el-col>
101 <el-col :span="3"> 105 <el-col :span="3">
102 <div class="price">{{ language==0?'¥':'€' }}<span>{{language==0?r.roomPrice:r.roomPriceEn}}</span></div> 106 <div class="price">{{ language==0?'¥':'€' }}<span>{{language==0?r.roomPrice:r.roomPriceEn}}</span></div>
......
...@@ -46,13 +46,13 @@ ...@@ -46,13 +46,13 @@
46 46
47 <div style="flex: 1"> 47 <div style="flex: 1">
48 <!-- <div style="margin-bottom: 20px">预约时间&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">09:00~12:00</span> </div>--> 48 <!-- <div style="margin-bottom: 20px">预约时间&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">09:00~12:00</span> </div>-->
49 <div v-if="language==0" style="margin-bottom: 20px">上门化妆 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{ formDatas.goHome==1?'是':'否' }}</span></div> 49 <div v-if="language==0" style="margin-bottom: 20px">地点 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span class="span">{{ formDatas.address}}</span></div>
50 <div v-else style="margin-bottom: 20px">Home makeup &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{ formDatas.goHome==1?'YES':'NO' }}</span></div> 50 <div v-else style="margin-bottom: 20px">Address &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{ formDatas.addressEn}}</span></div>
51 <div >{{ language==0?' 价格':"Price" }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="sign">{{language==0? '¥'+formDatas.mealPrice:'€'+formDatas.mealPriceEn }}</span></div> 51 <div >{{ language==0?' 价格':"Price" }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="sign">{{language==0? '¥'+formDatas.mealPrice:'€'+formDatas.mealPriceEn }}</span></div>
52 </div> 52 </div>
53 53
54 <div style="flex: 1"> 54 <div style="flex: 1">
55 <div style="margin-bottom: 20px">{{ language==0?'套餐说明':"Package description" }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{formDatas.introduction}}</span></div> 55 <div @click="hazelView(formDatas)" style="margin-bottom: 20px" :class="{esp_3:active}" class="s">{{ language==0?'套餐说明':"Package description" }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{formDatas.introduction}}</span></div>
56 <!-- <div >价格&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="sign">{{language==0? '¥'+formDatas.mealPrice:'€'+formDatas.mealPriceEn }}</span></div>--> 56 <!-- <div >价格&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="sign">{{language==0? '¥'+formDatas.mealPrice:'€'+formDatas.mealPriceEn }}</span></div>-->
57 </div> 57 </div>
58 </el-row> 58 </el-row>
...@@ -110,6 +110,8 @@ ...@@ -110,6 +110,8 @@
110 <div style="height: 60px;"></div> 110 <div style="height: 60px;"></div>
111 111
112 </div> 112 </div>
113 <Dailog ref="dialogRef"></Dailog>
114
113 </div> 115 </div>
114 </template> 116 </template>
115 117
...@@ -123,11 +125,14 @@ import dayjs from 'dayjs' ...@@ -123,11 +125,14 @@ import dayjs from 'dayjs'
123 import {ElMessage, ElMessageBox} from "element-plus"; 125 import {ElMessage, ElMessageBox} from "element-plus";
124 import useUserStore from "@/store/modules/user"; 126 import useUserStore from "@/store/modules/user";
125 import {formatDate} from "/@/utils"; 127 import {formatDate} from "/@/utils";
128 import Dailog from "/@/viewsPc/booking/component/dailog.vue";
129
126 const { proxy } = getCurrentInstance() 130 const { proxy } = getCurrentInstance()
127 const user = useUserStore().user 131 const user = useUserStore().user
128 const language = useStorage('language', 0) 132 const language = useStorage('language', 0)
129 const router = useRouter() 133 const router = useRouter()
130 const route = useRoute() 134 const route = useRoute()
135 const active=ref(true)
131 const room = ref({}) 136 const room = ref({})
132 const form = ref({ 137 const form = ref({
133 num: '1', 138 num: '1',
...@@ -275,6 +280,11 @@ function changeMaony(){ ...@@ -275,6 +280,11 @@ function changeMaony(){
275 } 280 }
276 281
277 } 282 }
283
284 function hazelView(n){
285 proxy.$refs['dialogRef'].open(n.details)
286 }
287
278 </script> 288 </script>
279 289
280 <style scoped lang="scss"> 290 <style scoped lang="scss">
......
...@@ -63,10 +63,20 @@ ...@@ -63,10 +63,20 @@
63 </el-col> 63 </el-col>
64 <el-col> 64 <el-col>
65 {{ language == 0 ?'套餐':'Package' }}{{ formInfo.mealName }} <span style="margin-left: 40px">{{ language==0?'价格':'Price' }}</span><span class="price">{{language==0? '¥'+formInfo.mealPrice:'€'+ formInfo.mealPriceEn}}</span> 65 {{ language == 0 ?'套餐':'Package' }}{{ formInfo.mealName }} <span style="margin-left: 40px">{{ language==0?'价格':'Price' }}</span><span class="price">{{language==0? '¥'+formInfo.mealPrice:'€'+ formInfo.mealPriceEn}}</span>
66 <span style="margin-left: 40px">{{language==0?'工作室电话':'Studio phone number' }}{{formInfo.contact}}</span>
66 </el-col> 67 </el-col>
67 <el-col> 68 <el-col>
68 {{ language == 0 ?'套餐说明':'Package Description' }}{{ formInfo.introduction}} 69 {{ language == 0 ?'套餐说明':'Package Description' }}{{ formInfo.introduction}}
69 </el-col> 70 </el-col>
71 <el-col>
72 <div v-if="language == 0">
73 套餐详情: <span v-html="form.details"></span>
74 </div>
75 <div v-else>
76 Package details:<span v-html="form.detailsEn"></span>
77 </div>
78 <!-- {{ language == 0 ?'套餐详情':'Package details' }}{{ language == 0?form.details:form.detailsEn}}-->
79 </el-col>
70 </el-row> 80 </el-row>
71 </div> 81 </div>
72 </div> 82 </div>
...@@ -174,8 +184,21 @@ ...@@ -174,8 +184,21 @@
174 <el-col :lg="8" :md="12" :sm="12" :xs="24"> 184 <el-col :lg="8" :md="12" :sm="12" :xs="24">
175 <div class="mb10">{{ language==0?'联系人':'Contact Person' }}{{ form.contacts }}</div> 185 <div class="mb10">{{ language==0?'联系人':'Contact Person' }}{{ form.contacts }}</div>
176 </el-col> 186 </el-col>
177 <el-col :lg="8" :md="12" :sm="12" :xs="24">{{ language==0?'联系方式':'Contact Phone' }}{{ form.phone }}</el-col> 187 <el-col :lg=12 :md="12" :sm="12" :xs="24">
178 <el-col :span="24" >{{ language==0?'备注':'Remarks' }}{{ form.remarks }}</el-col> 188 <div class="mb10">
189 {{ language==0?'联系方式':'Contact Phone' }}{{ form.phone }}
190 </div>
191 </el-col>
192 <el-col :lg="8" :md="12" :sm="12" :xs="24" >
193 <div class="mb10">
194 {{ language==0?'备注':'Remarks' }}{{ form.remarks }}
195 </div>
196 </el-col>
197 <el-col :lg="8" :md="12" :sm="12" :xs="24" >
198 <div class="mb10">
199 {{ language==0?'地点':'Address' }}{{language==0? formInfo.address :formInfo.addressEn }}
200 </div>
201 </el-col>
179 </el-row> 202 </el-row>
180 <el-row v-if="type == 'photography'"> 203 <el-row v-if="type == 'photography'">
181 <el-col :lg="8" :md="12" :sm="12" :xs="24"> 204 <el-col :lg="8" :md="12" :sm="12" :xs="24">
......
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!