<style scoped lang="scss">

</style>
<template>
  <div class="system-dialog-container">
    <el-dialog
        :title="state.dialog.title"
        v-model="state.dialog.isShowDialog"
        width="820px"
        draggable
        destroy-on-close
        :close-on-click-modal="false"
        align-center>
      <el-form
          inline
          :model="state.ruleForm"
          :rules="rules"
          label-position="top"
          ref="formRef"
          size="default"
          label-width="100px"
          class="mt5">
        <el-form-item label="消费总额，等于各单项费用之和(元)" prop="amount">
          <el-input
              v-model="state.ruleForm.amount"
              placeholder="消费总额，等于各单项费用之和(元)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="应收金额，如果大于预付金额，则限制为预付金额并关机，否则等于消费总金额（元）" prop="amountReceivable">
          <el-input
              v-model="state.ruleForm.amountReceivable"
              placeholder="应收金额，如果大于预付金额，则限制为预付金额并关机，否则等于消费总金额（元）"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="实收金额等于应收金额乘会员折扣(元)" prop="amountReceived">
          <el-input
              v-model="state.ruleForm.amountReceived"
              placeholder="实收金额等于应收金额乘会员折扣(元)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="卡内余额(仅限刷储值卡的订单有效，普通卡为总是为0)" prop="cardBalance">
          <el-input
              v-model="state.ruleForm.cardBalance"
              placeholder="卡内余额(仅限刷储值卡的订单有效，普通卡为总是为0)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="卡过期时间，从1970年开始的时间戳(仅限刷储值卡的订单有效，普通卡为总是为0)" prop="cardExpired">
          <el-input
              v-model="state.ruleForm.cardExpired"
              placeholder="卡过期时间，从1970年开始的时间戳(仅限刷储值卡的订单有效，普通卡为总是为0)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="卡内码，卡出厂的时候厂家写入的ID(仅限刷卡订单)" prop="cardId">
          <el-input
              v-model="state.ruleForm.cardId"
              placeholder="卡内码，卡出厂的时候厂家写入的ID(仅限刷卡订单)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="卡串号，印刷在卡的表面，通过电脑上的卡管理工具写入卡内。(仅限刷卡订单)" prop="cardSn">
          <el-input
              v-model="state.ruleForm.cardSn"
              placeholder="卡串号，印刷在卡的表面，通过电脑上的卡管理工具写入卡内。(仅限刷卡订单)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="卡类型(仅限刷卡订单,1表示普通卡，2表示储值卡)" prop="cardType">
          <el-input
              v-model="state.ruleForm.cardType"
              placeholder="卡类型(仅限刷卡订单,1表示普通卡，2表示储值卡)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="关机方式：button维护按钮，network网络命令，no_balance超过预设金额，idle_timeout设备空闲超时，operation_timeout操作超时，card刷卡。注意:为空表示还没有关机，正在使用" prop="closeType">
          <el-input
              v-model="state.ruleForm.closeType"
              placeholder="关机方式：button维护按钮，network网络命令，no_balance超过预设金额，idle_timeout设备空闲超时，operation_timeout操作超时，card刷卡。注意:为空表示还没有关机，正在使用"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="投币的累计金额(仅限刷卡订单,元)" prop="coinMoney">
          <el-input
              v-model="state.ruleForm.coinMoney"
              placeholder="投币的累计金额(仅限刷卡订单,元)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="投币的次数仅限刷卡订单" prop="coinNum">
          <el-input
              v-model="state.ruleForm.coinNum"
              placeholder="投币的次数仅限刷卡订单"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="" prop="companyId">
          <el-input
              v-model="state.ruleForm.companyId"
              placeholder=""
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="费用明细：name 名称 price 单价(元) seconds 时长(单位秒) amount 费用(元) space⻋位或场地，water清水，foam泡沫，cleaner吸尘，tap水龙头，user_ext用户扩展，消毒或吹干等功能，coat镀膜，blow吹气" prop="detail">
          <el-input
              v-model="state.ruleForm.detail"
              placeholder="费用明细：name 名称 price 单价(元) seconds 时长(单位秒) amount 费用(元) space⻋位或场地，water清水，foam泡沫，cleaner吸尘，tap水龙头，user_ext用户扩展，消毒或吹干等功能，coat镀膜，blow吹气"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="设备名称" prop="deviceName">
          <el-input
              v-model="state.ruleForm.deviceName"
              placeholder="设备名称"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="优惠金额（元）" prop="discountAmount">
          <el-input
              v-model="state.ruleForm.discountAmount"
              placeholder="优惠金额（元）"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="优惠金额等于消费总额减去实收金额(元)" prop="discountMoney">
          <el-input
              v-model="state.ruleForm.discountMoney"
              placeholder="优惠金额等于消费总额减去实收金额(元)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="Coupon-优惠券" prop="discountType">
          <el-input
              v-model="state.ruleForm.discountType"
              placeholder="Coupon-优惠券"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="结束时间" prop="endTime">
          <el-input
              v-model="state.ruleForm.endTime"
              placeholder="结束时间"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="设备空闲关机倒计时剩余时间(单位秒)，开机后从idle_timeout开始每秒减1，见到0关机，关机原因close_type=idle_time(递减过程中按任意功能键，重新开始从idle_timeout递减)" prop="idleRemainTime">
          <el-input
              v-model="state.ruleForm.idleRemainTime"
              placeholder="设备空闲关机倒计时剩余时间(单位秒)，开机后从idle_timeout开始每秒减1，见到0关机，关机原因close_type=idle_time(递减过程中按任意功能键，重新开始从idle_timeout递减)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="发票id" prop="invoiceId">
          <el-input
              v-model="state.ruleForm.invoiceId"
              placeholder="发票id"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="发票状态：0-待开票 1-已开票 2-已作废（用不上） 3-开票中" prop="invoiceStatus">
          <el-input
              v-model="state.ruleForm.invoiceStatus"
              placeholder="发票状态：0-待开票 1-已开票 2-已作废（用不上） 3-开票中"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="会员折扣比例(0-100,100表示不享受折扣，95表示9.5折优惠)" prop="memberDiscount">
          <el-input
              v-model="state.ruleForm.memberDiscount"
              placeholder="会员折扣比例(0-100,100表示不享受折扣，95表示9.5折优惠)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="开机方式：button维护按钮，network网络命令，coin投币，card刷卡" prop="openType">
          <el-input
              v-model="state.ruleForm.openType"
              placeholder="开机方式：button维护按钮，network网络命令，coin投币，card刷卡"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="订单操作剩余操作时间(单位秒)，开机后从operation_timeout开始每秒减1，减到0关机，关机原因close_type=operation_timeout" prop="operationRemainTime">
          <el-input
              v-model="state.ruleForm.operationRemainTime"
              placeholder="订单操作剩余操作时间(单位秒)，开机后从operation_timeout开始每秒减1，减到0关机，关机原因close_type=operation_timeout"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="订单号，和开机命令的order_id相同，如果使用按钮快速开机，order_id是空字符串" prop="orderId">
          <el-input
              v-model="state.ruleForm.orderId"
              placeholder="订单号，和开机命令的order_id相同，如果使用按钮快速开机，order_id是空字符串"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="本机订单号" prop="orderIdLocal">
          <el-input
              v-model="state.ruleForm.orderIdLocal"
              placeholder="本机订单号"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="订单状态：-1：未知，0-开机，1：成功，2：失败，3：取消" prop="orderStatus">
          <el-input
              v-model="state.ruleForm.orderStatus"
              placeholder="订单状态：-1：未知，0-开机，1：成功，2：失败，3：取消"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="支付状态：0：未支付，1：已支付" prop="payStatus">
          <el-input
              v-model="state.ruleForm.payStatus"
              placeholder="支付状态：0：未支付，1：已支付"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="本次开机的预付金额(元，本次开机最大消费金额限制)" prop="prepayMoney">
          <el-input
              v-model="state.ruleForm.prepayMoney"
              placeholder="本次开机的预付金额(元，本次开机最大消费金额限制)"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="产品key" prop="productKey">
          <el-input
              v-model="state.ruleForm.productKey"
              placeholder="产品key"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="开始时间" prop="startTime">
          <el-input
              v-model="state.ruleForm.startTime"
              placeholder="开始时间"
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="" prop="stationId">
          <el-input
              v-model="state.ruleForm.stationId"
              placeholder=""
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="" prop="stopReason">
          <el-input
              v-model="state.ruleForm.stopReason"
              placeholder=""
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
        <el-form-item label="" prop="userId">
          <el-input
              v-model="state.ruleForm.userId"
              placeholder=""
              clearable
              class="wd350">
          </el-input>
        </el-form-item>
      </el-form>

      <template #footer>
				<span class="dialog-footer">
					<el-button @click="onCancel" size="default">取 消</el-button>
					<el-button :loading="state.btnLoading" type="primary" @click="onSubmit" size="default">{{ state.dialog.submitTxt }}</el-button>
				</span>
      </template>
    </el-dialog>
  </div>
