yangjun
/
sadjv3_jishi
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
sadjv3_jishi/my/order/revenueDetails.vue

3480 lines
115 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="content">
<view class="nav-view">
<image class="nav-img" src="../../static/fanhui.png" mode="" @click="goBack()"></image>
<view class="nav-text">详情</view>
<view class="kong"></view>
</view>
<view class="header"></view>
<view class="mian">
<!-- 普通项目订单 -->
<view v-if="order.userPackageDetailId==null">
<!-- 普通订单 升级 或者 有升级有加钟 -->
<view v-if="order.isSupplement=='2'">
<view class="mian-top">
<view class="countDown" style="text-align: center;" v-if="order.status == 6">
<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
font-size="74" separator-size="74" @change="onCountdownChange"></u-count-down>
</view>
<view class="mian-top-head">
<image v-if="order && order.ordersMassageList"
:src="(order.ordersMassageList[0].massageType || {}).massageImg"
class="mian-top-head-img"></image>
<view class="mian-top-head-right">
<view class="mian-title" v-if="order && order.ordersMassageList">
<view class="mian-title-view">{{order.entryName}}</view>
<!-- <view class="nav-btn" v-if="order.status ==1">待支付</view> -->
<view class="nav-btn" v-if="order.status ==2">待服务</view>
<view class="nav-btn" v-if="order.status ==3">待评价</view>
<!-- <view class="nav-btn" v-if="order.status ==4">已取消</view> -->
<view class="nav-btn" v-if="order.status ==5">已完成</view>
<view class="nav-btn" v-if="order.status ==6">服务中</view>
<view class="nav-btn" v-if="order.status ==7">技师出发</view>
<view class="nav-btn" v-if="order.status ==8">技师到达</view>
<view class="nav-btn" v-if="order.status ==9">确认接单</view>
</view>
<view class="mian-time" v-if="order && order.ordersMassageList">
<text class="title-font">服务时长：</text><text
class="value-font">{{order.duration}}分钟</text>
</view>
<view class="mian-money" style="justify-content: space-between;">
<view class="flex" style="flex-direction: row;align-items: center;">
<view class="title-font">项目价格：</view>
<view class="value-font">
<span class="fuhao">￥</span>
<span class="number">
{{order.priceMarkup}}
</span>
</view>
</view>
<view class="jiajian">
<view class="jian">-</view>
<view class="view-num">{{order.massageNum}}</view>
<view class="jia">+</view>
<!-- <uni-number-box :disabled="true" :value="order.ordersMassageList[0].num" :width='27' :min="1" @change="changeValue" /> -->
</view>
</view>
</view>
</view>
<view class="mian-top-foot" @tap="bindGps(order.latitude,order.longitude,order.address)">
<view class="mian-top-foot-view">
<view class="title-font">客户信息：</view>
<view class="value-font">
<span @tap.stop="copyAddress()"
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4">
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
<u-icon name="file-text"></u-icon>
</span>
<span v-else>
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</span>
<!-- <image src="../../static/index/dianhua.png" mode=""></image> -->
</view>
</view>
<view class="mian-top-foot-view" style="margin-top: 5px;">
<view class="title-font">服务地址：</view>
<view class="value-font" style="width: 75%;text-align: right;">
{{order.address}}
</view>
</view>
</view>
</view>
<view class="mian-view">
<view class="mina-title">
<span class="mina-title-text">订单信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" @tap="copy(order.ordersNo)">
<span class="title-font">订单编号</span>
<span class="value-font">
{{order.ordersNo}}
<u-icon name="file-text" />
</span>
</view>
<view class="mian-view-list">
<span class="title-font">预约时间</span>
<span class="value-font">{{order.serveTime}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">下单时间</span>
<span class="value-font">{{order.createTime}}</span>
</view>
<view class="mian-content-textarea" v-if="order.remark!=null&&order.remark!=''">
<span class="title-font">服务备注</span>
<textarea class="textarea-mian" :disabled="true" v-model="order.remark"></textarea>
</view>
<view class="mian-content-textarea" v-if="order.earlyFinishReason!=null&&order.remark!=''">
<span class="title-font">提前结束原因</span>
<textarea class="textarea-mian" :disabled="true"
v-model="order.earlyFinishReason"></textarea>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">订单费用</span>
<span class="mina-title-bor"></span>
</view>
<!-- <view class="mian-view-list" v-if="order.oldOrdersMassageList[0].userPackageDetail">-->
<!-- <view class="title-font">{{order.packageType=='104'?'套餐':order.packageType=='105'?'次卡':order.packageType=='106'?'疗程':'其他'}}名称</view>-->
<!-- <span class="value-font">-->
<!-- {{order.oldOrdersMassageList[0].userPackageDetail.mainTitle}}-->
<!-- </span>-->
<!-- </view>-->
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font" v-if="order && order.ordersMassageList">
{{order.oldEntryName}}
</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务时长</span>
<span class="value-font">{{order.oldMassageDuration}}分钟</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font">￥{{order.oldPriceMarkup}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">会员减免</span>
<span class="value-font" style="color: #FF6000;">-￥{{order.oldVipReductionMoney}}</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">项目小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.oldMassageMoney}}</text>
</view>
</view>
<view class="mian-view-list">
<span class="title-font">优惠券</span>
<span class="value-font" style="color: #FF6000;"
v-if="order.couponMoney">-￥{{order.couponMoney}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;" v-if="order.isSupplement">
￥<text>{{order.oldProjectBenefits}}</text></view>
<view class="value-font" style="font-weight: bold;" v-else>
￥<text>{{order.projectBenefits}}</text></view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">出行费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" v-if="order.tripWay">
<view class="title-font">出行方式</view>
<view v-if="order.tripWay == 1" class="value-font">公交</view>
<view v-if="order.tripWay == 2" class="value-font">出租</view>
<view v-if="order.tripWay == 3" class="value-font">免费</view>
</view>
<view class="mian-view-list">
<span class="title-font">全程距离</span>
<span class="value-font">{{order.km}}km</span>
</view>
<view class="mian-view-list">
<view class="title-font">出行费用</view>
<view class="value-font">￥{{order.usualTravelMoney}}</view>
</view>
<view class="mian-view-list" v-if="order.nightTravelMoney">
<view class="title-font">夜间出行</view>
<view class="value-font">￥{{order.nightTravelMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<span class="title-font">收益小计：</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">升级服务</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">{{order.entryName}}</span>
</view>
<view class="mian-view-list">
<view class="title-font">服务时长</view>
<view class="value-font">{{order.duration}}分钟</view>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font" v-if="order.priceMarkup!=null">￥{{order.priceMarkup}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list">
<span class="title-font">升级差价</span>
<span class="value-font">￥{{(order.priceMarkup - order.oldPriceMarkup).toFixed(2)}}</span>
</view>
<view class="mian-view-list">
<view class="title-font">会员减免</view>
<view class="value-font" style="color: #FF6000;">-￥{{order.vipReductionMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.projectBenefits}}</text>
</view>
</view>
<view v-if="order.addNum!=null">
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">加钟信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">{{order.addEntryName}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务时长</span>
<span class="value-font">{{order.addTime}}分钟</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font"
v-if="order.addPriceMarkup!=null">￥{{order.addPriceMarkup}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list">
<view class="title-font">会员减免</view>
<view class="value-font" style="color: #FF6000;">-￥{{order.addVipReductionMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">
￥<text>{{order.addProjectBenefits}}</text></view>
</view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">预计收益</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">提成比例</span>
<span class="value-font" style="font-weight: bold;">{{order.artificerRate*100}}%</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目收益</span>
<span class="value-font" style="font-weight: bold;"
v-if="order.isSupplement">￥{{order.oldProjectBenefits}}</span>
<span class="value-font" style="font-weight: bold;" v-else>￥{{order.projectBenefits}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">车费收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">升级收益</span>
<span class="value-font"
style="font-weight: bold;">￥{{order.projectBenefits!=null?order.projectBenefits:'-'}}</span>
</view>
<view class="mian-view-list" v-if="order.addNum!=null">
<span class="title-font">加钟收益</span>
<span class="value-font"
style="font-weight: bold;">￥{{order.addProjectBenefits!=null?order.addProjectBenefits:'-'}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">门店分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.shopMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">经纪人分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.jjrArtificerDeductMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">分销员分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.fxyArtificerDeductMoneyTotal}}</span>
</view>
</view>
<view class="yiji">
<view class="yuji-title">技师收益</view>
<view class="yingde-money">
<span class="fuhao-heis">￥</span>
<span class="num-heis">
<!-- {{jishishouyi}} -->
{{order.artificerMoneyTotal}}
</span>
</view>
</view>
<view class="mian-view"
v-if="order.status=='3'||order.status=='5'||order.status=='6'||order.status=='8'">
<view v-if="order.startRemark&&order.status!='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" :disabled="true"
placeholder="请输入备注信息" name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view v-if="order.status=='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" placeholder="请输入备注信息"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status!='8'&&order.startImg">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap justify-between">
<view class="flex margin-bottom-sm"
style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in order.startImg" :key="index"
@click="saveImg( order.startImg,index)">
<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;"
mode="aspectFill">
</image>
</view>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status==8 && startImgSel != '否'">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap">
<view v-if="startImgs.length">
<view class="flex margin-right-sm flex-wrap">
<view class="flex"
style="width: 200rpx;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in startImgs" :key="index">
<image :src="pictureEcho[0]" style="width: 100%;height: 100%;"></image>
<view style="z-index: 0;position: absolute;top: -15rpx;right: -15rpx;"
@click="removeImg(index,1)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
</view>
</view>
</view>
<view class="flex align-center justify-center padding-tb "
style="background: #f5f5f5;width: 200rpx;height: 200rpx;">
<view class="text-center" @click="addImage(1)">
<image src="../static/photo.png" style="width:60upx;height: 50upx;"></image>
<view class="text-sm">上传照片</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 普通订单加钟 没有升级 -->
<view v-if="order.isSupplement!='2'&&order.addNum!=null">
<view class="mian-top">
<view class="countDown" style="text-align: center;" v-if="order.status == 6">
<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
font-size="74" separator-size="74" @change="onCountdownChange"></u-count-down>
</view>
<view class="mian-top-head">
<image v-if="order && order.ordersMassageList"
:src="(order.ordersMassageList[0].massageType || {}).massageImg"
class="mian-top-head-img"></image>
<view class="mian-top-head-right">
<view class="mian-title" v-if="order && order.ordersMassageList">
<view class="mian-title-view">{{order.entryName}}</view>
<!-- <view class="nav-btn" v-if="order.status ==1">待支付</view> -->
<view class="nav-btn" v-if="order.status ==2">待服务</view>
<view class="nav-btn" v-if="order.status ==3">待评价</view>
<!-- <view class="nav-btn" v-if="order.status ==4">已取消</view> -->
<view class="nav-btn" v-if="order.status ==5">已完成</view>
<view class="nav-btn" v-if="order.status ==6">服务中</view>
<view class="nav-btn" v-if="order.status ==7">技师出发</view>
<view class="nav-btn" v-if="order.status ==8">技师到达</view>
<view class="nav-btn" v-if="order.status ==9">确认接单</view>
</view>
<view class="mian-time" v-if="order && order.ordersMassageList">
<text class="title-font">服务时长：</text><text
class="value-font">{{order.duration}}分钟</text>
</view>
<view class="mian-money" style="justify-content: space-between;">
<view class="flex" style="flex-direction: row;align-items: center;">
<view class="title-font">项目价格：</view>
<view class="value-font">
<span class="fuhao">￥</span>
<span class="number">
{{order.priceMarkup}}
</span>
</view>
</view>
<view class="jiajian">
<view class="jian">-</view>
<view class="view-num">{{order.massageNum}}</view>
<view class="jia">+</view>
<!-- <uni-number-box :disabled="true" :value="order.ordersMassageList[0].num" :width='27' :min="1" @change="changeValue" /> -->
</view>
</view>
</view>
</view>
<view class="mian-top-foot" @tap="bindGps(order.latitude,order.longitude,order.address)">
<view class="mian-top-foot-view">
<view class="title-font">客户信息：</view>
<view class="value-font">
<span @tap.stop="copyAddress()"
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4">
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
<u-icon name="file-text"></u-icon>
</span>
<span v-else>
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</span>
<!-- <image src="../../static/index/dianhua.png" mode=""></image> -->
</view>
</view>
<view class="mian-top-foot-view" style="margin-top: 5px;">
<view class="title-font">服务地址：</view>
<view class="value-font" style="width: 75%;text-align: right;">
{{order.address}}
</view>
</view>
</view>
</view>
<view class="mian-view">
<view class="mina-title">
<span class="mina-title-text">订单信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" @tap="copy(order.ordersNo)">
<span class="title-font">订单编号</span>
<span class="value-font">
{{order.ordersNo}}
<u-icon name="file-text" />
</span>
</view>
<view class="mian-view-list">
<span class="title-font">预约时间</span>
<span class="value-font">{{order.serveTime}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">下单时间</span>
<span class="value-font">{{order.createTime}}</span>
</view>
<view class="mian-content-textarea" v-if="order.remark!=null&&order.remark!=''">
<span class="title-font">服务备注</span>
<textarea class="textarea-mian" :disabled="true" v-model="order.remark"></textarea>
</view>
<view class="mian-content-textarea" v-if="order.earlyFinishReason!=null&&order.remark!=''">
<span class="title-font">提前结束原因</span>
<textarea class="textarea-mian" :disabled="true"
v-model="order.earlyFinishReason"></textarea>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">订单费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">
{{order.entryName}}
</span>
</view>
<view class="mian-view-list">
<view class="title-font">服务时长</view>
<view class="value-font">{{order.duration}}分钟</view>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font">￥{{order.priceMarkup}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">会员减免</span>
<span class="value-font" style="color: #FF6000;">-￥{{order.vipReductionMoney}}</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">项目小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.massageMoney}}</text>
</view>
</view>
<view class="mian-view-list">
<span class="title-font">优惠券</span>
<span class="value-font" style="color: #FF6000;"
v-if="order.couponMoney">-￥{{order.couponMoney}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;" v-if="order.isSupplement">
￥<text>{{order.oldProjectBenefits}}</text></view>
<view class="value-font" style="font-weight: bold;" v-else>
￥<text>{{order.projectBenefits}}</text></view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">出行费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" v-if="order.tripWay">
<view class="title-font">出行方式</view>
<view v-if="order.tripWay == 1" class="value-font">公交</view>
<view v-if="order.tripWay == 2" class="value-font">出租</view>
<view v-if="order.tripWay == 3" class="value-font">免费</view>
</view>
<view class="mian-view-list">
<span class="title-font">全程距离</span>
<span class="value-font">{{order.km}}km</span>
</view>
<view class="mian-view-list">
<view class="title-font">出行费用</view>
<view class="value-font">￥{{order.usualTravelMoney}}</view>
</view>
<view class="mian-view-list" v-if="order.nightTravelMoney">
<view class="title-font">夜间出行</view>
<view class="value-font">￥{{order.nightTravelMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<span class="title-font">收益小计：</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">加钟信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">{{order.addEntryName}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务时长</span>
<span class="value-font">{{order.addTime}}分钟</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font" v-if="order.addPriceMarkup!=null">￥{{order.addPriceMarkup}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list">
<view class="title-font">会员减免</view>
<view class="value-font" style="color: #FF6000;">-￥{{order.addVipReductionMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">
￥<text>{{order.addProjectBenefits}}</text></view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">预计收益</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">提成比例</span>
<span class="value-font" style="font-weight: bold;">{{order.artificerRate*100}}%</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目收益</span>
<span class="value-font" style="font-weight: bold;"
v-if="order.isSupplement">￥{{order.oldProjectBenefits}}</span>
<span class="value-font" style="font-weight: bold;" v-else>￥{{order.projectBenefits}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">车费收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">加钟收益</span>
<span class="value-font"
style="font-weight: bold;">￥{{order.addProjectBenefits!=null?order.addProjectBenefits:'-'}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">门店分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.shopMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">经纪人分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.jjrArtificerDeductMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">分销员分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.fxyArtificerDeductMoneyTotal}}</span>
</view>
</view>
<view class="yiji">
<view class="yuji-title">技师收益</view>
<view class="yingde-money">
<span class="fuhao-heis">￥</span>
<span class="num-heis">
{{order.artificerMoneyTotal}}
</span>
</view>
</view>
<view class="mian-view"
v-if="order.status=='3'||order.status=='5'||order.status=='6'||order.status=='8'">
<view v-if="order.startRemark&&order.status!='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" :disabled="true"
placeholder="请输入备注信息" name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view v-if="order.status=='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" placeholder="请输入备注信息"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status!='8'&&order.startImg">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap justify-between">
<view class="flex margin-bottom-sm"
style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in order.startImg" :key="index"
@click="saveImg( order.startImg,index)">
<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;"
mode="aspectFill">
</image>
</view>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status==8 && startImgSel != '否'">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap">
<view v-if="startImgs.length">
<view class="flex margin-right-sm flex-wrap">
<view class="flex"
style="width: 200rpx;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in startImgs" :key="index">
<image :src="pictureEcho[0]" style="width: 100%;height: 100%;"></image>
<view style="z-index: 0;position: absolute;top: -15rpx;right: -15rpx;"
@click="removeImg(index,1)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
</view>
</view>
</view>
<view class="flex align-center justify-center padding-tb "
style="background: #f5f5f5;width: 200rpx;height: 200rpx;">
<view class="text-center" @click="addImage(1)">
<image src="../static/photo.png" style="width:60upx;height: 50upx;"></image>
<view class="text-sm">上传照片</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 普通订单 没有加钟 没有升级 -->
<view v-if="order.isSupplement!='2'&&order.addNum==null">
<view class="mian-top">
<view class="countDown" style="text-align: center;" v-if="order.status == 6">
<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
font-size="74" separator-size="74" @change="onCountdownChange"></u-count-down>
</view>
<view class="mian-top-head">
<image v-if="order && order.ordersMassageList"
:src="(order.ordersMassageList[0].massageType || {}).massageImg"
class="mian-top-head-img"></image>
<view class="mian-top-head-right">
<view class="mian-title" v-if="order && order.ordersMassageList">
<view class="mian-title-view">{{order.entryName}}</view>
<!-- <view class="nav-btn" v-if="order.status ==1">待支付</view> -->
<view class="nav-btn" v-if="order.status ==2">待服务</view>
<view class="nav-btn" v-if="order.status ==3">待评价</view>
<!-- <view class="nav-btn" v-if="order.status ==4">已取消</view> -->
<view class="nav-btn" v-if="order.status ==5">已完成</view>
<view class="nav-btn" v-if="order.status ==6">服务中</view>
<view class="nav-btn" v-if="order.status ==7">技师出发</view>
<view class="nav-btn" v-if="order.status ==8">技师到达</view>
<view class="nav-btn" v-if="order.status ==9">确认接单</view>
</view>
<view class="mian-time" v-if="order && order.ordersMassageList">
<text class="title-font">服务时长：</text><text
class="value-font">{{order.duration}}分钟</text>
</view>
<view class="mian-money" style="justify-content: space-between;">
<view class="flex" style="flex-direction: row;align-items: center;">
<view class="title-font">项目价格：</view>
<view class="value-font">
<span class="fuhao">￥</span>
<span class="number">
{{order.priceMarkup}}
</span>
</view>
</view>
<view class="jiajian">
<view class="jian">-</view>
<view class="view-num">{{order.massageNum}}</view>
<view class="jia">+</view>
</view>
</view>
</view>
</view>
<view class="mian-top-foot" @tap="bindGps(order.latitude,order.longitude,order.address)">
<view class="mian-top-foot-view">
<view class="title-font">客户信息：</view>
<view class="value-font">
<span @tap.stop="copyAddress()"
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4">
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
<u-icon name="file-text"></u-icon>
</span>
<span v-else>
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</span>
<!-- <image src="../../static/index/dianhua.png" mode=""></image> -->
</view>
</view>
<view class="mian-top-foot-view" style="margin-top: 5px;">
<view class="title-font">服务地址：</view>
<view class="value-font" style="width: 75%;text-align: right;">
{{order.address}}
</view>
</view>
</view>
</view>
<view class="mian-view">
<view class="mina-title">
<span class="mina-title-text">订单信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" @tap="copy(order.ordersNo)">
<span class="title-font">订单编号</span>
<span class="value-font">
{{order.ordersNo}}
<u-icon name="file-text" />
</span>
</view>
<view class="mian-view-list">
<span class="title-font">预约时间</span>
<span class="value-font">{{order.serveTime}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">下单时间</span>
<span class="value-font">{{order.createTime}}</span>
</view>
<view class="mian-content-textarea" v-if="order.remark!=null&&order.remark!=''">
<span class="title-font">服务备注</span>
<textarea class="textarea-mian" :disabled="true" v-model="order.remark"></textarea>
</view>
<view class="mian-content-textarea" v-if="order.earlyFinishReason!=null&&order.remark!=''">
<span class="title-font">提前结束原因</span>
<textarea class="textarea-mian" :disabled="true"
v-model="order.earlyFinishReason"></textarea>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">订单费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">
{{order.entryName}}
</span>
</view>
<view class="mian-view-list">
<view class="title-font">服务时长</view>
<view class="value-font">{{order.duration}}分钟</view>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font">￥{{order.priceMarkup}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">会员减免</span>
<span class="value-font" style="color: #FF6000;">-￥{{order.vipReductionMoney}}</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">项目小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.massageMoney}}</text>
</view>
</view>
<view class="mian-view-list">
<span class="title-font">优惠券</span>
<span class="value-font" style="color: #FF6000;"
v-if="order.couponMoney">-￥{{order.couponMoney}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;" v-if="order.isSupplement">
￥<text>{{order.oldProjectBenefits}}</text></view>
<view class="value-font" style="font-weight: bold;" v-else>
￥<text>{{order.projectBenefits}}</text></view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">出行费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" v-if="order.tripWay">
<view class="title-font">出行方式</view>
<view v-if="order.tripWay == 1" class="value-font">公交</view>
<view v-if="order.tripWay == 2" class="value-font">出租</view>
<view v-if="order.tripWay == 3" class="value-font">免费</view>
</view>
<view class="mian-view-list">
<span class="title-font">全程距离</span>
<span class="value-font">{{order.km}}km</span>
</view>
<view class="mian-view-list">
<view class="title-font">出行费用</view>
<view class="value-font">￥{{order.usualTravelMoney}}</view>
</view>
<view class="mian-view-list" v-if="order.nightTravelMoney">
<view class="title-font">夜间出行</view>
<view class="value-font">￥{{order.nightTravelMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<span class="title-font">收益小计：</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">预计收益</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">提成比例</span>
<span class="value-font" style="font-weight: bold;">{{order.artificerRate*100}}%</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目收益</span>
<span class="value-font" style="font-weight: bold;"
v-if="order.isSupplement">￥{{order.oldProjectBenefits}}</span>
<span class="value-font" style="font-weight: bold;" v-else>￥{{order.projectBenefits}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">车费收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">门店分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.shopMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">经纪人分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.jjrArtificerDeductMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">分销员分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.fxyArtificerDeductMoneyTotal}}</span>
</view>
</view>
<view class="yiji">
<view class="yuji-title">技师收益</view>
<view class="yingde-money">
<span class="fuhao-heis">￥</span>
<span class="num-heis">
{{order.artificerMoneyTotal}}
</span>
</view>
</view>
<view class="mian-view"
v-if="order.status=='3'||order.status=='5'||order.status=='6'||order.status=='8'">
<view v-if="order.startRemark&&order.status!='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" :disabled="true"
placeholder="请输入备注信息" name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view v-if="order.status=='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" placeholder="请输入备注信息"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status!='8'&&order.startImg">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap justify-between">
<view class="flex margin-bottom-sm"
style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in order.startImg" :key="index"
@click="saveImg( order.startImg,index)">
<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;"
mode="aspectFill">
</image>
</view>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status==8 && startImgSel != '否'">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap">
<view v-if="startImgs.length">
<view class="flex margin-right-sm flex-wrap">
<view class="flex"
style="width: 200rpx;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in startImgs" :key="index">
<image :src="pictureEcho[0]" style="width: 100%;height: 100%;"></image>
<view style="z-index: 0;position: absolute;top: -15rpx;right: -15rpx;"
@click="removeImg(index,1)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
</view>
</view>
</view>
<view class="flex align-center justify-center padding-tb "
style="background: #f5f5f5;width: 200rpx;height: 200rpx;">
<view class="text-center" @click="addImage(1)">
<image src="../static/photo.png" style="width:60upx;height: 50upx;"></image>
<view class="text-sm">上传照片</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 套餐疗程次卡订单 -->
<view v-else>
<!-- 套餐疗程次卡 没有加钟 没有升级 -->
<view v-if="order.isSupplement!='2'&&order.addNum==null">
<view class="mian-top">
<view class="countDown" style="text-align: center;" v-if="order.status == 6">
<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
font-size="74" separator-size="74" @change="onCountdownChange"></u-count-down>
</view>
<view class="mian-top-head">
<image v-if="order && order.ordersMassageList"
:src="(order.ordersMassageList[0].userPackageDetail || {}).massageImg"
class="mian-top-head-img"></image>
<view class="mian-top-head-right">
<view class="mian-title" v-if="order && order.ordersMassageList">
<view class="mian-title-view">{{order.entryName}}</view>
<!-- <view class="nav-btn" v-if="order.status ==1">待支付</view> -->
<view class="nav-btn" v-if="order.status ==2">待服务</view>
<view class="nav-btn" v-if="order.status ==3">待评价</view>
<!-- <view class="nav-btn" v-if="order.status ==4">已取消</view> -->
<view class="nav-btn" v-if="order.status ==5">已完成</view>
<view class="nav-btn" v-if="order.status ==6">服务中</view>
<view class="nav-btn" v-if="order.status ==7">技师出发</view>
<view class="nav-btn" v-if="order.status ==8">技师到达</view>
<view class="nav-btn" v-if="order.status ==9">确认接单</view>
</view>
<view class="mian-time" v-if="order && order.ordersMassageList">
<text class="title-font">服务时长：</text><text
class="value-font">{{order.duration}}分钟</text>
</view>
<view class="mian-money" style="justify-content: space-between;">
<view class="flex" style="flex-direction: row;align-items: center;">
<view class="title-font">项目价格：</view>
<view class="value-font">
<span class="fuhao">￥</span>
<span class="number">
{{order.massagePrice}}
</span>
</view>
</view>
<view class="jiajian">
<view class="jian">-</view>
<view class="view-num">{{order.massageNum}}</view>
<view class="jia">+</view>
<!-- <uni-number-box :disabled="true" :value="order.ordersMassageList[0].num" :width='27' :min="1" @change="changeValue" /> -->
</view>
</view>
</view>
</view>
<view class="mian-top-foot" @tap="bindGps(order.latitude,order.longitude,order.address)">
<view class="mian-top-foot-view">
<view class="title-font">客户信息：</view>
<view class="value-font">
<span @tap.stop="copyAddress()"
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4">
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
<u-icon name="file-text"></u-icon>
</span>
<span v-else>
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</span>
<!-- <image src="../../static/index/dianhua.png" mode=""></image> -->
</view>
</view>
<view class="mian-top-foot-view" style="margin-top: 5px;">
<view class="title-font">服务地址：</view>
<view class="value-font" style="width: 75%;text-align: right;">
{{order.address}}
</view>
</view>
</view>
</view>
<view class="mian-view">
<view class="mina-title">
<span class="mina-title-text">订单信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" @tap="copy(order.ordersNo)">
<span class="title-font">订单编号</span>
<span class="value-font">
{{order.ordersNo}}
<u-icon name="file-text" />
</span>
</view>
<view class="mian-view-list">
<span class="title-font">预约时间</span>
<span class="value-font">{{order.serveTime}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">下单时间</span>
<span class="value-font">{{order.createTime}}</span>
</view>
<view class="mian-content-textarea" v-if="order.remark!=null&&order.remark!=''">
<span class="title-font">服务备注</span>
<textarea class="textarea-mian" :disabled="true" v-model="order.remark"></textarea>
</view>
<view class="mian-content-textarea" v-if="order.earlyFinishReason!=null&&order.remark!=''">
<span class="title-font">提前结束原因</span>
<textarea class="textarea-mian" :disabled="true"
v-model="order.earlyFinishReason"></textarea>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">订单费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<view class="title-font">
{{order.packageType=='104'?'套餐':order.packageType=='105'?'次卡':order.packageType=='106'?'疗程':order.packageType=='111'?'团购':order.packageType=='112'?'秒杀':'其他'}}名称
</view>
<span class="value-font">
{{order.ordersMassageList[0].userPackageDetail.mainTitle}}
</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">
{{order.entryName}}
</span>
</view>
<view class="mian-view-list">
<view class="title-font">服务时长</view>
<view class="value-font">{{order.duration}}分钟</view>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font">￥{{order.priceMarkup}}</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.projectBenefits}}</text>
</view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">出行费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" v-if="order.tripWay">
<view class="title-font">出行方式</view>
<view v-if="order.tripWay == 1" class="value-font">公交</view>
<view v-if="order.tripWay == 2" class="value-font">出租</view>
<view v-if="order.tripWay == 3" class="value-font">免费</view>
</view>
<view class="mian-view-list">
<span class="title-font">全程距离</span>
<span class="value-font">{{order.km}}km</span>
</view>
<view class="mian-view-list">
<view class="title-font">出行费用</view>
<view class="value-font">￥{{order.usualTravelMoney}}</view>
</view>
<view class="mian-view-list" v-if="order.nightTravelMoney">
<view class="title-font">夜间出行</view>
<view class="value-font">￥{{order.nightTravelMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<span class="title-font">收益小计：</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">预计收益</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">提成比例</span>
<span class="value-font" style="font-weight: bold;">{{order.artificerRate*100}}%</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.projectBenefits}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">车费收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">门店分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.shopMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">经纪人分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.jjrArtificerDeductMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">分销员分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.fxyArtificerDeductMoneyTotal}}</span>
</view>
</view>
<view class="yiji">
<view class="yuji-title">技师收益</view>
<view class="yingde-money">
<span class="fuhao-heis">￥</span>
<span class="num-heis">
{{order.artificerMoneyTotal}}
</span>
</view>
</view>
<view class="mian-view"
v-if="order.status=='3'||order.status=='5'||order.status=='6'||order.status=='8'">
<view v-if="order.startRemark&&order.status!='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" :disabled="true"
placeholder="请输入备注信息" name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view v-if="order.status=='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" placeholder="请输入备注信息"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status!='8'&&order.startImg">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap justify-between">
<view class="flex margin-bottom-sm"
style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in order.startImg" :key="index"
@click="saveImg( order.startImg,index)">
<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;"
mode="aspectFill">
</image>
</view>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status==8 && startImgSel != '否'">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap">
<view v-if="startImgs.length">
<view class="flex margin-right-sm flex-wrap">
<view class="flex"
style="width: 200rpx;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in startImgs" :key="index">
<image :src="pictureEcho[0]" style="width: 100%;height: 100%;"></image>
<view style="z-index: 0;position: absolute;top: -15rpx;right: -15rpx;"
@click="removeImg(index,1)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
</view>
</view>
</view>
<view class="flex align-center justify-center padding-tb "
style="background: #f5f5f5;width: 200rpx;height: 200rpx;">
<view class="text-center" @click="addImage(1)">
<image src="../static/photo.png" style="width:60upx;height: 50upx;"></image>
<view class="text-sm">上传照片</view>
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 套餐疗程次卡 加钟 没有升级 -->
<view v-if="order.isSupplement!='2'&&order.addNum!=null">
<view class="mian-top">
<view class="countDown" style="text-align: center;" v-if="order.status == 6">
<u-count-down :timestamp="endOfServiceTimer" separator-color="#20C675" color="#20C675"
font-size="74" separator-size="74" @change="onCountdownChange"></u-count-down>
</view>
<view class="mian-top-head">
<image v-if="order && order.ordersMassageList"
:src="(order.ordersMassageList[0].userPackageDetail || {}).massageImg"
class="mian-top-head-img"></image>
<view class="mian-top-head-right">
<view class="mian-title" v-if="order && order.ordersMassageList">
<view class="mian-title-view">{{order.entryName}}</view>
<!-- <view class="nav-btn" v-if="order.status ==1">待支付</view> -->
<view class="nav-btn" v-if="order.status ==2">待服务</view>
<view class="nav-btn" v-if="order.status ==3">待评价</view>
<!-- <view class="nav-btn" v-if="order.status ==4">已取消</view> -->
<view class="nav-btn" v-if="order.status ==5">已完成</view>
<view class="nav-btn" v-if="order.status ==6">服务中</view>
<view class="nav-btn" v-if="order.status ==7">技师出发</view>
<view class="nav-btn" v-if="order.status ==8">技师到达</view>
<view class="nav-btn" v-if="order.status ==9">确认接单</view>
</view>
<view class="mian-time" v-if="order && order.ordersMassageList">
<text class="title-font">服务时长：</text><text
class="value-font">{{order.duration}}分钟</text>
</view>
<view class="mian-money" style="justify-content: space-between;">
<view class="flex" style="flex-direction: row;align-items: center;">
<view class="title-font">项目价格：</view>
<view class="value-font">
<span class="fuhao">￥</span>
<span class="number">
{{order.massagePrice}}
</span>
</view>
</view>
<view class="jiajian">
<view class="jian">-</view>
<view class="view-num">{{order.massageNum}}</view>
<view class="jia">+</view>
<!-- <uni-number-box :disabled="true" :value="order.ordersMassageList[0].num" :width='27' :min="1" @change="changeValue" /> -->
</view>
</view>
</view>
</view>
<view class="mian-top-foot" @tap="bindGps(order.latitude,order.longitude,order.address)">
<view class="mian-top-foot-view">
<view class="title-font">客户信息：</view>
<view class="value-font">
<span @tap.stop="copyAddress()"
v-if="order.status !=1 && order.status !=5 && order.status !=3 && order.status !=4">
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
<u-icon name="file-text"></u-icon>
</span>
<span v-else>
{{order.userName}}
{{order.phone ? order.phone.substring(0,3) + '****' + order.phone.substring(7,11) : ''}}
</span>
<!-- <image src="../../static/index/dianhua.png" mode=""></image> -->
</view>
</view>
<view class="mian-top-foot-view" style="margin-top: 5px;">
<view class="title-font">服务地址：</view>
<view class="value-font" style="width: 75%;text-align: right;">
{{order.address}}
</view>
</view>
</view>
</view>
<view class="mian-view">
<view class="mina-title">
<span class="mina-title-text">订单信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" @tap="copy(order.ordersNo)">
<span class="title-font">订单编号</span>
<span class="value-font">
{{order.ordersNo}}
<u-icon name="file-text" />
</span>
</view>
<view class="mian-view-list">
<span class="title-font">预约时间</span>
<span class="value-font">{{order.serveTime}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">下单时间</span>
<span class="value-font">{{order.createTime}}</span>
</view>
<view class="mian-content-textarea" v-if="order.remark!=null&&order.remark!=''">
<span class="title-font">服务备注</span>
<textarea class="textarea-mian" :disabled="true" v-model="order.remark"></textarea>
</view>
<view class="mian-content-textarea" v-if="order.earlyFinishReason!=null&&order.remark!=''">
<span class="title-font">提前结束原因</span>
<textarea class="textarea-mian" :disabled="true"
v-model="order.earlyFinishReason"></textarea>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">订单费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<view class="title-font">
{{order.packageType=='104'?'套餐':order.packageType=='105'?'次卡':order.packageType=='106'?'疗程':order.packageType=='111'?'团购':order.packageType=='112'?'秒杀':'其他'}}名称
</view>
<span class="value-font">
{{order.ordersMassageList[0].userPackageDetail.mainTitle}}
</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">
{{order.entryName}}
</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务时长</span>
<span class="value-font">{{order.duration}}分钟</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font">￥{{order.priceMarkup}}</span>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">￥<text>{{order.projectBenefits}}</text>
</view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">出行费用</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list" v-if="order.tripWay">
<view class="title-font">出行方式</view>
<view v-if="order.tripWay == 1" class="value-font">公交</view>
<view v-if="order.tripWay == 2" class="value-font">出租</view>
<view v-if="order.tripWay == 3" class="value-font">免费</view>
</view>
<view class="mian-view-list">
<span class="title-font">全程距离</span>
<span class="value-font">{{order.km}}km</span>
</view>
<view class="mian-view-list">
<view class="title-font">出行费用</view>
<view class="value-font">￥{{order.usualTravelMoney}}</view>
</view>
<view class="mian-view-list" v-if="order.nightTravelMoney">
<view class="title-font">夜间出行</view>
<view class="value-font">￥{{order.nightTravelMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<span class="title-font">收益小计：</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">加钟信息</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">服务项目</span>
<span class="value-font">{{order.addEntryName!=null?order.addEntryName:'-'}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">服务时长</span>
<span class="value-font">{{order.addTime}}分钟</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目金额</span>
<span class="value-font" v-if="order.addPriceMarkup!=null">￥{{order.addPriceMarkup}}</span>
<span class="value-font" v-else>-</span>
</view>
<view class="mian-view-list">
<view class="title-font">会员减免</view>
<view class="value-font" style="color: #FF6000;">-￥{{order.addVipReductionMoney}}</view>
</view>
<view class="mian-view-list" style="justify-content: flex-end;">
<view class="title-font">收益小计：</view>
<view class="value-font" style="font-weight: bold;">
￥<text>{{order.addProjectBenefits}}</text></view>
</view>
<view class="jusitify-line-end"></view>
<view class="mina-title">
<span class="mina-title-text">预计收益</span>
<span class="mina-title-bor"></span>
</view>
<view class="mian-view-list">
<span class="title-font">提成比例</span>
<span class="value-font" style="font-weight: bold;">{{order.artificerRate*100}}%</span>
</view>
<view class="mian-view-list">
<span class="title-font">项目收益</span>
<span class="value-font" style="font-weight: bold;"
v-if="order.isSupplement">￥{{order.oldProjectBenefits}}</span>
<span class="value-font" style="font-weight: bold;" v-else>￥{{order.projectBenefits}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">车费收益</span>
<span class="value-font" style="font-weight: bold;">￥{{order.artificerTaxiMoney}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">加钟收益</span>
<span class="value-font"
style="font-weight: bold;">￥{{order.addArtificerMoney!=null?order.addArtificerMoney:0}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">门店分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.shopMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">经纪人分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.jjrArtificerDeductMoneyTotal}}</span>
</view>
<view class="mian-view-list">
<span class="title-font">分销员分佣</span>
<span class="value-font"
style="font-weight: bold;color: #FF6000;">-￥{{order.fxyArtificerDeductMoneyTotal}}</span>
</view>
</view>
<view class="yiji">
<view class="yuji-title">技师收益</view>
<view class="yingde-money">
<span class="fuhao-heis">￥</span>
<span class="num-heis">
{{order.artificerMoneyTotal}}
</span>
</view>
</view>
<view class="mian-view"
v-if="order.status=='3'||order.status=='5'||order.status=='6'||order.status=='8'">
<view v-if="order.startRemark&&order.status!='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" :disabled="true"
placeholder="请输入备注信息" name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view v-if="order.status=='8'">
<view class="mina-title">
<span class="mina-title-text">开始备注</span>
<span class="mina-title-bor"></span>
</view>
<view class="textarea-mian" style="height: 110px;">
<textarea @input="textareaData" v-model="order.startRemark" placeholder="请输入备注信息"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status!='8'&&order.startImg">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap justify-between">
<view class="flex margin-bottom-sm"
style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in order.startImg" :key="index"
@click="saveImg( order.startImg,index)">
<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;"
mode="aspectFill">
</image>
</view>
</view>
</view>
<view class="bg padding radius margin-top" v-if="order.status==8 && startImgSel != '否'">
<view class=""
style="font-size: 30rpx;color: #000000;font-weight: bold;margin-bottom: 20rpx;">服务前照片
</view>
<view class="flex flex-wrap">
<view v-if="startImgs.length">
<view class="flex margin-right-sm flex-wrap">
<view class="flex"
style="width: 200rpx;height: 200rpx;margin-right: 5rpx;position: relative;"
v-for="(image,index) in startImgs" :key="index">
<image :src="pictureEcho[0]" style="width: 100%;height: 100%;"></image>
<view style="z-index: 0;position: absolute;top: -15rpx;right: -15rpx;"
@click="removeImg(index,1)">
<u-icon name="close-circle-fill" color="#2979ff" size="50rpx"></u-icon>
</view>
</view>
</view>
</view>
<view class="flex align-center justify-center padding-tb "
style="background: #f5f5f5;width: 200rpx;height: 200rpx;">
<view class="text-center" @click="addImage(1)">
<image src="../static/photo.png" style="width:60upx;height: 50upx;"></image>
<view class="text-sm">上传照片</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<view class="footers" v-if="order.refusalContent==null">
<view @click="cxOrder(order)" class="footers-btn footers-true" v-if="order.status == 2">
现在出发
</view>
<view @click="cxOrder(order)" class="footers-btn footers-bor" v-if="order.status == 7">
我已到达
</view>
<view @click="fuwuOrder(order)" class="footers-btn footers-true" v-if="order.status == 8">
开始服务
</view>
<view @click="toggle('bottom',order)" class="footers-btn footers-bor"
v-if="order.status == 6&&(order.earlyFinishReason!=null||endOfServiceTimer<0)">
服务完成
</view>
<view class="footers-btn footers-true" @click="nineState(order.ordersId)"
v-if="order.status == 9&&!order.refusalContentl">
确认接单
</view>
<view class="footers-btn footers-bor" v-if="order.status == 9&&!order.refusalContentl"
@click="toggleJ('bottom',order.ordersId)">
拒单申请
</view>
<!-- <view class="footers-btn footers-bor" @click="goMsg">联系客服11</view> -->
<view class="footers-btn footers-bor" @click="goChat">联系客服</view>
<!-- <u-button :custom-style="customStyle" shape="circle" :plain="true"
@click="bindphone(order.phone)">联系客户</u-button> -->
<!-- <view class="dian" @click="toggle('bottom',order)" v-if="order.status == 6">...</view> -->
</view>
<view class="footers" v-if="order.refusalContent!=null&&order.status=='9'">
<view class="footers-btn footers-bor" @click="goChat">联系客服</view>
</view>
</view>
<!-- <u-skeleton :loading="loading" :animation="true" bgColor="#FFF"></u-skeleton> -->
<!-- #ifndef H5 -->
<image v-if="order.status == 6" src="../../static/images/index/jinji.png" class="bj_view" @tap="goBaoJing">
</image>
<!-- #endif -->
<!-- 支付方式 -->
<u-popup v-model="showpay" mode="bottom" :closeable="closeable">
<view class="popup_pay">
<view style="background-color: #fff;">
<view style="padding: 0 20upx;margin-top: 60rpx;margin-bottom: 20rpx;">
<view
style="display: flex;height: 100upx;align-items: center;padding: 20upx 0;justify-content: center;"
v-for="(item,index) in openLists" :key='index'>
<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;">
</image>
<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">
{{item.text}}
</view>
<radio-group name="openWay" style="margin-left: 45upx;" @tap='selectWay(item)'>
<label class="tui-radio">
<radio color="#1777FF" :checked="openWay === item.id ? true : false" />
</label>
</radio-group>
</view>
</view>
</view>
<view class="pay_btn" @click="pay()">确认支付</view>
</view>
</u-popup>
<view>
<!-- 普通弹窗 -->
<uni-popup ref="popupW" type="bottom" background-color="#fff">
<view class="popup-content">
<!--<view class="popup-head">
<span></span>
<span @click="closePopup(type)">x</span>
</view>-->
<view class="popup-head">
<image src="../../static/closeimg.png" class="popup-img" @click="closePopup(type)"></image>
</view>
<view class="popup-mian">
<view class="popup-view">
<view class="fuwu">
<view class="popup-title">服务承诺</view>
<view class="fuwu-check">
<uni-data-checkbox @change="change" selectedColor="#049F89" class="fuwu-checkbox"
multiple v-model="checkbox1" :localdata="hobby"></uni-data-checkbox>
</view>
</view>
<view class="guke">
<view class="popup-title">顾客评价</view>
<view class="guke-list">
<view class="guke-btn huiBtn" :class="{ lanBtn: selected.includes(item) }"
@click="gukeBtn(item)" v-for="(item,index) in fuwuBtn" :key="index">
{{item.title}}
</view>
</view>
</view>
<view class="beizhu">
<view class="popup-title">特殊情况备注</view>
<textarea @input="textareaData" class="beizhu-textarea" placeholder="本次服务中出现的特殊情况，请在此输入"
name="" id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="popup-mian-btn">
<span @click="closePopup(type)">
取消
</span>
<span @click="cancel(order)">
确定
</span>
</view>
</view>
</view>
</uni-popup>
</view>
<view>
<!-- 普通弹窗 -->
<uni-popup ref="popup" type="bottom" background-color="#fff">
<view class="popup-content" style="height: 255px;">
<!--<view class="popup-head">
<span></span>
<span @click="closePopupJ(type)">x</span>
</view>-->
<view class="popup-head">
<view class="popup-title">拒单申请原因</view>
<image src="../../static/closeimg.png" class="popup-img" @click="closePopupJ(type)"></image>
</view>
<view class="popup-mian">
<view class="popup-view">
<view class="beizhu">
<textarea class="beizhu-textarea" @input="refusa" placeholder="拒绝申请原因，请在此输入" name=""
id="" cols="30" rows="10"></textarea>
</view>
</view>
<view class="popup-mian-btn">
<span @click="closePopupJ(type)">
取消
</span>
<span @click="juJueState()">
确定
</span>
</view>
</view>
</view>
</uni-popup>
</view>
</view>
</template>
<script>
import * as websocketUtils from 'utils/websocketUtils.js';
import {
getXZX,
post,
} from "@/common/httpRequest.js";
export default {
// components: {
// CountDown,
// },
data() {
return {
//老 订单详情
jordersId: '',
goods: {},
startImgs: [],
startImg: '',
endImgs: [],
endImg: '',
latitude: '',
longitude: '',
loading: true,
customStyle: {
// backgroundColor: '#e5e5e5',
// color: '#FFFFFF',
// #ifdef MP-WEIXIN
width: "330upx",
// #endif
// #ifndef MP-WEIXIN
width: '111px',
// #endif
margin: '0 20upx',
},
customStyle2: {
backgroundColor: '#096f4b',
color: '#FFFFFF',
// #ifdef MP-WEIXIN
width: "330upx",
// #endif
// #ifndef MP-WEIXIN
width: '111px',
// #endif
margin: '0 20upx',
},
id: '',
order: {
user: {},
game: {}
},
isTrue: 0,
sumMoney: 0,
phone: '',
isVip: false,
birthDate: '',
age: '',
showpay: false,
openLists: [],
openWay: 1,
closeable: true,
startImgSel: '否',
pictureEcho: [],
formatEndTime: "",
endOfServiceTimer: null,
formatTimeStamp: null,
innerAudioContext: null,
orderIdSend: null,
homeMaterialPackageList: [],
currentPage: null,
pageSize: null,
//新订单详情
selected: [],
selectedString: '',
headImg: [],
type: 'bottom',
checkbox1: [0],
hobby: [{
text: '价格透明',
value: '0'
}, {
text: '未服务全额退',
value: '1'
}, {
text: '最快不满意重做分钟上门',
value: '2'
}, {
text: '7*24 小时客服',
value: '3'
}, {
text: '最快 30 分钟上门',
value: '4'
}],
fuwuBtn: [],
textareaTxt: '',
checkbox2: [],
refusalContent: '',
imgList: [],
koufeiMoney: '',
xiangmuMoney: '',
jishishouyi: ''
}
},
watch: {
formatTimeStamp(newValue, oldValue) {
console.log(newValue);
},
},
onLoad(e) {
setInterval(() => {
this.getOrder();
}, 120000)
this.startImgSel = this.$queue.getData('startImgSel');
uni.showLoading({
title: '加载中......'
})
let that = this;
uni.getLocation({
type: 'wgs84',
success: function(res) {
console.log('当前位置的经度：' + res.longitude);
console.log('当前位置的纬度：' + res.latitude);
that.$queue.setData('longitude', res.longitude);
that.$queue.setData('latitude', res.latitude);
that.latitude = res.latitude
that.longitude = res.longitude
}
});
// setTimeout(() => {
// // this.loading = false;
// }, 2000)
this.isTrue = e.isTrue
// if (this.isTrue) {
// uni.setNavigationBarTitle({
// title: '订单详情'
// })
// }
this.ordersId = e.ordersId
this.orderIdSend = e.ordersId;
// this.getOrder()
},
onShow() {
let that = this;
this.getOrder()
this.token = uni.getStorageSync('token')
if (uni.getStorageSync('token')) {
this.getIsVip()
}
// #ifdef APP
this.openLists = [{
image: '../../static/images/icon_weixin.png',
text: '微信',
id: 2
}, {
image: '../../static/images/lingqian.png',
text: '零钱支付',
id: 1
}, {
image: '../../static/images/zhifubao.png',
text: '支付宝支付',
id: 3
}],
this.openWay = 1;
// #endif
// #ifdef MP-WEIXIN
this.openLists = [{
image: '../../static/images/icon_weixin.png',
text: '微信',
id: 2
}, {
image: '../../static/images/lingqian.png',
text: '零钱支付',
id: 1
}],
this.openWay = 1;
// #endif
// #ifdef H5
this.openLists = [{
image: '../../static/images/lingqian.png',
text: '零钱支付',
id: 1
}, {
image: '../../static/images/zhifubao.png',
text: '支付宝支付',
id: 3
}],
this.openWay = 1;
// #endif
},
onPullDownRefresh() {
this.getOrder();
},
destroyed() {
if (this.innerAudioContext) {
try {
this.innerAudioContext.pause();
this.innerAudioContext.destroy();
this.innerAudioContext = null;
} catch (e) {
}
}
},
methods: {
getOrder() {
let data = {
ordersId: this.ordersId
}
this.$Request.get('/app/artificer/selectOrdersDetails', data).then(res => {
if (res.code == 0) {
this.goods = [];
this.loading = false
uni.hideLoading()
this.order = res.data;
//扣费明细 小计
// this.koufeiMoney = this.order.channelDeduction + this.order.valueStorageDeduction + this
// .order.pingMoney
//预计收益下面 实际金额
// this.xiangmuMoney = this.order.massagePrice * this.order.ordersMassageList[0].num * (this
// .order.vipRate / 100) * (1 + this.order.technicianRate / 100)
//技师的总共收益
//技师收益（升级）=（升级后项目价格（488）*会议折扣（0.9）-优惠卷（14））* 分成比例（0.65）* 用户余额比例（0.9) + 车费（14）
// this.jishishouyi=((this.xiangmuMoney-this.order.couponMoney)*this.order.artificerRate*(this.order.walletRate/100)+this.order.taxiMoney+order.addMoney).toFixed(2)
// this.jishishouyi = (((this.xiangmuMoney + this.order.addMoney + this.order.taxiMoney - this
// .order.couponMoney) - this.order.couponMoney) * this.order.artificerRate * (
// this.order.walletRate / 100) + this.order.taxiMoney).toFixed(2)
this.formatEndTime = res.data.endTime;
if (this.order.artificerTaxiMoney && this.order.sumArtificerMoney) {
this.sumMoney = parseFloat(parseFloat(this.order.sumArtificerMoney) - parseFloat(this
.order.artificerTaxiMoney)).toFixed(2);
} else {
this.sumMoney = this.order.sumArtificerMoney;
}
if (this.order.startImg) {
this.order.startImg = this.order.startImg.split(',')
}
if (this.order.endServiceImg) {
this.order.endServiceImg = this.order.endServiceImg.split(',')
}
let aliphone = this.$queue.getData('aliphone');
if (aliphone === '是' && this.order.artificer) {
this.ysPhone(this.order.phone, this.order.artificer.phone);
}
if (res.data.status == 6 && res.data.endTime) {
let afterTimeStamp = new Date(res.data.endTime).getTime() / 1000;
let currentTimeStamp = new Date().getTime() / 1000;
let formatTimeStamp = Math.floor(afterTimeStamp - currentTimeStamp);
this.endOfServiceTimer = formatTimeStamp;
console.log("eeee", this.endOfServiceTimer);
}
this.goods = res.data;
// if (this.$refs.countDownEl) this.$refs.countDownEl.update();
uni.stopPullDownRefresh();
}
})
},
goBack() { //返回上一页
console.log("asdsad")
uni.switchTab({
url: '/pages/order/index'
})
},
refusa(e) { //拒绝接单 原因
this.refusalContent = e.detail.value
},
closePopupJ(type) { // 关闭弹出框
this.type = type
this.$refs.popup.close(type);
},
toggleJ(type, ordersId) { // 弹出框
this.jordersId = ordersId;
this.type = type;
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
this.$refs.popup.open(type)
},
juJueState() {
var that = this
if (that.refusalContent) {
that.$Request.getT("/app/artificer/jishiJdsq", {
ordersId: that.jordersId,
refusalContent: that.refusalContent
}).then(res => {
if (res.code == 0) {
that.$queue.showToast(res.msg);
this.$refs.popup.close(this.type);
uni.switchTab({
url: '/pages/order/index'
})
} else {
that.$queue.showToast(res.msg);
}
});
} else {
uni.showToast({
icon: "error",
title: '请填写拒单原因'
})
}
},
nineState(ordersId) { //确认接单
var that = this;
this.$Request.getT("/app/artificer/jishiQueren", {
ordersId: ordersId
}).then(res => {
if (res.code == 200) {
that.getOrder()
that.$queue.showToast(res.msg);
} else {
that.$queue.showToast(res.msg);
}
});
},
gukeBtn(item) {
var index = this.selected.indexOf(item);
if (index === -1) {
this.selected.push(item);
} else {
this.selected.splice(index, 1);
}
var data = [];
for (var i = 0; i < this.selected.length; i++) {
data.push(this.selected[i].title)
}
this.selectedString = data.join(",")
},
textareaData(e) {
this.textareaTxt = e.detail.value
},
change(e) { //选服务承诺
var data = e.detail.data;
var chec = [];
for (var i = 0; i < data.length; i++) {
chec[i] = data[i].text
}
this.checkbox2 = chec.join(',');
},
toggle(type, order) { // 弹出框
this.type = type
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
this.$refs.popupW.open(type);
this.$Request.getT('/app/artificer/getPingjiaTagList').then(res => {
if (res.code == 0) {
this.fuwuBtn = res.data;
} else {
this.$queue.showToast(res.msg);
}
});
},
fuwuOrder(e) { //开始服务
let startImg = '';
if (this.startImgSel === '是') {
if (this.startImgs.length == 0) {
this.$queue.showToast('请上传开始服务图片!');
return;
} else {
startImg = this.startImgs.toString();
}
}
let that = this
uni.showModal({
title: '提示',
content: '确认开始服务吗？',
success: function(res) {
if (res.confirm) {
let data = {
ordersId: e.ordersId,
startLongitude: that.longitude,
startLatitude: that.latitude,
startImg: startImg,
startRemark: that.textareaTxt
}
that.$queue.showLoading('提交中...')
that.$Request.post('/app/artificer/startOrders', data).then(res => {
uni.hideLoading();
if (res.code == 0) {
that.getOrder()
websocketUtils.uploadAudioStart(); //开启音频录制
uni.hideLoading();
} else {
that.$queue.showToast(res.msg);
}
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
// 完成订单
cancel(e) {
let that = this
let artificerId = uni.getStorageSync("artificerId");
let jumpRootStatus = false;
uni.showModal({
title: '提示',
content: '如果服务未完成点击完成订单会遭到平台违规处理，请确认服务是否完毕?',
success: async function(res) {
if (res.confirm) {
let data = {
ordersId: e.ordersId,
accomplishLongitude: '125.430647',
accomplishLatitude: '43.880721',
// accomplishLongitude: that.longitude,
// accomplishLatitude: that.latitude,
jsFwcn: that.checkbox2,
jsPjtag: that.selectedString,
jsTsbz: that.textareaTxt
}
that.$queue.showLoading('提交中...')
let resA = await post('/app/artificer/accomplishOrders', data);
if (resA.code == 0 || resA.code == 200) {
that.$refs.popupW.close("bottom");
that.getOrder();
websocketUtils.uploadAudioEnd(); //关闭音频上传
uni.showToast({
title: '操作成功！'
});
uni.hideLoading();
// uni.switchTab({
// url:'/pages/order/index'
// })
} else {
uni.showToast({
icon: 'error',
title:resA.msg
})
uni.hideLoading();
}
// let resB = await getXZX("/app/material/selectMaterialArtificer?artificerId=" +
// artificerId + "&page=" +
// (this
// .currentPage ? this
// .currentPage : '') + "&limit=" + (this.pageSize ? this.pageSize : ''));
// console.log(resB);
// if (resB && resB.data && resB.code == 0) {
// that.homeMaterialPackageList = resB?.data;
// }
// let materialPackageCountFlag = that.homeMaterialPackageList.some((item) => item
// .residue <= item
// .materialMinimum);
// if (materialPackageCountFlag) {
// jumpRootStatus = false;
// let resC = await post('/app/artificer/offline', );
// if (resC && resC.code == 0) {
// that.$queue.showToast("当前剩余物料包数量不足，已强制离线");
// } else {
// that.$queue.showToast(resC.msg);
// }
// }
// setTimeout(() => {
// uni.navigateBack();
// }, 1600)
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
//老订单 方法
onCountdownChange(e) {
if (e == 183) {
if (this.innerAudioContext) {
try {
this.innerAudioContext.pause();
this.innerAudioContext.destroy();
this.innerAudioContext = null;
} catch (e) {
}
}
this.innerAudioContext = uni.createInnerAudioContext();
this.innerAudioContext.autoplay = true;
this.innerAudioContext.src = "../../static/endServerTimer.mp3";
this.innerAudioContext.onPlay(() => {
console.log('开始播放');
});
this.innerAudioContext.onError((res) => {
console.log(res.errMsg);
console.log(res.errCode);
});
}
},
// 触发uni倒计时组件服务时间3分钟时播放提示音
timeFormat(param) {
return param < 10 ? '0' + param : param;
},
goBaoJing() {
uni.navigateTo({
url: '/pages/index/jinji'
});
},
goChat() {
let kefu = this.$queue.getData('kefu'); // 用户端联系方式 1 手机号 2企业微信
let kefuPhone = this.$queue.getData('kefuPhone');
if (uni.getStorageSync('token')) {
if (kefu == 1) {
uni.makePhoneCall({
phoneNumber: kefuPhone //仅为示例
});
} else {
// #ifdef MP-WEIXIN
let that = this
try {
wx.openCustomerServiceChat({
extInfo: {
url: that.$queue.getData('kefuUrl')
},
corpId: that.$queue.getData('kefuAppId'),
success(res) {},
fail(res) {
console.error(res)
}
})
} catch (error) {
console.error("catchcatch" + error)
uni.showToast({
title: '请更新至微信最新版本'
});
}
// #endif
// #ifndef MP-WEIXIN
let url = this.$queue.getData('kefuUrl');
if (url.indexOf('/pages/') !== -1 || url.indexOf('/my/') !== -1) {
uni.navigateTo({
url
});
} else {
//#ifndef H5
uni.navigateTo({
url: '/pages/index/webView?url=' + url
});
//#endif
//#ifdef H5
window.location.href = url;
//#endif
}
// #endif
}
} else {
uni.showModal({
title: '提示',
content: '您还未登录,请先登录',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定');
uni.navigateTo({
url: '/pages/public/login'
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
})
}
},
copy(num) {
uni.setClipboardData({
data: num,
success: r => {
this.$queue.showToast('复制成功');
}
});
},
//支付选择
selectWay: function(item) {
this.openWay = item.id;
},
//换算年龄
getAge(e) {
console.log('出生日期：' + e)
this.birthDate = e
//创建系统日期
var today = new Date();
//把出生日期转换成日期
this.birthDate = new Date(this.birthDate);
//分别获取到年份后相减
this.age = today.getFullYear() - this.birthDate.getFullYear();
// console.log(this.age+'当前年龄')
},
// 修改订单地址
undateAdd(order) {
if (order.state == 0) {
uni.navigateTo({
url: '../address/address?order=' + order.ordersId + '&id=' + 3
})
}
},
copyAddress() {
uni.setClipboardData({
data: this.order.userName + '\n' + this.order.phone + '\n' + this.order.address,
success: r => {
this.$queue.showToast('复制成功');
}
});
},
// 一键导航
bindGps(latitude, longitude, name, detailsadd) {
console.log(latitude, longitude, name, detailsadd)
uni.openLocation({
latitude: latitude - 0, //要去的纬度-地址
longitude: longitude - 0, //要去的经度-地址
name: name, //地址名称
address: detailsadd, //详细地址名称
success: function() {
console.log('导航成功');
},
fail: function(error) {
console.log(error)
}
});
},
// 拨打电话
bindphone(phone) {
let that = this
uni.showModal({
title: '提示',
content: '是否拨打电话',
success: function(res) {
if (res.confirm) {
console.log('用户点击确定', phone);
uni.makePhoneCall({
phoneNumber: phone //仅为示例
});
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
goNav(e) {
uni.navigateTo({
url: e
})
},
ysPhone(phoneA, phoneB) {
this.$Request.getT('/app/user/insertVirtualPhone?phoneA=' + phoneA + '&phoneB=' + phoneB).then(res => {
if (res.code == 0) {
this.order.phone = res.data;
}
});
},
delOrder(e) {
let that = this
uni.showModal({
title: '提示',
content: '确定删除订单吗?',
success: function(res) {
if (res.confirm) {
let data = {
ordersId: e.ordersId,
}
that.$queue.showLoading('删除中...')
that.$Request.post('/app/artificer/removeOrders', data).then(res => {
uni.hideLoading();
if (res.code == 0) {
uni.showToast({
name: "删除成功"
})
uni.navigateBack()
} else {
that.$queue.showToast(res.msg);
}
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
getIsVip() {
this.$Request.get("/app/UserVip/isUserVip").then(res => {
if (res.code == 0) {
this.isVip = res.data
uni.setStorageSync('isVIP', res.data)
}
});
},
openpay() {
this.showpay = true
},
// 支付订单
pay() {
let that = this
if (that.openWay == 1) { //零钱支付
uni.showModal({
title: '付款提示',
content: '确认支付' + that.order.payMoney + '元吗?',
success: function(re) {
if (re.confirm) {
console.log('用户点击确定');
that.$queue.showLoading('支付中...')
that.$Request.post("/app/artificer/payOrders", {
ordersId: that.order.ordersId,
}).then(res => {
uni.hideLoading();
if (res.code == 0) {
uni.showToast({
title: '支付成功'
})
that.getOrder()
} else {
uni.showToast({
title: res.msg,
icon: 'none'
})
}
});
} else if (re.cancel) {
console.log('用户点击取消');
}
}
})
} else if (that.openWay == 2) { //微信支付
// #ifdef MP-WEIXIN
let data = {
orderId: that.order.ordersId,
// type: 3
}
that.$Request.post('/app/wxPay/wxPayMpOrder', data).then(ret => {
console.log(ret)
if (ret.code == 0) {
this.showpay = false
uni.requestPayment({
provider: 'wxpay',
timeStamp: ret.data.timestamp,
nonceStr: ret.data.noncestr,
package: ret.data.package,
signType: ret.data.signType,
paySign: ret.data.sign,
success: function(ret) {
console.log(ret)
uni.showToast({
title: '支付成功',
icon: 'none'
})
that.getOrder()
// this.$queue.showToast('支付成功');
// uni.switchTab({
// url: '/pages/my/index'
// })
},
fail: function(err) {
// this.$queue.showToast('支付失败');
uni.showToast({
title: '支付失败',
icon: 'nones'
});
that.getOrder()
}
});
}
});
// #endif
// #ifdef H5
let data = {
orderId: that.order.ordersId,
// type: 2
}
that.$Request.post('/app/wxPay/wxPayJsApiOrder', data).then(rea => {
that.showpay = false
that.callPay(rea);
});
// #endif
// #ifdef APP
let data = {
orderId: that.order.ordersId,
// type: 1
}
that.$Request.post('/app/wxPay/payAppOrder', data).then(rea => {
console.log(rea)
that.showpay = false
if (rea.code == 0) {
that.isCheckPay(rea.code, 'wxpay', JSON.stringify(rea.data));
}
});
// #endif
} else if (that.openWay == 3) { //支付宝支付
// #ifdef H5
let data = {
ordersId: that.order.ordersId,
type: 2
}
that.$Request.post('/app/aliPay/payOrder', data).then(
rea => {
that.showpay = false
const div = document.createElement('div')
div.innerHTML = rea.data //此处form就是后台返回接收到的数据
document.body.appendChild(div)
document.forms[0].submit()
});
// #endif
// #ifdef APP-PLUS
let data = {
ordersId: that.order.ordersId,
type: 1
}
that.$Request.post('/app/aliPay/payOrder', data).then(
rea => {
that.showpay = false
that.setPayment('alipay', rea.data);
});
// #endif
}
},
callPay: function(response) {
if (typeof WeixinJSBridge === "undefined") {
if (document.addEventListener) {
document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
} else if (document.attachEvent) {
document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
}
} else {
this.onBridgeReady(response);
}
},
onBridgeReady: function(response) {
let that = this;
if (!response.package) {
return;
}
WeixinJSBridge.invoke(
'getBrandWCPayRequest', {
"appId": response.appid, //公众号名称，由商户传入
"timeStamp": response.timestamp, //时间戳，自1970年以来的秒数
"nonceStr": response.noncestr, //随机串
"package": response.package,
"signType": response.signType, //微信签名方式：
"paySign": response.sign //微信签名
},
function(res) {
if (res.err_msg === "get_brand_wcpay_request:ok") {
// 使用以上方式判断前端返回,微信团队郑重提示：
//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
uni.hideLoading();
uni.showToast({
title: '支付成功',
icon: 'none'
})
that.getOrder()
} else {
uni.hideLoading();
}
WeixinJSBridge.log(response.err_msg);
}
);
},
isCheckPay(code, name, order) {
if (code == 0) {
this.setPayment(name, order);
} else {
uni.hideLoading();
uni.showToast({
title: '支付信息有误'
});
}
},
setPayment(name, order) {
let that = this
uni.requestPayment({
provider: name,
orderInfo: order, //微信、支付宝订单数据
success: function(res) {
uni.hideLoading();
uni.showToast({
title: '支付成功',
icon: 'none'
})
that.getOrder()
},
fail: function(err) {
uni.hideLoading();
},
complete() {
uni.hideLoading();
}
});
},
cxOrder(e) {
let contentName = '确认已经出发了吗？';
if (e.status == 7) {
contentName = '确认到达服务地点准备开始服务了吗？';
}
let that = this
uni.showModal({
title: '提示',
content: contentName,
success: function(res) {
if (res.confirm) {
let data = {
ordersId: e.ordersId
}
that.$queue.showLoading('提交中...')
that.$Request.post('/app/artificer/artificerStartOrEndTime', data).then(res => {
uni.hideLoading();
if (res.code == 0) {
that.getOrder()
} else {
that.$queue.showToast(res.msg);
}
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
// 取消订单
cancelOrder(e) {
let that = this
uni.showModal({
title: '提示',
content: '确认取消订单吗？取消订单将会被扣除信用分！',
success: function(res) {
if (res.confirm) {
let data = {
ordersId: e.ordersId
}
that.$queue.showLoading('提交中...')
that.$Request.post('/app/artificer/deleteOrders', data).then(res => {
uni.hideLoading();
if (res.code == 0) {
that.getOrder();
uni.showToast({
title: '操作成功！'
})
} else {
that.$queue.showToast(res.msg);
}
})
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
},
// 查看图片
saveImg(imgs, index) {
if (this.LBSelect) {
if (index == this.LBIndex - 1) {
return;
}
}
// console.log(imgs)
let that = this;
let imgArr = imgs
// imgArr.push(imgs);
// //预览图片
uni.previewImage({
urls: imgArr,
current: imgArr[index],
});
},
removeImg(index, state) {
if (state == 1) {
this.startImgs.splice(index, 1)
} else if (state == 2) {
this.endImgs.splice(index, 1)
}
},
// 图片上传
addImage(e) {
console.log(11)
let that = this;
uni.chooseImage({
count: 6,
sourceType: ['camera'],
success: res => {
// 用于拍照后回显
let urlName = "";
if (e == 1) {
urlName = websocketUtils.getBaseUrl() + '/alioss/uploadWatermark';
}
console.log(urlName);
if (res && res.tempFilePaths.length > 0) that.pictureEcho.push(res.tempFilePaths[0]);
for (let i = 0; i < res.tempFilePaths.length; i++) {
that.$queue.showLoading("上传中...");
uni.uploadFile({ // 上传接口
// url: websocketUtils.uploadFileUrl(), //真实的接口地址
url: urlName, //真实的接口地址
filePath: res.tempFilePaths[i],
name: 'file',
success: (uploadFileRes) => {
if (e == 1) {
console.log(JSON.parse(uploadFileRes.data).data)
that.startImgs.push(JSON.parse(uploadFileRes.data).data)
} else if (e == 2) {
that.endImgs.push(JSON.parse(uploadFileRes.data).data)
}
uni.hideLoading();
},
fail(err) {
console.log(err);
}
});
}
}
})
},
// 获取APP端当前物料包剩余数量及最小消耗数量判断，如果剩余数量少于最小消耗数量时
getHomeMaterialPackageList() {
let artificerId = uni.getStorageSync("artificerId");
let that = this;
getXZX("/app/material/selectMaterialArtificer?artificerId=" + artificerId + "&page=" +
(this
.currentPage ? this
.currentPage : '') + "&limit=" + (this.pageSize ? this.pageSize : '')).then(async (res) => {
if (res && res.data && res.code === 0) {
that.homeMaterialPackageList = res?.data;
}
})
},
goMsg() {
let data = {
userId: uni.getStorageSync('userId'),
focusedUserId: this.order.user.userId
}
this.$Request.postJson('/app/chat/insertChatConversation ', data).then(res => {
if (res.code == 0) {
let id = this.order.user.userId == res.data.userId ? res.data.focusedUserId : this.order
.user.userId
uni.navigateTo({
url: '/pages/msg/im?chatConversationId=' + res.data.chatConversationId +
'&byUserId=' + id
})
}
})
},
//新订单 方法
closePopup(type) { // 关闭弹出框
this.type = type
this.$refs.popupW.close(type);
},
}
}
</script>
<style scoped>
.view-num {
margin: 0 2px;
height: 26px;
text-align: center;
font-size: 14px;
border-width: 0;
background: rgb(245, 245, 245);
color: rgb(51, 51, 51);
width: 27px;
line-height: 26px;
}
.jia {
line-height: 28px !important;
}
.jian,
.jia {
height: 28px;
line-height: 28px;
color: #c0c0c0 !important;
cursor: not-allowed;
font-size: 20px;
font-weight: 300;
padding: 0 8px;
background: rgb(245, 245, 245);
cursor: pointer;
border-top-left-radius: 2px;
border-bottom-left-radius: 2px;
}
.jiajian {
display: flex;
flex-direction: row;
align-items: center;
}
.nav-text {
font-weight: 700;
font-size: 16px;
line-height: 30px;
text-align: center;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 16px;
opacity: 1;
color: #000;
}
.nav-img,
.kong {
width: 25px;
height: 25px;
}
.nav-view {
position: fixed;
left: var(--window-left);
right: var(--window-right);
height: 60px;
height: calc(60px + constant(safe-area-inset-top));
height: calc(60px + env(safe-area-inset-top));
padding: 7px 3px;
padding-top: calc(7px + constant(safe-area-inset-top));
padding-top: calc(7px + env(safe-area-inset-top));
display: -webkit-box;
display: -webkit-flex;
display: flex;
flex-direction: row;
align-items: flex-end;
overflow: hidden;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
justify-content: space-between;
box-sizing: border-box;
z-index: 998;
background-color: #fff;
-webkit-transition-property: all;
transition-property: all;
}
.bj_view {
width: 100rpx;
height: 100rpx;
border-radius: 100rpx;
position: fixed;
right: 30rpx;
bottom: 180rpx;
}
.beizhu-textarea {
width: 100%;
height: 199rpx;
background-color: rgba(226, 226, 226, 0.3);
border-radius: 14rpx;
padding: 10px;
font-size: 26rpx;
}
.guke-list {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
flex-wrap: wrap;
box-sizing: border-box;
}
.huiBtn {
background: #f6f6f6;
color: #333333;
}
.lanBtn {
background-color: #049F89;
color: #fff;
}
.guke-btn {
width: 23%;
height: 55rpx;
margin-left: 5px;
text-align: center;
line-height: 55rpx;
font-weight: bold;
font-size: 25rpx;
border-radius: 14rpx;
margin-bottom: 10px;
}
/deep/.uni-data-checklist .checklist-group .checklist-box .checkbox__inner .checkbox__inner-icon {
top: 0px;
left: 5px;
height: 13px;
width: 8px;
}
/deep/.uni-data-checklist .checklist-group .checklist-box .checklist-content .checklist-text {
font-size: 28rpx;
}
/deep/.uni-data-checklist .checklist-group .checklist-box .checkbox__inner {
width: 44.44rpx;
height: 44.44rpx;
border-radius: 50%;
}
/deep/.uni-data-checklist {
display: flex;
flex-direction: column;
}
/deep/.uni-data-checklist /deep/.checklist-group {
flex-direction: column;
}
.popup-title {
font-weight: bold;
font-size: 29rpx;
color: #333333;
margin-left:4px;
line-height:70rpx;
}
.fuwu,
.guke,
.beizhu {
width: 100%;
display: flex;
flex-direction: column;
}
.popup-view {
width: 100%;
display: flex;
flex-direction: column;
}
.popup-mian-btn span:nth-child(1) {
background: linear-gradient(90deg, #FE912E, #FF9970);
}
.popup-mian-btn span:nth-child(2) {
background: linear-gradient(90deg, #019C88, #28BA92, #35C495);
}
.popup-mian-btn span {
width: 247rpx;
height: 77rpx;
line-height: 77rpx;
text-align: center;
font-weight: 400;
font-size: 32rpx;
color: #FFFEFE;
border-radius: 39rpx;
}
.popup-mian-btn {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-top: 10px;
}
.popup-mian {
width: 88%;
display: flex;
flex-direction: column;
margin: 5px auto 0px auto;
}
.popup-head span:nth-child(2) {
width: 50rpx;
height: 50rpx;
}
.popup-img {
width: 55rpx;
height: 55rpx;
position: absolute;
right:30rpx;
}
.popup-head span:nth-child(1) {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.popup-head {
width: 100%;
background-color: rgba(21, 171, 141, 0.09);
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 42rpx 20rpx;
}
.popup-content {
width: 100%;
height: 600px;
background: #FFFFFF;
border-top-left-radius: 56rpx;
border-top-right-radius: 56rpx;
display: flex;
flex-direction: column;
}
.item-view-bottom-btn {
text-align: center;
width: 131rpx;
height: 50rpx;
line-height: 50rpx;
background: linear-gradient(90deg, #019C88, #0FA78B, #35C495);
border-radius: 10rpx;
font-weight: bold;
font-size: 24rpx;
color: #FFFFFF;
}
.dian {
width: 33px;
height: 33px;
line-height: 16px;
border-radius: 50%;
border: 3px solid #029D88;
display: flex;
justify-content: center;
font-size: 24px;
font-weight: bold;
color: #029D88;
}
.footers-bor {
border: 1px solid #029D88;
background-color: #fff;
color: #029D88;
}
.footers-true {
background: #029D88;
color: #fff;
}
.footers-btn {
width: 204rpx;
height: 82rpx;
text-align: center;
display: flex;
justify-content: center;
align-items: center;
border-radius: 80rpx;
font-weight: 400;
font-size: 29rpx;
margin-right: 8rpx;
}
.footers {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
margin-top: 30px;
}
.margin-top-view {
width: 189rpx;
height: 189rpx;
background: #EBEBEB;
border-radius: 21rpx;
}
.item_view {
margin-top: 30rpx;
}
.item_view input {
margin-top: 20rpx;
height: 40rpx;
font-size: 24rpx;
font-family: PingFang SC Regular, PingFang SC Regular-Regular;
font-weight: 400;
color: #333333;
}
.xian {
width: 100%;
border-bottom: 1rpx solid #f7f7f7;
margin-top: 10rpx;
}
.item_title {
font-weight: 400;
font-size: 22rpx;
color: #666666;
font-family: PingFang SC Heavy, PingFang SC Heavy-Heavy;
}
.fuhao-heis {
color: #fff;
font-size: 25rpx;
}
.num-heis {
color: #fff;
font-size: 34.72rpx;
font-weight: bold;
}
.yingde-money {
display: flex;
flex-direction: row;
align-items: center;
}
.yuji-title {
font-weight: 400;
font-size: 28rpx;
color: #FFFFFF;
}
.yiji {
width: 100%;
height: 88rpx;
background: linear-gradient(-90deg, #2EC5AC, #08A28A);
border-radius: 21rpx;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 10px;
height: 72rpx;
margin-top: 10px;
}
.fuhao-hei {
font-size: 25rpx;
color: #333333;
}
.num-hei {
font-size: 31.25rpx;
color: #333333;
}
.yingde-money {
display: flex;
flex-direction: row;
align-items: center;
}
.yingde-title {
font-size: 32rpx;
color: #333333;
}
.yingde {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 0 5px;
height: 80rpx;
background: #DCF4EF;
border-bottom-left-radius: 16rpx;
border-bottom-right-radius: 16rpx;
}
.mian-content-textarea {
width: 100%;
display: flex;
flex-direction: column;
height: 120px;
/* border-bottom: 1px solid #e5e5e5; */
padding: 0px 10px;
margin-top: 10px;
}
.mian-content-list-title {
font-size: 22rpx;
color: #333333;
}
.mian-content-list-title {
font-size: 22rpx;
color: #555555;
}
.mian-content {
width: 100%;
display: flex;
flex-direction: column;
background: #fff;
border-radius: 24rpx;
padding: 10px;
margin-top: 20px;
}
.mian-content-list {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
height: 50px;
border-bottom: 1px solid #e5e5e5;
padding: 0px 5px;
}
.textarea-mian {
width: 100%;
height: 100%;
background: #F3F3F3;
border-radius: 14rpx;
padding: 5px;
font-size:14px;
padding: 20rpx;
color: #999;
margin-top: 10rpx;
}
.value-font {
font-size: 30rpx;
color: #333333;
}
.mian-content-list-title {
font-size: 30rpx;
color: #999;
}
.title-font {
font-size: 30rpx;
color: #999;
}
.mian-view-list:last-child {
border: 0px !important;
}
.mian-view-list {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
/* height: 44px; */
/* border-bottom: 1px solid #e5e5e5; */
padding: 11px 10px;
}
.mian-view {
width: 100%;
display: flex;
flex-direction: column;
background: #fff;
border-radius: 24rpx;
padding: 10px;
}
.mina-title-bor {
width: 64px;
height: 5px;
border-radius: 3px;
position: absolute;
bottom: 0;
background: linear-gradient(90deg, rgba(234, 248, 245, 0.7), rgba(132, 211, 196, 0.7));
}
.mina-title-text {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.mina-title {
width: 90%;
/* text-align: center; */
display: flex;
flex-direction: column;
position: relative;
/* align-items: center;
justify-content: center;
margin:40rpx 0; */
margin: 10px 10px;
}
.mian-view {
width: 100%;
padding: 10px;
display: flex;
flex-direction: column;
margin-top: 24rpx;
}
.diandan-num {
width: 100%;
height: 74rpx;
line-height: 74rpx;
font-size: 25rpx;
color: #666666;
padding-left: 10px;
background: #FFFFFF;
border-radius: 24rpx;
margin: 15px 0px 20px 0px;
}
.mian-top-foot-view-img span,
.mian-top-foot-view-text {
font-size: 29rpx;
color: #333;
}
.mian-top-foot-view-img image {
width: 26.39rpx;
height: 25.69rpx;
margin-left: 5px;
}
.mian-top-foot-view-img {
display: flex;
flex-direction: row;
align-items: center;
}
.mian-top-foot-view-title {
font-size: 29rpx;
color: #999;
}
.mian-top-foot-view {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.mian-top-foot {
width: 100%;
display: flex;
flex-direction: column;
}
.number {
color: #FF1200;
font-size: 32rpx;
font-weight: bold;
}
.fuhao {
color: #FF6000;
font-size: 30rpx;
font-weight: bold;
}
.mian-money-num {
display: flex;
flex-direction: row;
align-items: center;
}
.mian-money-title {
font-size: 25rpx;
color: #666666;
}
.mian-money {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
}
.mian-time {
margin-top: 4px;
}
.mian-title-view {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.mian-title {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.mian-top-head-right {
width: 75%;
display: flex;
flex-direction: column;
justify-content: space-between;
}
.mian-top-head-img {
width: 145rpx;
height: 146rpx;
border-radius: 14rpx;
}
.mian-top-head {
width: 100%;
display: flex;
flex-direction: row;
justify-content: space-between;
border-bottom: 1px solid #E5E5E5;
padding-bottom: 15px;
margin-bottom: 15px;
margin-top: 5px;
}
.mian-top {
width: 100%;
/* height: 331rpx; */
padding: 30rpx;
background: #FFFFFF;
border-radius: 24rpx;
}
.mian {
width: 92%;
display: flex;
flex-direction: column;
position: absolute;
top: 0;
margin-top: 85px;
overflow: scroll;
background: #f7f7f7;
padding-bottom: 30px;
border-radius: 24rpx;
}
.header {
width: 100%;
height: 300rpx;
background: linear-gradient(-36deg, #11957C, #20A98F, #019C88, #029D88);
margin-top: 45px;
}
.nav-btn {
font-size: 30rpx;
color: #019c88;
font-weight: bold;
}
.nav-title {
font-weight: bold;
font-size: 38rpx;
color: #17181C;
}
.nav-tab image {
width: 15.42rpx;
height: 27.64rpx;
}
.nav-tab {
width: 100%;
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
padding: 10px;
}
.content {
width: 100%;
height: 100vh;
background-color: #f7f7f7;
position: relative;
display: flex;
flex-direction: column;
align-items: center;
padding-bottom: 30px;
overflow: scroll;
}
.title-font {
font-size: 30rpx;
color: #666666;
}
.value-font {
font-size: 30rpx;
color: #333333;
}
.jusitify-line-end {
height: 1px;
border-bottom: 1px #e5e5e5 solid;
margin: 30rpx 0;
}
</style>
Reference in New Issue View Git Blame Copy Permalink