front-end/hdApp/src/admin/billing/affirm.vue

<template>
<view class="app-content">
  <view class="affirm-page">

    <view class="affirm-view overscroll">
      <form>
        <view class="module-com">
          <view class="commodity-view">
            <view class="commodity-list">
              <template v-if="!$util.isEmpty(selectList)">
                <view class="commodity-item" v-for="(item, index) in selectList" :key="index">
                  <!-- #ifdef APP-PLUS -->
                  <image class="item-icon" :src="item.cover" />
                  <!-- #endif -->
                  <!-- #ifdef MP-WEIXIN -->
                  <image class="item-icon" :src="item.cover" />
                  <!-- #endif -->
                  <view class="item-info">
                    <view class="info-line">
                      <text class="item-name">
                        {{ item.name||'' }}
                        <text v-if="item.variety && item.variety ==1" class="show-color"></text>
                      </text>
                      <text class="item-price">
                        <text class="unit">¥</text>
                        <text class="price">{{ parseFloat(item.userPrice)||0 }}</text>
                      </text>
                    </view>

                    <view style="text-align:right;position: relative;">

                      <text style="position: absolute;right:300upx;top:2upx;font-size:28upx;color:green;font-weight:bold;" v-if="item.bigCount > 0">¥{{ parseFloat((Number(item.bigCount)*Number(item.userPrice)).toFixed(2)) }}</text>
                      <text style="position: absolute;right:300upx;top:2upx;font-size:28upx;color:green;font-weight:bold;" v-else>¥{{ parseFloat((Number(item.smallCount)*Number(item.userPrice)).toFixed(2)) }}</text>

                      <view class="open-bx" >
                        <i class="iconfont iconjian" @click="reduceItemFn(item)" v-if="item.bigCount > 0 || item.smallCount > 0"></i>
                        <text class="num" @click="showAddModelFn(item)">
                          <text v-if="item.bigCount > 0" style="font-size:24upx;font-weight:bold;color:#3385ff;">{{ item.bigCount }}</text>
                          <text v-if="item.smallCount > 0" style="font-size:24upx;">{{ item.smallCount }}</text>
                        </text>
                        <i class="iconfont iconzeng" @click="addItemFn(item)"></i>
                      </view>
                    </view>

                  </view>
                </view>
              </template>
            </view>
            <view class="summary-bar">
              <view class="operate-view" v-if="isScanEnv" @click="removeFromSave(option.customId)"> <text class="iconfont iconshanchu1"></text>清除花材 </view>
              <view class="operate-view" v-else @click="gobackEvent" style="font-size:32upx;font-weight:bold;"><text class="iconfont icongouwuche" style="margin-right:5upx;"></text>返回修改</view>
              <view class="describe-view">
                <text>合计 ¥{{ allPrice }}</text>
              </view>
            </view>
            <view class="summary-bar">
              <view class="operate-view" v-if="isScanEnv" @click="pageToItemList()"><text class="iconfont iconzeng"></text>手动添加花材</view>
              <view class="operate-view" v-if="isScanEnv == false"><text> </text></view>
              <view class="describe-view">
                <text>{{ selectList.length }}种</text>
                <text v-if="Number(totalItemNum.big)>0">，{{totalItemNum.big?parseFloat(totalItemNum.big):0}}扎</text>
                <text v-if="Number(totalItemNum.small)>0">，{{totalItemNum.small?parseFloat(totalItemNum.small):0}}支</text>
              </view>
            </view>
          </view>
        </view>

        <modal-module :show="isAddModel" @cancel="addItemModelHidden" @click="confirmAddItemModel" :title="customData.name" color="#333" :size="32" padding="30rpx 30rpx" >
          <template slot="customContent">
            <view class="select-cmd_bx" v-if="customData">
              <view class="kc">
                <text class="unit_price">库存 {{ parseFloat(customData.stock) }}</text>
                <text class="unit_price"> ¥{{ parseFloat(customData.price) }}</text>
              </view>

              <view class="num_bx">
                <input style="width: 430upx" v-model="customData.userPrice" @focus="customData.userPrice = null" type="number" placeholder="单价" :disabled="false" />
                <text style="font-size:35upx;font-weight:bold;color:#666666;">元</text>
              </view>

              <view class="num_bx">
                <!-- #ifdef APP-PLUS -->
                <input style="width: 430upx" v-model="customData.bigCount" v-if="globalUnitType == 0" type="number" />
                <text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 0">扎</text>
                <input style="width: 430upx" v-model="customData.smallCount" v-if="globalUnitType == 1" type="number" />
                <text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 1">支</text>
                <!-- #endif -->

                <!-- #ifdef MP-WEIXIN -->
                <input style="width: 430upx" v-model="customData.bigCount" v-if="globalUnitType == 0" :focus="isAddInputFocus" type="number" />
                <text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 0">扎</text>
                <input style="width: 430upx" v-model="customData.smallCount" v-if="globalUnitType == 1" :focus="isAddInputFocus" type="number" />
                <text style="font-size:35upx;font-weight:bold;color:#666666;" v-if="globalUnitType == 1">支</text>
                <!-- #endif -->

                <image @click="switchGlobalUnitType" :src="`${constant.imgUrl}/icon/switch/switch128.png`" 
                style="width:86upx;height:86upx;position:relative;top:-60upx;right:0upx;" mode="widthFix"></image>

              </view>

            </view>
          </template>
        </modal-module>

        <view class="module-com input-line-wrap">
					<view>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false">
            <view class="tui-title">客户</view>
            <view class="tui-input">
              {{ form.customName }}
            </view>
          </tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false" v-if="Number(customInfo.balance)>0">
            <view class="tui-title">余额</view>
            <view class="tui-input" style="color:#3385FF;font-weight:bold;">
              ¥{{ parseFloat(customInfo.balance) }}
            </view>
          </tui-list-cell>

					<tui-list-cell class="line-cell" :hover="false" :arrow="false">
						<view class="tui-title">结账方式</view>
						<view class="payment-buttons">
							<view class="button-row">
                <button @click="form.hasPay = 4" class="admin-button-com middle" :class="form.hasPay == 4 ? 'blue' : 'default'">余额</button>
                <button @click="form.hasPay = 0" class="admin-button-com middle" :class="form.hasPay == 0 ? 'blue' : 'default'">扫码</button>
							</view>
							<view class="button-row">
                <button @tap="form.hasPay = 1" class="admin-button-com middle" :class="form.hasPay == 1 ? 'blue' : 'default'">线下</button>
								<button @click="form.hasPay = 2" class="admin-button-com middle" :class="form.hasPay == 2 ? 'blue' : 'default'">赊账</button>
							</view>
						</view>
					</tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="true" v-if="form.hasPay == 1">
            <view class="tui-title">线下渠道</view>
            <picker mode="selector" :value="payWayindex" :range="payWayList" range-key="name" @change="payWayChange" class="tui-input">
              <view class="uni-input" v-if="form.payWay == 0">线下微信</view>
              <view class="uni-input" v-else-if="form.payWay == 1">线下支付宝</view>
              <view class="uni-input" v-else-if="form.payWay == 4">现金</view>
              <view class="uni-input" v-else-if="form.payWay == 5">银行卡</view>
              <view class="uni-input" v-else style="color:#CCCCCC;">请选择</view>
            </picker>
          </tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false">
            <view class="tui-title">打印小票</view>
            <button @tap="form.needPrint = 2" class="admin-button-com middle" style="width:140upx;" :class="form.needPrint == 2? 'blue' : 'default'">不打印</button>
            <button @click="form.needPrint = 1" class="admin-button-com middle" style="width:140upx;" :class="form.needPrint == 1 ? 'blue' : 'default'">打印</button>
          </tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false" >
            <view class="tui-title">
              <text>合计金额</text>  
            </view>
            <text style="color: #3385FF;width:170upx;">¥{{parseFloat(finalPrice)}}</text>
            <button @tap="showDiscount()" class="admin-button-com middle default" style="width:140upx;">打折</button>
            <text v-if="discountValue>0 && discountValue<1">{{ Number(discountValue)*10 }}折</text>
          </tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false" >
            <view v-if="form.hasPay == 2" class="tui-title">应收金额</view>
            <view v-else-if="form.hasPay == 3" class="tui-title">余额扣减</view>
            <view v-else class="tui-title">{{form.forward==0?'实收':'实付'}}金额</view>
            <input style="border:1upx solid #eee;color:#3385FF;width:150upx;height:70upx;" type="digit" @focus="modifyPrice=''" v-model="modifyPrice" placeholder-class="tui-placeholder"/>
            <text v-if="modifyPrice > 0 && modifyPrice > finalPrice" style="font-size:25upx;margin-left:20upx;color:red;">人工包装费 ¥{{parseFloat((modifyPrice-finalPrice).toFixed(2))}}</text>
            <text v-if="modifyPrice > 0 && modifyPrice < finalPrice" style="font-size:25upx;margin-left:20upx;color:green;">优惠 ¥{{parseFloat((finalPrice-modifyPrice).toFixed(2))}}</text>
          </tui-list-cell>

					<tui-list-cell class="line-cell" :hover="false" :arrow="true">
						<view class="tui-title">送货日期</view>
						<picker mode="date" :value="form.sendTimeWant" @change="bindDateChange" style="width:400upx;">
							<view class="uni-input" v-if="form.sendTimeWant==''" style="color:#CCCCCC;">请选择</view>
							<view class="uni-input">{{form.sendTimeWant}}</view>
						</picker>
					</tui-list-cell>

          <tui-list-cell class="line-cell" :arrow="true">
            <div class="tui-title">开单人</div>
            <picker mode="selector" :value="form.getStaffId" :range="staffList" range-key="name" @change="kdChange" class="tui-input" >
              <input v-model="form.getStaffId" name="getStaffId" type="text" hidden />
              <div style="padding:6upx 0 6upx 0;" v-if="form.getStaffName!=''">{{form.getStaffName}}</div>
              <div v-else style="padding:6upx 0 6upx 0;color:#CCCCCC;">请选择</div>
            </picker>
          </tui-list-cell>

					<tui-list-cell class="line-cell" :hover="false" :arrow="true">
						<view class="tui-title">账单日期</view>
            <view class="uni-input" v-if="form.historyDate==''" style="color:#CCCCCC;" @click="bindHistoryDateChange">请选择，默认当天</view>
            <view class="uni-input" @click="bindHistoryDateChange">{{form.historyDate}}</view>
					</tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false">
            <view class="tui-title">备注</view>
						<textarea style="height:80upx;z-index:0" v-model="form.remark" placeholder-class="remark-class" placeholder="选填" />
					</tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false">
            <view class="tui-title">订单类型</view>
            <button @tap="form.forward = 0;form.hasPay = 4" class="admin-button-com middle" style="width:170upx;" :class="form.forward == 0? 'blue' : 'default'">收入订单</button>
            <button @click="form.forward = 1;form.hasPay = 1" class="admin-button-com middle" style="width:170upx;" :class="form.forward == 1 ? 'blue' : 'default'">售后付款</button>
          </tui-list-cell>

          <tui-list-cell class="line-cell" :hover="false" :arrow="false" v-if="form.forward == 1">
            <view class="tui-title">退货方式</view>
            <button @tap="form.forwardStock = 0" class="admin-button-com middle" style="width:190upx;" :class="form.forwardStock == 0? 'blue' : 'default'">货退回来</button>
            <button @click="form.forwardStock = 1" class="admin-button-com middle" style="width:160upx;" :class="form.forwardStock == 1 ? 'blue' : 'default'">货不退回</button>
          </tui-list-cell>

          </view>
        </view>
      </form>
    </view>

    <view class="under-bar">
      <view class="price-view">
        <text class="price-title">
          <text></text>
        </text>
        <text class="price-number"><text class="large">{{form.forward==0?'':'-'}}¥{{ modifyPrice }}</text></text>
      </view>
      <!-- <text style="font-size:30upx;right:100upx;">当前在<text style="font-weight:bold;color:red;margin-left:5upx;font-size:32upx;">{{currentShop.shopName}}</text></text> -->
      <button class="admin-button-com blue big" @click="confirmSubmit">提交</button>
    </view>

    <view v-if="isScanEnv" @click="changeGet" style="width:125upx;height:125upx;display:flex;justify-content:center;align-items:center;font-size:60upx;
    background:#3385ff;color:white;z-index:9999;position:fixed;bottom:230upx;right:40upx;border-radius:60upx;">{{calc=='add'?'+':'-'}}</view>

		<uni-popup ref="diffPriceRef" background-color="#fff" type="center" :animation="false" class="class-popup-style">
			<view style="display:flex;padding:40upx 20upx 20upx 20upx;height:auto;justify-content: space-between;align-items:center;flex-wrap:wrap;max-height:100vh;overflow:auto;">

        <block v-if="!$util.isEmpty(diffPriceList)">
          <view  v-for="(item, index) in diffPriceList" :key="index" 
          style="font-size:32upx;color:red;font-weight:bold;margin-top:10upx;">
            <text>{{item.name}}</text>
            <text style="margin-left:25upx;">系统售价 ¥{{item.price?parseFloat(item.price):0}}</text>
            <text style="margin-left:25upx;">您开价 ¥{{item.kdPrice?parseFloat(item.kdPrice):0}}</text>
          </view>
        </block>
        <view style="margin-top:20upx;font-size:28upx;font-weight:bold;">
          <view>以上花材，开单价和系统售价不一样，确认提交吗？</view>
        </view>
        <view style="text-align:center;margin-top:30upx;width:100%;">
          <button class="admin-button-com big default" @click="returnCheck()">返回修改</button>
          <button style="margin-left:20upx;" @click="diffPriceConfirm()" class="admin-button-com big blue">确认提交</button>
        </view>
			</view>

		</uni-popup>
		<uni-popup ref="discountRef" background-color="#fff" type="center" :animation="false" class="class-popup-style">
      <view style="display:flex;padding:20upx;min-height:25vh;justify-content: space-between;align-items:center;flex-wrap:wrap;">
        <text v-for="(item, index) in discountList" :key="index" @click="setDiscount(item.value)" 
        style="margin-left:25upx;border:1upx solid #999999;width:100upx;height:100upx;border-radius:20upx;justify-content:center;align-items:center;display:flex;">
          {{item.name}}
        </text>
       </view>
		</uni-popup>

    <mx-date-picker :show="showPicker" format="yyyy-mm-dd" type="date" :value="defaultPickerDate" :show-tips="true" @confirm="confirmPicker" @cancel="showPicker = false" />

    </view>
  </view>