</template>

<script setup lang="ts" name="WashOrderDialog">
import {defineAsyncComponent, reactive, onMounted, ref} from 'vue';
import {Msg} from "/@/utils/message";
import {$body, $get} from "/@/utils/request";
import u from '/@/utils/u'

// 引入组件

// 定义子组件向父组件传值/事件
const emit = defineEmits(['refresh']);
const formRef = ref();
//定义初始变量，重置使用
const initState = () => ({
  ruleForm: {
    id: null
  },
  btnLoading: false,
  dialog: {
    isShowDialog: false,
    type: '',
    title: '',
    submitTxt: '',
  },
  rules: {},
})

// 定义变量内容
const state = reactive(initState());


// 打开弹窗
const open = (action: string = 'add', row: any) => {
  state.dialog.title = u.dialog.actions[action].title + "『洗车订单表』"
  state.dialog.submitTxt = u.dialog.actions[action].btn + "『洗车订单表』"
  state.dialog.isShowDialog = true;
  if (action !== 'add') {
    loadData(row.id);
  } else {
    state.ruleForm = Object.assign(state.ruleForm, row);
  }
};
// 关闭弹窗
const onClose = () => {
  state.dialog.isShowDialog = false;
  Object.assign(state, initState())
};
// 取消
const onCancel = () => {
  onClose();
};
// 提交
const onSubmit = () => {
  formRef.value.validate((v: boolean) => {
    if (v) {
      state.btnLoading = true;
      const ruleForm = { ...state.ruleForm };
      moneyFields.forEach(f => {
        if (ruleForm[f] != null && ruleForm[f] !== '') ruleForm[f] = Math.round(Number(ruleForm[f]) * 100);
      });
      const url = !!state.ruleForm.id ? "washOrder/modify" : "washOrder/add"
      $body(url, ruleForm).then(() => {
        state.btnLoading = false;
        Msg.message('操作成功');
        //console.log('submit!')
        onClose();
        emit('refresh');
      })
    } else {
      state.btnLoading = false;
      Msg.message('请先完整填写表单', 'error');
    }
  })
};

const handleFormChange = (formData: any) => {
  //console.log(formData)
}

const moneyFields = ['amount', 'amountReceivable', 'amountReceived', 'cardBalance', 'coinMoney', 'discountAmount', 'discountMoney', 'prepayMoney'];

// 初始化数据
const loadData = (id: number) => {
  $get(`washOrder/detail/${id}`).then((res: any) => {
    moneyFields.forEach(f => {
      if (res[f] != null) res[f] = (res[f] / 100).toFixed(2);
    });
    state.ruleForm = res;
  })
}

// 暴露变量
defineExpose({
  open
});


</script>
