feat: 完成服务页面
This commit is contained in:
苟川东
parent
0bbfe8a04a
commit
6e9c8f59ff
|
|
@ -59,6 +59,13 @@
|
||||||
{
|
{
|
||||||
"navigationBarTitleText" : "完成上门"
|
"navigationBarTitleText" : "完成上门"
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"path" : "pages/order/complete-service",
|
||||||
|
"style" :
|
||||||
|
{
|
||||||
|
"navigationBarTitleText" : "完成服务"
|
||||||
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"globalStyle": {
|
"globalStyle": {
|
||||||
|
|
|
||||||
|
|
@ -1,14 +1,14 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="ctr" v-if="data !== null">
|
<view class="ctr" v-if="data !== null">
|
||||||
<view class="group">
|
<view class="form-group">
|
||||||
<view class="group-name flex-l line-after">
|
<view class="group-name flex-l line-after">
|
||||||
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
||||||
<text class="text">上门后请提交信息</text>
|
<text class="text">上门后请提交信息</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="item upload">
|
<view class="item upload">
|
||||||
<view class="info">
|
<view class="info flex-l">
|
||||||
<view class="title flex-l">拍照打卡</view>
|
<view class="title flex-l">拍照打卡</view>
|
||||||
<view class="desc flex-l">请上传上门的打卡照片</view>
|
<view class="desc flex-l">请上传上门的打卡照片（最多 10 张）</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="imgs-ctr">
|
<view class="imgs-ctr">
|
||||||
<view v-for="(imgUrl, index) in images" :key="index" @click="delImg(index)" class="img-ctr" :style="{marginRight: (index+1) % 5 === 0 ? '0' : '36rpx'}">
|
<view v-for="(imgUrl, index) in images" :key="index" @click="delImg(index)" class="img-ctr" :style="{marginRight: (index+1) % 5 === 0 ? '0' : '36rpx'}">
|
||||||
|
|
@ -158,106 +158,6 @@ const init = () => {
|
||||||
padding: 0 32rpx;
|
padding: 0 32rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
.group {
|
|
||||||
width: 100%;
|
|
||||||
background: var(--containerBgColor);
|
|
||||||
border-radius: 16rpx;
|
|
||||||
padding: 20rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-top: 32rpx;
|
|
||||||
.group-name {
|
|
||||||
width: 100%;
|
|
||||||
height: 80rpx;
|
|
||||||
position: relative;
|
|
||||||
.text {
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: #E18F00;
|
|
||||||
margin-left: 8rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.time {
|
|
||||||
.item-row {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
|
||||||
.title {
|
|
||||||
width: 200rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--titleColor);
|
|
||||||
}
|
|
||||||
.value {
|
|
||||||
width: 446rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--titleColor);
|
|
||||||
}
|
|
||||||
.value-empty {
|
|
||||||
color: var(--summaryColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.desc {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 50rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--descriptionColor);
|
|
||||||
line-height: 48rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.upload {
|
|
||||||
.info {
|
|
||||||
width: 100%;
|
|
||||||
height: 130rpx;
|
|
||||||
.title {
|
|
||||||
width: 100%;
|
|
||||||
height: 80rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--titleColor);
|
|
||||||
}
|
|
||||||
.desc {
|
|
||||||
width: 100%;
|
|
||||||
height: 50rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--descriptionColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.imgs-ctr {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 100rpx;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
.img-ctr {
|
|
||||||
width: 100rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
margin-right: 36rpx;
|
|
||||||
margin-top: 16rpx;
|
|
||||||
margin-bottom: 16rpx;
|
|
||||||
.img {
|
|
||||||
width: 100%;
|
|
||||||
height: 100%;
|
|
||||||
border-radius: 8rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.up-ctr {
|
|
||||||
width: 100rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
background: var(--contentBgColor);
|
|
||||||
border-radius: 8rpx;
|
|
||||||
margin-top: 16rpx;
|
|
||||||
margin-bottom: 16rpx;
|
|
||||||
//margin-left: 36rpx;
|
|
||||||
.up {
|
|
||||||
width: 100%;
|
|
||||||
height: 36rpx;
|
|
||||||
font-size: 20rpx;
|
|
||||||
color: var(--summaryColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bottom {
|
.bottom {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-top: 20rpx;
|
padding-top: 20rpx;
|
||||||
|
|
|
||||||
274
pages/order/complete-service.vue
Normal file
274
pages/order/complete-service.vue
Normal file
|
|
@ -0,0 +1,274 @@
|
||||||
|
<template>
|
||||||
|
<view class="ctr" v-if="data !== null">
|
||||||
|
<view class="form-group">
|
||||||
|
<view class="group-name flex-l line-after">
|
||||||
|
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
||||||
|
<text class="text">服务完成后请提交信息</text>
|
||||||
|
</view>
|
||||||
|
<view class="item upload">
|
||||||
|
<view class="info flex-l">
|
||||||
|
<view class="title flex-l">拍照打卡</view>
|
||||||
|
<view class="desc flex-l">请上传完成图片（最多 10 张）</view>
|
||||||
|
</view>
|
||||||
|
<view class="imgs-ctr">
|
||||||
|
<view v-for="(imgUrl, index) in submitData.complete_images" :key="index" @click="delImg(index)" class="img-ctr" :style="{marginRight: (index+1) % 5 === 0 ? '0' : '36rpx'}">
|
||||||
|
<image class="img" mode="aspectFill" :src="imgUrl"></image>
|
||||||
|
</view>
|
||||||
|
<view @click="upload('complete')" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
|
||||||
|
hover-start-time="0" hover-stay-time="50">
|
||||||
|
<me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
|
||||||
|
<view class="up flex-c">点击上传</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="form-group">
|
||||||
|
<view class="group-name flex-l line-after">
|
||||||
|
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
||||||
|
<text class="text">提交收款信息</text>
|
||||||
|
</view>
|
||||||
|
<view class="item input flex-sb line-after" v-if="data.order_info.receive_type === 1">
|
||||||
|
<view class="title flex-l">优惠信息</view>
|
||||||
|
<view class="uni-input flex-r">{{data.order_info.online_amount}}元抵扣{{data.order_info.discount_amount}}元</view>
|
||||||
|
</view>
|
||||||
|
<view class="item input flex-sb line-after" @click="selectFinalPaymentMethod()">
|
||||||
|
<view class="title flex-l">收款方式</view>
|
||||||
|
<view v-if="submitData.final_payment_method === null" class="select-ctr flex-r">请选择收款方式</view>
|
||||||
|
<view v-else class="select-ctr flex-r select">{{submitData.final_payment_method === 1 ? '线下尾款' : '线上尾款'}}</view>
|
||||||
|
</view>
|
||||||
|
<!-- 线下收款需选择尾款收款方-->
|
||||||
|
<view v-if="submitData.final_payment_method === 1" class="item input flex-sb line-after" @click="selectOfflineTotalType()">
|
||||||
|
<view class="title flex-l">尾款收款方</view>
|
||||||
|
<view v-if="submitData.offline_total_type === null" class="select-ctr flex-r">请选择尾款收款方</view>
|
||||||
|
<view v-else class="select-ctr flex-r select">{{submitData.offline_total_type === 1 ? '师傅收' : '公司收'}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="item input flex-sb line-after">
|
||||||
|
<view class="title flex-l">收款金额</view>
|
||||||
|
<view class="input-ctr">
|
||||||
|
<input type="digit" v-model="submitData.amount" class="uni-input" placeholder-class="placeholder-class" placeholder="请输入收款金额"/>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="item upload">
|
||||||
|
<view class="info flex-l">
|
||||||
|
<view class="title flex-l">收款信息</view>
|
||||||
|
<view class="desc flex-l">请上传收款成功图片（最多 1 张）</view>
|
||||||
|
</view>
|
||||||
|
<view class="imgs-ctr">
|
||||||
|
<view v-if="submitData.payment_image === ''" @click="upload('collectPayment')" class="up-ctr flex-direction-column" hover-class="auto-mask-layer-radius4"
|
||||||
|
hover-start-time="0" hover-stay-time="50">
|
||||||
|
<me-icon class="icon" type="icon-upload-cloud-fill" color="var(--summaryColor)" size="36rpx"></me-icon>
|
||||||
|
<view class="up flex-c">点击上传</view>
|
||||||
|
</view>
|
||||||
|
<view v-else @click="delPaymentImg()" class="img-ctr">
|
||||||
|
<image class="img" mode="aspectFill" :src="submitData.payment_image"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<me-empty-space height="376"></me-empty-space>
|
||||||
|
<view class="bottom">
|
||||||
|
<me-button @click="submit()" text="提 交" width="686rpx" icon-type="icon-checkbox-circle" margin-top="32rpx"></me-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script setup>
|
||||||
|
|
||||||
|
import MeIcon from "../../components/me-icon/me-icon.vue";
|
||||||
|
import MeEmptySpace from "../../components/me-empty-space/me-empty-space.vue";
|
||||||
|
import MeButton from "../../components/me-button/me-button.vue";
|
||||||
|
import helpers from "../../utils/helpers";
|
||||||
|
import {ref, reactive} from 'vue'
|
||||||
|
import {onLoad} from '@dcloudio/uni-app'
|
||||||
|
import api from "../../api/api";
|
||||||
|
import {throttle} from "../../utils/throttle";
|
||||||
|
import enums from "../../utils/enums";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 上传完成图片
|
||||||
|
* @param type 上传类型:complete=完成图片,collectPayment=收款图片
|
||||||
|
*/
|
||||||
|
const upload = (type) => {
|
||||||
|
uni.chooseImage({
|
||||||
|
count: 1,
|
||||||
|
sizeType: ['original'],
|
||||||
|
sourceType: ['camera'],
|
||||||
|
success: (chooseImageRes) => {
|
||||||
|
if (chooseImageRes.tempFiles[0].size / 1024 / 1024 > 10) {
|
||||||
|
return helpers.showToast('照片不能超过10M')
|
||||||
|
}
|
||||||
|
|
||||||
|
uni.showLoading({
|
||||||
|
title: '上传中'
|
||||||
|
});
|
||||||
|
|
||||||
|
let tempFilePath = chooseImageRes.tempFilePaths[0]
|
||||||
|
api.getOssParams({name: tempFilePath}).then(res => {
|
||||||
|
uni.uploadFile({
|
||||||
|
url: res.cdnurl,
|
||||||
|
filePath: tempFilePath,
|
||||||
|
name: 'file',
|
||||||
|
timeout: 30 * 1000,
|
||||||
|
formData: {
|
||||||
|
'signature': res.signature,
|
||||||
|
'ossAccessKeyId': res.OSSAccessKeyId,
|
||||||
|
'policy': res.policy,
|
||||||
|
'key': res.key,
|
||||||
|
},
|
||||||
|
success(r) {
|
||||||
|
if (r.statusCode === undefined || r.statusCode !== 204) {
|
||||||
|
helpers.showToast('上传文件失败')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
let fullUrl = res.cdnurl + '/' + res.key
|
||||||
|
|
||||||
|
if (type === 'complete') {
|
||||||
|
submitData.complete_images.push(fullUrl)
|
||||||
|
}
|
||||||
|
|
||||||
|
if (type === 'collectPayment') {
|
||||||
|
submitData.payment_image = fullUrl
|
||||||
|
}
|
||||||
|
|
||||||
|
helpers.showToast('上传成功')
|
||||||
|
},
|
||||||
|
fail(e) {
|
||||||
|
helpers.showToast('上传文件失败')
|
||||||
|
console.log(e)
|
||||||
|
},
|
||||||
|
complete() {
|
||||||
|
uni.hideLoading();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}).catch(() => {})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
//删除完成图片
|
||||||
|
const delImg = (idx) => {
|
||||||
|
submitData.complete_images.splice(idx, 1)
|
||||||
|
helpers.showToast('图片已删除')
|
||||||
|
}
|
||||||
|
|
||||||
|
//删除收款图片
|
||||||
|
const delPaymentImg = () => {
|
||||||
|
submitData.payment_image = ''
|
||||||
|
helpers.showToast('图片已删除')
|
||||||
|
}
|
||||||
|
|
||||||
|
//提交
|
||||||
|
const submit = throttle(() => {
|
||||||
|
if (!validate()) {
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
console.log(submitData)
|
||||||
|
})
|
||||||
|
|
||||||
|
const id = ref(null)
|
||||||
|
onLoad((params) => {
|
||||||
|
id.value = params.id
|
||||||
|
init()
|
||||||
|
})
|
||||||
|
|
||||||
|
const data = ref(null)
|
||||||
|
const init = () => {
|
||||||
|
api.orderInfo({order_dispatch_id: id.value}).then(res => {
|
||||||
|
if (res.status !== enums.ORDER_DISPATCH_STATUS.STATUS_CLOCK) {
|
||||||
|
return helpers.showToast('该订单不可完成')
|
||||||
|
}
|
||||||
|
|
||||||
|
data.value = res
|
||||||
|
}).catch(() => {})
|
||||||
|
}
|
||||||
|
|
||||||
|
//提交数据
|
||||||
|
const submitData = reactive({
|
||||||
|
complete_images: [],//完成图片
|
||||||
|
final_payment_method: null,//尾款支付方式：1=线下尾款,2=线上尾款
|
||||||
|
offline_total_type: null,//尾款收款方：1=师傅收,2=公司收
|
||||||
|
amount: '',//收款金额
|
||||||
|
payment_image: '',//收款图片
|
||||||
|
})
|
||||||
|
|
||||||
|
const selectFinalPaymentMethod = () => {
|
||||||
|
uni.showActionSheet({
|
||||||
|
itemList: ['线下尾款', '线上尾款'],
|
||||||
|
success: function (res) {
|
||||||
|
submitData.final_payment_method = res.tapIndex + 1
|
||||||
|
},
|
||||||
|
fail: function (res) {
|
||||||
|
console.log(res.errMsg);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const selectOfflineTotalType = () => {
|
||||||
|
uni.showActionSheet({
|
||||||
|
itemList: ['师傅收', '公司收'],
|
||||||
|
success: function (res) {
|
||||||
|
submitData.offline_total_type = res.tapIndex + 1
|
||||||
|
},
|
||||||
|
fail: function (res) {
|
||||||
|
console.log(res.errMsg);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
const validate = () => {
|
||||||
|
if (submitData.complete_images.length === 0) {
|
||||||
|
helpers.showToast('请上传完成图片')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (submitData.final_payment_method === null) {
|
||||||
|
helpers.showToast('请选择收款方式')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (submitData.amount === '') {
|
||||||
|
helpers.showToast('请输入收款金额')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
if (submitData.payment_image === '') {
|
||||||
|
helpers.showToast('请上传收款信息')
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
|
||||||
|
return true
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.ctr {
|
||||||
|
padding: 0 32rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
height: 100vh;
|
||||||
|
.bottom {
|
||||||
|
width: 100%;
|
||||||
|
padding-top: 20rpx;
|
||||||
|
padding-bottom: 68rpx;
|
||||||
|
background: var(--pageBgColor);
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
@ -50,22 +50,27 @@
|
||||||
</view>
|
</view>
|
||||||
<me-empty-space height="376"></me-empty-space>
|
<me-empty-space height="376"></me-empty-space>
|
||||||
|
|
||||||
<!-- 待接单-->
|
<!-- 待接单-->
|
||||||
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_TOGET">
|
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_TOGET">
|
||||||
<me-button @click="rejectOrder()" active-color="var(--contentBgColor)" text="拒 绝" width="686rpx" text-color="var(--titleColor)"></me-button>
|
<me-button @click="rejectOrder()" active-color="var(--contentBgColor)" text="拒 绝" width="686rpx" text-color="var(--titleColor)"></me-button>
|
||||||
<me-button @click="acceptOrder()" text="确认接单" width="686rpx" icon-type="icon-flashlight" margin-top="32rpx"></me-button>
|
<me-button @click="acceptOrder()" text="确认接单" width="686rpx" icon-type="icon-flashlight" margin-top="32rpx"></me-button>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 待和客户确认上门时间-->
|
<!-- 待和客户确认上门时间-->
|
||||||
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_GOTIT">
|
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_GOTIT">
|
||||||
<me-button @click="selectTime()" text="已和客户沟通" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
|
<me-button @click="selectTime()" text="已和客户沟通" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<!-- 待上门-->
|
<!-- 待上门-->
|
||||||
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_PLANIT">
|
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_PLANIT">
|
||||||
<me-button @click="openLocation()" active-color="var(--contentBgColor)" icon-type="icon-navigation" text="导航至客户地址" width="686rpx" text-color="var(--titleColor)" custom-icon-color="var(--titleColor)"></me-button>
|
<me-button @click="openLocation()" active-color="var(--contentBgColor)" icon-type="icon-navigation" text="导航至客户地址" width="686rpx" text-color="var(--titleColor)" custom-icon-color="var(--titleColor)"></me-button>
|
||||||
<me-button @click="arrivedOnSite()" text="完成上门" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
|
<me-button @click="arrivedOnSite()" text="完成上门" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
|
<!-- 完成服务-->
|
||||||
|
<view class="bottom" v-if="data.status === enums.ORDER_DISPATCH_STATUS.STATUS_CLOCK">
|
||||||
|
<me-button @click="completeService()" text="完成服务" width="686rpx" icon-type="icon-arrow-right-circle" margin-top="32rpx"></me-button>
|
||||||
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
@ -99,6 +104,11 @@ const arrivedOnSite = () => {
|
||||||
helpers.jumpToPage('arrived-on-site', 'id=' + id.value)
|
helpers.jumpToPage('arrived-on-site', 'id=' + id.value)
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//完成服务
|
||||||
|
const completeService = () => {
|
||||||
|
helpers.jumpToPage('complete-service', 'id=' + id.value)
|
||||||
|
}
|
||||||
|
|
||||||
//选择上门时间
|
//选择上门时间
|
||||||
const selectTime = () => {
|
const selectTime = () => {
|
||||||
helpers.jumpToPage('select-time', 'id=' + id.value)
|
helpers.jumpToPage('select-time', 'id=' + id.value)
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<template>
|
<template>
|
||||||
<view class="ctr" v-if="data !== null">
|
<view class="ctr" v-if="data !== null">
|
||||||
<view class="group">
|
<view class="form-group">
|
||||||
<view class="group-name flex-l line-after">
|
<view class="group-name flex-l line-after">
|
||||||
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
<me-icon class="icon" type="icon-info" color="#E18F00" size="40rpx"></me-icon>
|
||||||
<text class="text">沟通后请提交信息</text>
|
<text class="text">沟通后请提交信息</text>
|
||||||
|
|
@ -85,55 +85,6 @@ const init = () => {
|
||||||
padding: 0 32rpx;
|
padding: 0 32rpx;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
height: 100vh;
|
height: 100vh;
|
||||||
.group {
|
|
||||||
width: 100%;
|
|
||||||
background: var(--containerBgColor);
|
|
||||||
border-radius: 16rpx;
|
|
||||||
padding: 20rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-top: 32rpx;
|
|
||||||
.group-name {
|
|
||||||
width: 100%;
|
|
||||||
height: 80rpx;
|
|
||||||
position: relative;
|
|
||||||
.text {
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: #E18F00;
|
|
||||||
margin-left: 8rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.time {
|
|
||||||
.item-row {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
|
||||||
.title {
|
|
||||||
width: 200rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--titleColor);
|
|
||||||
}
|
|
||||||
.value {
|
|
||||||
width: 446rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--titleColor);
|
|
||||||
}
|
|
||||||
.value-empty {
|
|
||||||
color: var(--summaryColor);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.desc {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 50rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--descriptionColor);
|
|
||||||
line-height: 48rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.bottom {
|
.bottom {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-top: 20rpx;
|
padding-top: 20rpx;
|
||||||
|
|
|
||||||
|
|
@ -1,404 +1,129 @@
|
||||||
.form-area {
|
.form-group {
|
||||||
margin-top: 20rpx;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 20rpx 40rpx;
|
background: var(--containerBgColor);
|
||||||
box-sizing: border-box;
|
|
||||||
background: var(--blockBgColor);
|
|
||||||
border-radius: 16rpx;
|
border-radius: 16rpx;
|
||||||
|
padding: 20rpx;
|
||||||
.form-area-title {
|
box-sizing: border-box;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
.group-name {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 60rpx;
|
height: 80rpx;
|
||||||
font-size: 34rpx;
|
|
||||||
color: var(--contentColor50);
|
|
||||||
line-height: 60rpx;
|
|
||||||
text-align: left;
|
|
||||||
margin-bottom: 20rpx;
|
|
||||||
}
|
|
||||||
.uni-forms-item {
|
|
||||||
margin-bottom: 0 !important;
|
|
||||||
.uni-forms-item__content {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.input-item {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 20rpx;
|
.text {
|
||||||
.title {
|
|
||||||
width: 100%;
|
|
||||||
height: 60rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 30rpx;
|
font-size: 30rpx;
|
||||||
color: var(--contentColor90);
|
color: #E18F00;
|
||||||
line-height: 60rpx;
|
margin-left: 8rpx;
|
||||||
text-align: left;
|
|
||||||
.left {
|
|
||||||
height: 100%;
|
|
||||||
width: 300rpx;
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
width: 300rpx;
|
|
||||||
height: 100%;
|
|
||||||
//添加项目
|
|
||||||
.add-project {
|
|
||||||
width: 140rpx;
|
|
||||||
height: 60rpx;
|
|
||||||
background: var(--themeColor10);
|
|
||||||
border-radius: 8rpx;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: var(--themeColor);
|
|
||||||
}
|
|
||||||
.setting {
|
|
||||||
width: 140rpx;
|
|
||||||
height: 100%;
|
|
||||||
font-size: 28rpx;
|
|
||||||
font-weight: 400;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.required::before {
|
}
|
||||||
content: '*';
|
.item {
|
||||||
font-weight: 500;
|
width: 100%;
|
||||||
font-size: 32rpx;
|
}
|
||||||
color: #E6521F;
|
.time {
|
||||||
left: -24rpx;
|
.item-row {
|
||||||
position: absolute;
|
|
||||||
}
|
|
||||||
.value {
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 100rpx;
|
height: 100rpx;
|
||||||
.input-textarea {
|
.title {
|
||||||
height: 120rpx;
|
width: 200rpx;
|
||||||
padding: 20rpx 0;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 40rpx;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.mixed-payment-items {
|
|
||||||
width: 100%;
|
|
||||||
margin-bottom: 20rpx;
|
|
||||||
animation: animation-fade-out 0.3s ease-out 0s 1;
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
.icon {
|
|
||||||
width: 56rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
}
|
|
||||||
.content {
|
|
||||||
width: 558rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
.title {
|
|
||||||
width: 202rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 80rpx;
|
|
||||||
text-align: left;
|
|
||||||
font-weight: 400;
|
|
||||||
.help {
|
|
||||||
width: 50rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.detail {
|
|
||||||
width: 372rpx;
|
|
||||||
height: 80rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 56rpx;
|
|
||||||
.price {
|
|
||||||
width: 160rpx;
|
|
||||||
height: 56rpx;
|
|
||||||
background: var(--contentColor05);
|
|
||||||
border-radius: 8rpx;
|
|
||||||
.unit {
|
|
||||||
width: 40rpx;
|
|
||||||
height: 56rpx;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.val {
|
|
||||||
width: 120rpx;
|
|
||||||
height: 56rpx;
|
|
||||||
.uni-input {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 56rpx;
|
|
||||||
text-align: center;
|
|
||||||
padding: 0 8rpx;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.uni-input {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.item-image {
|
|
||||||
margin-top: 20rpx;
|
|
||||||
margin-bottom: 24rpx;
|
|
||||||
.empty-image {
|
|
||||||
width: 630rpx;
|
|
||||||
height: 384rpx;
|
|
||||||
border-radius: 40rpx;
|
|
||||||
border: 1rpx solid var(--contentColor10);
|
|
||||||
box-sizing: border-box;
|
|
||||||
.upload-image {
|
|
||||||
width: 120rpx;
|
|
||||||
height: 128rpx;
|
|
||||||
.icon {
|
|
||||||
width: 100%;
|
|
||||||
height: 80rpx;
|
|
||||||
}
|
|
||||||
.upload-text {
|
|
||||||
width: 100%;
|
|
||||||
height: 48rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor30);
|
|
||||||
line-height: 48rpx;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.image-container {
|
|
||||||
width: 630rpx;
|
|
||||||
height: 384rpx;
|
|
||||||
.image {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
border-radius: 40rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.select-project {
|
|
||||||
.empty-project {
|
|
||||||
animation: animation-fade-out 0.3s ease-out 0s 1;
|
|
||||||
.input-or-select {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
|
||||||
.input-area {
|
|
||||||
height: 100%;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.project-list {
|
|
||||||
margin-top: 16rpx;
|
|
||||||
margin-bottom: 16rpx;
|
|
||||||
.project {
|
|
||||||
width: 100%;
|
|
||||||
min-height: 80rpx;
|
|
||||||
.name {
|
|
||||||
min-height: 80rpx;
|
|
||||||
width: 314rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 48rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.other {
|
|
||||||
height: 100%;
|
|
||||||
width: 316rpx;
|
|
||||||
.price,.balance {
|
|
||||||
width: 110rpx;
|
|
||||||
height: 48rpx;
|
|
||||||
}
|
|
||||||
.price {
|
|
||||||
border-bottom: 1rpx solid var(--themeColor);
|
|
||||||
.uni-input {
|
|
||||||
width: 100%;
|
|
||||||
height: 48rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--themeColor);
|
|
||||||
line-height: 48rpx;
|
|
||||||
text-align: center;
|
|
||||||
min-height: 48rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.balance {
|
|
||||||
font-size: 24rpx;
|
|
||||||
color: var(--contentColor50);
|
|
||||||
line-height: 48rpx;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.num-area {
|
|
||||||
height: 100%;
|
|
||||||
width: 176rpx;
|
|
||||||
.reduce,.add {
|
|
||||||
width: 48rpx;
|
|
||||||
height: 48rpx;
|
|
||||||
}
|
|
||||||
.num {
|
|
||||||
width: 80rpx;
|
|
||||||
height: 100%;
|
|
||||||
font-weight: 500;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 80rpx;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
.val-area {
|
|
||||||
height: 100%;
|
|
||||||
width: 350rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.val-hint {
|
|
||||||
height: 100%;
|
|
||||||
width: 280rpx;
|
|
||||||
.hint {
|
|
||||||
height: 100%;
|
|
||||||
width: 224rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--contentColor50);
|
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.unit {
|
|
||||||
width: 280rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
height: 100rpx;
|
height: 100rpx;
|
||||||
color: var(--contentColor90);
|
font-size: 30rpx;
|
||||||
text-align: right;
|
color: var(--titleColor);
|
||||||
line-height: 100rpx;
|
|
||||||
}
|
}
|
||||||
|
.value {
|
||||||
//区间筛选
|
width: 446rpx;
|
||||||
.section-value {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
height: 100rpx;
|
||||||
.min,.max {
|
font-size: 30rpx;
|
||||||
width: 280rpx;
|
color: var(--titleColor);
|
||||||
height: 100rpx;
|
}
|
||||||
font-size: 30rpx;
|
.value-empty {
|
||||||
color: var(--contentColor90);
|
color: var(--summaryColor);
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.parting {
|
|
||||||
width: 70rpx;
|
|
||||||
height: 100rpx;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor50);
|
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.max {
|
|
||||||
text-align: right;
|
|
||||||
.uni-input {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.desc {
|
.desc {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 60rpx;
|
min-height: 50rpx;
|
||||||
text-align: left;
|
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
color: var(--contentColor30);
|
color: var(--descriptionColor);
|
||||||
|
line-height: 48rpx;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.upload {
|
||||||
.input-item-switch {
|
.info {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-height: 120rpx;
|
height: 80rpx;
|
||||||
position: relative;
|
|
||||||
.content-area {
|
|
||||||
margin-bottom: 20rpx;
|
|
||||||
}
|
|
||||||
.left {
|
|
||||||
height: 100%;
|
|
||||||
.title {
|
.title {
|
||||||
font-weight: 500;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor90);
|
|
||||||
line-height: 120rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.help {
|
|
||||||
width: 56rpx;
|
|
||||||
height: 56rpx;
|
|
||||||
}
|
|
||||||
.title-area {
|
|
||||||
width: 460rpx;
|
|
||||||
height: 120rpx;
|
|
||||||
.title-val {
|
|
||||||
height: 60rpx;
|
|
||||||
line-height: 60rpx;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
.desc {
|
|
||||||
height: 48rpx;
|
|
||||||
font-size: 28rpx;
|
|
||||||
color: var(--contentColor30);
|
|
||||||
line-height: 48rpx;
|
|
||||||
text-align: left;
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.right {
|
|
||||||
width: 140rpx;
|
|
||||||
height: 100%;
|
|
||||||
position: absolute;
|
|
||||||
right: -12rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.input-avatar {
|
|
||||||
.avatar {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
|
||||||
margin-bottom: 20rpx;
|
|
||||||
.desc {
|
|
||||||
width: 500rpx;
|
|
||||||
height: 100%;
|
|
||||||
font-size: 30rpx;
|
|
||||||
color: var(--contentColor30);
|
|
||||||
line-height: 100rpx;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
.store-avatar {
|
|
||||||
width: 80rpx;
|
|
||||||
height: 80rpx;
|
height: 80rpx;
|
||||||
border-radius: 40rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.input-select {
|
|
||||||
.value {
|
|
||||||
width: 100%;
|
|
||||||
height: 100rpx;
|
|
||||||
.val {
|
|
||||||
width: 566rpx;
|
|
||||||
height: 100%;
|
|
||||||
font-size: 30rpx;
|
font-size: 30rpx;
|
||||||
line-height: 100rpx;
|
color: var(--titleColor);
|
||||||
text-align: left;
|
}
|
||||||
|
.desc {
|
||||||
|
margin-left: 8rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: var(--descriptionColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.imgs-ctr {
|
||||||
|
width: 100%;
|
||||||
|
min-height: 100rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.img-ctr {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
margin-right: 36rpx;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
.img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.up-ctr {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
background: var(--contentBgColor);
|
||||||
|
border-radius: 8rpx;
|
||||||
|
margin-top: 16rpx;
|
||||||
|
margin-bottom: 16rpx;
|
||||||
|
.up {
|
||||||
|
width: 100%;
|
||||||
|
height: 36rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: var(--summaryColor);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
.input {
|
||||||
|
width: 100%;
|
||||||
|
height: 100rpx;
|
||||||
|
position: relative;
|
||||||
|
.title {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: var(--titleColor);
|
||||||
|
}
|
||||||
|
.input-ctr {
|
||||||
|
width: 446rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
}
|
||||||
|
.uni-input {
|
||||||
|
text-align: right;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: var(--titleColor);
|
||||||
|
}
|
||||||
|
.select-ctr {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: var(--descriptionColor);
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.select {
|
||||||
|
color: var(--titleColor);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -25,6 +25,8 @@ class helpers {
|
||||||
'select-time': '/pages/order/select-time',
|
'select-time': '/pages/order/select-time',
|
||||||
//完成上门
|
//完成上门
|
||||||
'arrived-on-site': '/pages/order/arrived-on-site',
|
'arrived-on-site': '/pages/order/arrived-on-site',
|
||||||
|
//完成服务
|
||||||
|
'complete-service': '/pages/order/complete-service',
|
||||||
}
|
}
|
||||||
|
|
||||||
url = paths[pathName]
|
url = paths[pathName]
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user