</template>

<script>
import TuiListCell from "@/components/plugin/list-cell";
import AppAvatarModule from "@/components/module/app-avatar";
import SimpleAddress from "@/components/plugin/simple-address";
import AppAreaSel from "@/components/app-area-sel";
import productMins from "@/mixins/product";
import appFormRadioBtn from "@/components/app-formRadio-btn";
import appAddressGroup from "@/components/app-address-group";
import appSendTime from "@/components/app-send-time";
import appFormSend from "@/components/app-form-send";
const formUtil = require("@/utils/formValidation.js");
import { createOrder, updateOrder } from "@/api/order/index";
import { getAllStaff } from "@/api/shop-admin"
import { mapActions, mapGetters } from "vuex";
import { getCustomInfo} from "@/api/custom"
import ModalModule from "@/components/plugin/modal"
import MxDatePicker from '@/components/mx-datepicker/mx-datepicker.vue';
export default {
  name: "affirm",
  components: {
    TuiListCell,
    AppAvatarModule,
    SimpleAddress,
    AppAreaSel,
    appFormRadioBtn,
    appAddressGroup,
    appSendTime,
    appFormSend,
    ModalModule,
    MxDatePicker
  },
  mixins: [productMins],
  data () {
    return {
			defaultPickerDate:'',
			showPicker: false,
      discountList:[{name:'1折',value:0.1},{name:'2折',value:0.2},{name:'3折',value:0.3},{name:'4折',value:0.4},{name:'5折',value:0.5},{name:'6折',value:0.6},{name:'7折',value:0.7},{name:'8折',value:0.8},{name:'9折',value:0.9},{name:'不打折',value:1}],
      discountValue:0,
      autoLoad: false,
      staffList:[],
			payWayList:[{name:"线下微信",id:0},{name:"线下支付宝",id:1},{name:"现金",id:4},{name:"银行卡",id:5}],
			payWayindex:0,
      form: {
        shopId: "",
        shopName: "",
        receiveProvince: "",
        receiveCity: "",
        receiveFloor: "",
        receiveAddress: "",
        receiveLong: "",
        receiveLat: "",
        sendType: 1,
        sendSide: "2",
        sendDate: "",
        sendTimeWant: "",
        historyDate:"",
        sendCost: "",
        customId: "",
        packCost:"",
        product: "",
        remark:"",
        payWay:0,
        needPrint:2,
        hasPay:0,
        getStaffName:'',
        dealPrice:0,
        forward:0,
        forwardStock:0
      },
      showCustomer: false,
      customInfo:{discount:1,balance:0},
      customData: { bigCount: 0, smallCount: 0, userPrice: 0 },
      isAddModel:false,
      checkStock:true,
			xjData:{},
			xjDataInfo:{},
      modifyPrice:'',
      isScanEnv:false,
      calc:'add',
      diffPriceList:[],
      currentShop:{default:0}
    };
  },
  onLoad (option) {


    this.kdType = option.kdType

    let that = this
    this.initMerchantInfo().then((data) => {

        uni.setNavigationBarTitle({ title: data.name })

        that.currentShop = data.shopInfo

    })

    if(Number(option.customId) > 0){
      this.form.customId = option.customId
      let that = this
      getCustomInfo({ id: option.customId }).then(res => {
        that.form.customName = res.data.custom.name
        that.customInfo = res.data.custom
        that.$forceUpdate()
      })

      //用于混入product的已选中花材！！！！！
      this.selectJobId = option.customId
      this.selectJobType = 'bill'

    }

    //默认欠款是首选项
    this.form.hasPay = 4
    // 初始化支付方式索引
    this.payWayindex = 0
    // #ifdef APP-PLUS
    if(this.$util.isScanEnv()){
      this.isScanEnv = true
    }
	  //#endif

  },
	onShow(){
		if(!this.$util.isEmpty(uni.getStorageSync("newClient"))){
			this.showCustomer = true;
		}

    //获取所有在职员工
    getAllStaff().then(res=>{
      if(res.code == 1){
        this.staffList = res.data.list
      }
    })

	},
	onUnload(){
			uni.removeStorageSync('newClient')
      uni.$off('listenGetScanCode')
	},
  computed: {
    ...mapGetters(["getMerchantInfo","getMyShopInfo", "getLoginInfo"]),
    totalItemNum(){
      let big = 0
      let small = 0
      if(!this.$util.isEmpty(this.selectList)){
          for(const ele of this.selectList){
            if(Number(ele.bigCount)>0){
              big = Number(big)+Number(ele.bigCount)
              big = big.toFixed(0)
            }
            if(Number(ele.smallCount)){
              small = Number(small) + Number(ele.smallCount)
              small = small.toFixed(0)
            }
          }
      }
      return {big:big,small:small}
    },
    finalPrice(){
      let totalPrice = this.allPrice.toFixed(2)
      let finalPrice = Number(totalPrice)
      finalPrice = Number(finalPrice).toFixed(2)
      let currentPrice = parseFloat(finalPrice)
      this.modifyPrice = currentPrice 
      return currentPrice
    },
    labourCost(){
      let cost = 0
      if(Number(this.modifyPrice)>Number(this.finalPrice)){
        cost = Number(this.modifyPrice) - Number(this.finalPrice)
        cost = Number(cost).toFixed(2)
      }
      return cost
    }
  },
  methods: {
    ...mapActions(["initMerchantInfo"]),
    bindHistoryDateChange(){
			this.showPicker = true
    },
		confirmPicker(e) {
			this.form.historyDate = e.value
      this.showPicker = false
		},
		bindDateChange(e){
			let date = e.detail.value
			this.form.sendTimeWant = date
		},
    showDiscount(){
      this.$refs.discountRef.open('center')
    },
    setDiscount(num){
      this.discountValue = Number(num)
      let price = Number(this.finalPrice)*Number(num)
      price = parseFloat(price.toFixed(2))
      this.modifyPrice = price
      this.$refs.discountRef.close()
    },
    beginScan(){
      console.log('beginScan')
      let that = this
      uni.scanCode({
        scanType: ['barCode'],
        success: function (res) {
          that.takeItem(res.result)
        }
      })
    },
    changeGet(){
      this.calc = this.calc == 'add' ? 'sub' : 'add'
    },
		reduceItemFn(item) {
			if(item && item.variety == 1 && this.selectJobType == 'bill'){
				this.$msg('多颜色花材，请返回修改')
				return false
			}
      this.kdType = 'HIT';
			this.replaceItemFn(item,0,'sub')
		},
		addItemFn (item) {
			if(item && item.variety == 1 && this.selectJobType == 'bill'){
				this.$msg('多颜色花材，请返回修改')
				return false
			}
      this.kdType = 'HIT';
			this.replaceItemFn(item,0,'add')
		},
    init () {

    },
    kdChange(e){
			let index = e.detail.value
      if(!this.$util.isEmpty(this.staffList)){
        if(this.staffList[index]){
          this.form.getStaffName = this.staffList[index].name
          this.form.getStaffId = this.staffList[index].id
        }
      }
    },
		payWayChange(e){
			let index = e.detail.value
			this.payWayindex = index
      this.form.payWay = this.payWayList[index].id
		},
		// 根据支付方式ID更新索引
		updatePayWayIndex(){
			const index = this.payWayList.findIndex(item => item.id === this.form.payWay)
			this.payWayindex = index >= 0 ? index : 0
		},
    setPayWay(payWay){
      this.form.payWay = payWay
      this.updatePayWayIndex()
    },
    diffPriceConfirm(){
      this.form.dealPrice = 1
      this.formSubmit()
    },
    confirmSubmit () {
      let self = this;
        let rules = [
          {
            name: "customId",
            rule: ["required"],
            msg: ["请选择客户"],
          },
        ];
        let hasError = formUtil.validation(this.form, rules);
        if (hasError) {
          this.$msg(hasError);
          return false;
        }
        let name = '确认提交'
        if(this.form.hasPay == 0){
          name = '确认扫码付？'
        }else if(this.form.hasPay == 1){
          name = '确认线下付款？'
          if(this.form.forward == 1){
            name = '确认开付款售后单？'
          }
        }else if(this.form.hasPay == 2){
          name = '确认赊账？'
        }else if(this.form.hasPay == 4){
          name = '确认余额支付？'
        }else{
          name = '确认提交'
        }
        self.$util.confirmModal({content:name},() => {
          self.formSubmit()
        })
    },
    async formSubmit () {
      let that = this
      let formData = this.form;
      const product = this.selectList.map((ele) => {
        let unitType = Number(ele.bigCount)>0 ? 0 : 1
        let num = Number(ele.bigCount)>0 ? Number(ele.bigCount) : Number(ele.smallCount)
        let unitPrice = ele.userPrice ? ele.userPrice : 0
        return {productId: ele.id, bigNum: ele.bigCount, smallNum: ele.smallCount, classId: ele.classId,
          itemId: ele.itemId, unitPrice:unitPrice,remark:ele.remark,property:ele.property,unitType:unitType,num:num}
      });
      formData.product = JSON.stringify(product);
      if (!this.getMerchantInfo) {
        await this.initMerchantInfo();
      }
      formData.shopId = this.getMerchantInfo.id;
      if(Number(this.modifyPrice) <= 0){
        this.$msg('收款金额必须大于0');
        return false
      }

      let params = {...formData,modifyPrice: this.modifyPrice,labourCost:this.labourCost};

      //多颜色
      let xj = uni.getStorageSync("xj"+this.option.customId)
      //orderType 开单类型，1商品开单 2花材开单
      params = {...params,xj:JSON.stringify(xj),orderType:2}

      uni.showLoading({mask:true})
      createOrder(params).then((res) => {
        uni.hideLoading()
        if(res.code == 1){
          if(res.data.respondType && res.data.respondType == 'priceError'){
            that.diffPriceList = res.data.diff
            that.$refs.diffPriceRef.open('bottom')
            return
          }

          this.removeFromSaveDirect()

          if(res.data && res.data.id){
            const {data: { id, orderSn,actPrice }} = res;
            if(this.form.hasPay == 0){
              this.$util.pageTo({ url: '/admin/billing/toPay',type:2,query: {orderId:id,orderSn:orderSn,actPrice:actPrice}})
            }else{
              if(this.form.forward == 1){
                this.$util.pageTo({ url: '/admin/billing/remind?orderId='+id,type:2})
              }else{
                this.$util.pageTo({ url: '/admin/billing/result?orderId='+id,type:2})
              }
            }
          }else{
            this.$msg('提交失败')
          }

        }
      })
    },
    returnCheck(){
      this.$refs.diffPriceRef.close()
    },
    gobackEvent () {
      let customId = this.option.customId ? this.option.customId : 0
      let customName = this.option.customName ? this.option.customName : ''
      this.$util.pageTo({url: '/admin/billing/index2?customId='+customId+'&customName='+customName,type:2})
    },
    pageToItemList() {
      this.$util.pageTo({url: '/admin/billing/index2?customId='+this.option.customId,type:2})
    }
  }
};
</script>

