03096861 by zhangmeng

页面修改

1 parent 94d02189
......@@ -314,4 +314,8 @@ li.el-select-dropdown__item {
color: #493CEB;
}
.s{
cursor:pointer
}
</style>
......
<template>
<div>
<el-dialog
v-model="show" title="详情" :close-on-click-modal="true" width="800px">
<div v-html="content">
</div>
</el-dialog>
</div>
</template>
<script setup>
import {ref} from 'vue'
const show=ref(false)
const content=ref()
function open(row){
content.value=row
show.value=true
}
defineExpose({
open
})
</script>
<style lang="scss" scoped>
</style>
......@@ -60,15 +60,16 @@
<div>
<el-row justify="space-between">
<el-row class="hz-p" style="flex: 1">
<el-col :span="8">
<div >{{ language==0?'套餐说明':'Package Description' }}: <span style="margin-right: 20px">{{n.introduction}}</span></div>
<el-col :span="12">
<div @click="hazelView(n)" :class="{esp_3:n.active}" >{{ language==0?'套餐说明':'Package Description' }}: <span style="margin-right: 20px">{{n.introduction}}</span></div>
</el-col>
<el-col :span="8">
<el-col :span="5" style="padding-left: 20px">
<div>{{ language==0?'剩余':'' }}<span class="sign">{{ n.num-n.counts }}</span>{{language==0?'名额':'Places Remaining' }} </div>
</el-col>
<el-col :span="8">
<div >{{n.goHome==1?language==0?'上门化妆':'Door-to-door makeup':''}}</div>
<el-col :span="7">
<div v-if="language==0" >地点:{{n.address}}</div>
<div v-else >address:{{n.addressEn}}</div>
</el-col>
</el-row>
<el-row>
......@@ -86,17 +87,20 @@
:image="`/img/order_no.png`"
:image-size="200"/>
</div>
<Dailog ref="dialogRef"></Dailog>
</div>
</template>
<script setup>
import {ref} from "vue";
import {ref,onMounted,getCurrentInstance} from "vue";
import {dayjs} from "element-plus";
import {useRoute,useRouter} from 'vue-router'
import * as booking from "@/apiPc/booking"
import {useStorage} from "@vueuse/core/index";
import useUserStore from "/@/store/modules/user";
import {getBaseInfoByActiveId} from "@/apiPc/booking";
import{ElMessageBox} from 'element-plus'
import Dailog from "/@/viewsPc/booking/component/dailog.vue";
const user = useUserStore().user
const language = useStorage('language', 0)
const router = useRouter()
......@@ -106,19 +110,45 @@ const currentDate1 = ref(new Date())
const calendarRange = ref([dayjs(currentDate.value).toDate(),(dayjs(currentDate.value).toDate())])
const schList = ref([])
const loading = ref(false)
const formTime=ref()
const {proxy} = getCurrentInstance()
const query = ref({
lasId:route.params.id,
})
const value2=ref('')
onMounted(() => {
getBaseInfoByActiveId(route.params.cptId).then(res=>{
formTime.value = res.data || null
}).catch(err=>{
console.log(err)
formTime.value = null
}).finally(()=>{
getData()
getScheduleList()
})
})
function getData(){
if (!formTime.value.mealStart) return
const toDay=dayjs(dayjs().format('YYYY-MM-DD')).valueOf()
const start=dayjs(formTime.value.mealStart).valueOf()
if(toDay<start){
currentDate1.value= query.value.currentDate = dayjs(start).format('YYYY-MM-DD')
}else{
currentDate1.value = query.value.currentDate = dayjs(toDay).format('YYYY-MM-DD')
}
}
getScheduleList()
function getScheduleList() {
loading.value = true
query.value.currentDate = dayjs(currentDate.value).format('YYYY-MM-DD')
// query.value.currentDate = dayjs(currentDate.value).format('YYYY-MM-DD')
if(!query.value.currentDate)return proxy.$message.error('请选择时间')
booking.getActivityMealVoListByStudioId(query.value).then(res=>{
loading.value = false
schList.value = res.data
schList.value.forEach(item=>item.active=true)
})
}
function selectDate(date) {
......@@ -133,27 +163,36 @@ function dateChange(){
getScheduleList()
}
function hazelView(n){
proxy.$refs['dialogRef'].open(n.details)
}
function goMatch(n) {
if (!user) {
useUserStore().setVisitor()
return
}
router.push({
name: 'makeUpOrder',
params: {
lasId: n.id
},
query: {
date: dayjs(currentDate.value).format('YYYY-MM-DD')
}
})
ElMessageBox.confirm(language.value==0?`你当前所预约的时间为${query.value.currentDate}是否确定?`:`Your current appointment is ${query.value.currentDate}. Are you sure?`,{type:'warning'})
.then(() => {
router.push({
name: 'makeUpOrder',
params: {
lasId: n.id
},
query: {
date: dayjs(currentDate.value).format('YYYY-MM-DD')
}
})
})
.catch(() => {
// catch error
})
}
// function disabledDate(e){
// return e.getTime()<=Date.now()
// console.log(e)
// }
</script>
<style scoped lang="scss">
......
......@@ -97,6 +97,10 @@
</el-col>
<el-col :span="8" v-else>{{ language==0?'无早餐':'No breakfast' }}</el-col>
</el-row>
<div class="tagbox esp">
<span v-for="(t,index) in r.label?.split(',')" v-show="index<4">{{t}}</span>
<a v-show="r.label?.split(',').length>4">{{ language==0?'更多':'MORE' }} ></a>
</div>
</el-col>
<el-col :span="3">
<div class="price">{{ language==0?'¥':'€' }}<span>{{language==0?r.roomPrice:r.roomPriceEn}}</span></div>
......
......@@ -46,13 +46,13 @@
<div style="flex: 1">
<!-- <div style="margin-bottom: 20px">预约时间&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">09:00~12:00</span> </div>-->
<div v-if="language==0" style="margin-bottom: 20px">上门化妆 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{ formDatas.goHome==1?'是':'否' }}</span></div>
<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>
<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>
<div v-else style="margin-bottom: 20px">Address &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{ formDatas.addressEn}}</span></div>
<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>
</div>
<div style="flex: 1">
<div style="margin-bottom: 20px">{{ language==0?'套餐说明':"Package description" }}&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; <span class="span">{{formDatas.introduction}}</span></div>
<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>
<!-- <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>-->
</div>
</el-row>
......@@ -110,6 +110,8 @@
<div style="height: 60px;"></div>
</div>
<Dailog ref="dialogRef"></Dailog>
</div>
</template>
......@@ -123,11 +125,14 @@ import dayjs from 'dayjs'
import {ElMessage, ElMessageBox} from "element-plus";
import useUserStore from "@/store/modules/user";
import {formatDate} from "/@/utils";
import Dailog from "/@/viewsPc/booking/component/dailog.vue";
const { proxy } = getCurrentInstance()
const user = useUserStore().user
const language = useStorage('language', 0)
const router = useRouter()
const route = useRoute()
const active=ref(true)
const room = ref({})
const form = ref({
num: '1',
......@@ -275,6 +280,11 @@ function changeMaony(){
}
}
function hazelView(n){
proxy.$refs['dialogRef'].open(n.details)
}
</script>
<style scoped lang="scss">
......
......@@ -63,10 +63,20 @@
</el-col>
<el-col>
{{ language == 0 ?'套餐':'Package' }}{{ formInfo.mealName }} <span style="margin-left: 40px">{{ language==0?'价格':'Price' }}</span><span class="price">{{language==0? '¥'+formInfo.mealPrice:'€'+ formInfo.mealPriceEn}}</span>
<span style="margin-left: 40px">{{language==0?'工作室电话':'Studio phone number' }}{{formInfo.contact}}</span>
</el-col>
<el-col>
{{ language == 0 ?'套餐说明':'Package Description' }}{{ formInfo.introduction}}
</el-col>
<el-col>
<div v-if="language == 0">
套餐详情: <span v-html="form.details"></span>
</div>
<div v-else>
Package details:<span v-html="form.detailsEn"></span>
</div>
<!-- {{ language == 0 ?'套餐详情':'Package details' }}{{ language == 0?form.details:form.detailsEn}}-->
</el-col>
</el-row>
</div>
</div>
......@@ -174,8 +184,21 @@
<el-col :lg="8" :md="12" :sm="12" :xs="24">
<div class="mb10">{{ language==0?'联系人':'Contact Person' }}{{ form.contacts }}</div>
</el-col>
<el-col :lg="8" :md="12" :sm="12" :xs="24">{{ language==0?'联系方式':'Contact Phone' }}{{ form.phone }}</el-col>
<el-col :span="24" >{{ language==0?'备注':'Remarks' }}{{ form.remarks }}</el-col>
<el-col :lg=12 :md="12" :sm="12" :xs="24">
<div class="mb10">
{{ language==0?'联系方式':'Contact Phone' }}{{ form.phone }}
</div>
</el-col>
<el-col :lg="8" :md="12" :sm="12" :xs="24" >
<div class="mb10">
{{ language==0?'备注':'Remarks' }}{{ form.remarks }}
</div>
</el-col>
<el-col :lg="8" :md="12" :sm="12" :xs="24" >
<div class="mb10">
{{ language==0?'地点':'Address' }}{{language==0? formInfo.address :formInfo.addressEn }}
</div>
</el-col>
</el-row>
<el-row v-if="type == 'photography'">
<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!