<style lang="scss" scoped>
.admin-button-com {
  margin-right: 30upx;
}

.special-title {
  color: #ff6b35 !important;
  font-weight: bold !important;
}

.payment-buttons {
  display: flex;
  flex-direction: column;
  gap: 20upx;
  width: 100%;
  
  .button-row {
    display: flex;
    justify-content: flex-start;
    gap: 30upx;
    
    .admin-button-com {
      flex: 0 0 140upx;
      margin-right: 0;
    }
  }
}
.affirm-page {
  position: relative;
  height: 100%;
  display: flex;
  flex-direction: column;

  .affirm-view {
    flex: 1;
    margin-bottom:90upx;
    padding: 20upx;
    background-color: #f0f2f6;

    .commodity-view {
      display: flex;
      flex-direction: column;
      .commodity-list {
        padding: 20upx;
        .commodity-item {
          display: flex;
          margin-bottom: 20upx;
          .item-icon {
            flex-shrink: 0;
            width: 140upx;
            height: 140upx;
          }
          .item-info {
            display: flex;
            flex-direction: column;
            justify-content: center;
            flex: 1;
            margin-left: 20upx;
            .info-line {
              margin-bottom: 20upx;
              display: flex;
              justify-content: space-between;
              align-items: flex-end;
              .item-name {
                color: #333333;
                font-size: 28upx;
                font-weight:bold;
                .show-color{
                  display:inline-block;
                  width:25upx;
                  height:25upx;
                  background-color:rgb(9, 199, 9);
                  border-radius:15upx;
                  border:none;
                  margin-left:16upx;
                }
              }
              .item-price {
                color: #333;
                font-size: 22upx;
                .price {
                  font-size: 32upx;
                  font-weight: bold;
                }
              }
              .item-type {
                color: #999;
                font-size: 24upx;
              }
              .item-count {
                color: #666;
                font-size: 24upx;
              }
            }

& .open-bx {
				align-items: center;
				& .iconfont {
					color: #3385ff;
					font-size: 50upx;
				}

				.position{
					display: block;
					width: 70upx;
					text-align: center;
				}
				.iconcachu {
					margin: 0 6upx 0 20upx;
					color: #ccc;
					&.edit {
						color: #3385ff;
					}
				}
				& > .num {
					display: inline-block;
					width: 120upx;
					height:45upx;
					text-align:center;
					margin: 0 8upx;
					color: #868686;
					border-radius: 22upx;
					background-color: #f5f5f5;
					padding: 3upx 0;
					font-size: 25upx;
				}
				.change-input {
					width: 164upx;
					height: 60upx;
					line-height: 60upx;
					text-align: center;
					background: #ffffff;
					border: 1upx solid #dddddd;
					border-radius: 4upx;
					font-size: 25upx;
				}
				.btn-box{
					width: 100upx;
					height: 60upx;
					line-height: 60upx;
					color: #ffffff;
					background: #3385ff;
					text-align: center;
					border-radius: 10upx;
				}
			}

          }
        }
      }
      .summary-bar {
        padding: 0 20upx;
        height: 90upx;
        display: flex;

        align-items: center;
        justify-content: space-between;
        border-top: 1upx solid #eeeeee;
        .operate-view {
          display: flex;
          align-items: center;
          color: #3385ff;
          font-size: 26upx;
          .iconfont {
            margin-right: 20upx;
            font-size: 40upx;
          }
        }
        .describe-view {
          display: flex;
          align-items: center;
          color: #333;
          font-size: 28upx;
          font-weight:bold;
          .price {
            margin-left:8upx;
            color:red;
          }
        }
      }
    }

    .module-com {
      background-color: #fff;
      margin-bottom: 20upx;
      border-radius: 10upx;
      overflow: hidden;
					.tab-box{
						padding: 10upx 30upx 30upx;
						.tab{
							width: 49%;
							height: 70upx;
							color: #a2a2a2;
							border: 1upx solid #dcdcdc;
							border-radius: 10upx;
							font-size: 28upx;
							font-weight: 700;
							&.active{
								color: #ff4d4d;
								border: 1upx solid #ff4d4d;
							}
						}
					}
      .member-wrap {
        .member-det {
          font-size: 24upx;
          margin-left: 20upx;
        }
      }
      .remark-wrap {
        align-items: flex-start;
        .remark {
          height: 240upx;
        }
      }
    }
  }
  .under-bar {
    z-index:99999;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 10upx;
    position: fixed;
    bottom:0;
    @media screen and (max-width: 1100px) {
      width: 100%;
    }
    height: 100upx;
    background-color: #fff;
    box-shadow: 0upx -1upx 6upx 0upx rgba(4, 0, 0, 0.06);
    .price-view {
      display: flex;
      align-items: center;
      font-size: 24upx;
      .price-title {
        color: #333;
      }
      .price-number {
        margin: 0 8upx;
        color: #ff2842;
        .large {
          font-size:34upx;
          font-weight:bold;
        }
      }
    }
    .admin-button-com {
      width: 200upx;
    }
  }
	.select-cmd_bx {
		& .kc {
			color: #999999;
			font-size: 28upx;
			font-weight: 400;
			margin-bottom: 40upx;
			text-align: center;
			margin-top: 30upx;
			.unit_price{
				padding-right:25upx;
			}
		}
		& .num_bx {
			display: flex;
			align-items: center;
			margin-bottom: 40upx;
			& > input {
				width: 212upx;
				height: 80upx;
				border: 1upx solid #dddddd;
				border-radius: 4upx;
				text-align: center;
				margin-right: 24upx;
				font-size: 40upx;
			}
		}
	}
}
.class-popup-style{
	z-index:99999;
}
.remark-class{
  z-index:0
}
.warning-price{
	color:red;
}
.normal-price{
  color:#c1acac;
}
</style>