<template>
    <a-drawer
        v-model:visible="vdata.isShow"
        :title=" vdata.isAdd ? '新增交易路由策略' : '修改交易路由策略' "
        :confirmLoading="vdata.confirmLoading"
        @ok="handleOkFunc"
        @close="onClose"
        width="100%"
    >
    <a-form ref="infoFormModel" layout="vertical" :model="vdata.saveObject" :rules="vdata.rules">

      <a-row justify="space-between" type="flex">
        <a-col :sm="11">
          <a-form-item label="选择应用" name="appid">
            <a-select v-model:value="vdata.saveObject.appid" placeholder="请选择应用" show-search @change="getSaveObjectAppid" @search="handleAppidChange" :filter-option="false">
              <a-select-option v-for="d in vdata.filteredAppidInfoList" :key="d.storeId" v-model:value="d.appId">
                {{ d.appName }} - {{ d.appId }}
              </a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
        <a-col :sm="11">
          <a-form-item label="策略名称：" name="name">
            <a-input v-model:value="vdata.saveObject.name" placeholder="请输入交易路由策略名称" />
          </a-form-item>
        </a-col>
        <a-col :sm="11">
          <a-form-item label="策略规则：" name="ruleStrategy">
            <div style="display: grid">
                  <a-select v-model:value="vdata.saveObject.ruleStrategy" placeholder="策略规则" :disabled="!vdata.isAdd">
                    <a-select-option value="TRADE_NUM">按收款笔数</a-select-option>
                    <a-select-option value="TRADE_AMOUNT">按累计收款金额</a-select-option>
                    <a-select-option value="TRADE_TIME">按收款时间</a-select-option>
                    <a-select-option value="TRADE_AMOUNT_INTERVAL">按交易金额区间</a-select-option>
<!--                    <a-select-option value="5">按交易类型</a-select-option>-->
                  </a-select>
              <span  class="jeepay-tip-text" v-if="vdata.saveObject.ruleStrategy == 'TRADE_NUM'">设置允许用户在一定时间内（如每日、每周、每月）的最大收款笔数。</span>
              <span  class="jeepay-tip-text" v-if="vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT'">设置用户在一定时间内的累计收款金额上限。</span>
              <span  class="jeepay-tip-text" v-if="vdata.saveObject.ruleStrategy == 'TRADE_TIME'">设置允许用户收款的有效时间段。</span>
              <span  class="jeepay-tip-text" v-if="vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT_INTERVAL'">设置不同交易金额区间对应的路由策略。</span>
<!--              <span  class="jeepay-tip-text" v-if="vdata.saveObject.rule == 5">选择适用的交易类型（如微信、支付宝等）。</span>-->
            </div>
          </a-form-item>
        </a-col>

        <a-col :sm="11">
          <a-form-item label="交易顺序策略：" name="sortStrategy">
            <a-select v-model:value="vdata.saveObject.sortStrategy" placeholder="交易顺序策略">
              <a-select-option value="ORDER">商户排列顺序</a-select-option>
              <a-select-option value="RANDOM">随机排序</a-select-option>
            </a-select>
          </a-form-item>
        </a-col>
      </a-row>
    </a-form>
        <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">高级策略规则</a-divider>

      <a-form ref="infoFormModel"  :model="vdata.saveObject" :rules="vdata.rules">
          <a-row>
            <a-col :sm="24">
              <a-form-item label="新用户策略开关：" name="isNewUser" >
                     <div style="display: flex">
                       <JeepayTableColState :state="vdata.saveObject.seniorStrategy.isNewUser" :showSwitchType="true"  :onChange="getUserChange" />
                       <div  class="jeepay-tip-text" style="margin: 0 5px 0 5px !important;">开启后可设置新用户前X笔付款不路由，以及同一用户累计支付未满X元不路由的阈值</div>
                     </div>
              </a-form-item>
<!--              <div v-if="vdata.saveObject.user == 1">-->
<!--                <a-checkbox-group v-model:value="vdata.saveObject.userType" >-->
<!--                  <div style="display: inline-grid;">-->
<!--                    <a-checkbox   :value="0"  style="margin-bottom: 10px;margin-left: 10px;">-->
<!--                      <div style="display: flex">-->
<!--                        <div class="user-ploy-span span-color">同一用户前</div>-->
<!--                        <a-input-number addon-after="笔" :min="0" :precision="0"  v-model:value="vdata.saveObject.price" />-->
<!--                        <div class="user-ploy-span span-color">付款前不分流</div>-->
<!--                      </div>-->
<!--                    </a-checkbox>-->
<!--                    <a-checkbox   :value="1" style="margin-bottom: 10px">-->
<!--                      <div style="display: flex">-->
<!--                        <div class="user-ploy-span span-color">同一用户累计消费未满</div>-->
<!--                        <a-input-number addon-after="元" :min="0" :precision="2"  v-model:value="vdata.saveObject.price" />-->
<!--                        <div class="user-ploy-span span-color">付款前不分流</div>-->
<!--                      </div>-->
<!--                    </a-checkbox>-->
<!--                  </div>-->
<!--                </a-checkbox-group>-->
<!--              </div>-->
            </a-col>

            <a-col :sm="24">
              <a-form-item label="分笔支付策略开关" name="isSplit" >
                <div style="display: flex">
                  <JeepayTableColState :state="vdata.saveObject.seniorStrategy.isSplit" :showSwitchType="true"  :onChange="getUserChangeNumState" />
                  <div  class="jeepay-tip-text" style="margin: 0 5px 0 5px !important;">选择用户上一笔支付失败时或支付页提示拦截后的分笔支付模式</div>
                </div>
              </a-form-item>
            </a-col>
            <a-col :sm="12">
              <a-form-item label="分笔支付策略：" class="span-color" name="splitStrategy" placeholder="分笔支付策略" v-if="vdata.saveObject.seniorStrategy.isSplit == 1">
                <div style="display: grid">
                  <a-select class="span-color" v-model:value="vdata.saveObject.seniorStrategy.splitStrategy" placeholder="分笔支付策略">
                    <a-select-option value="0">多支付通道多商户分笔</a-select-option>
                    <a-select-option value="1">单支付通道多商户分笔</a-select-option>
                    <a-select-option value="2">单支付通道单商户分笔</a-select-option>
                  </a-select>
                </div>
              </a-form-item>
            </a-col>
            <a-col :sm="24">
              <a-form-item label="通道展示策略" name="isChannel" >
                <div style="display: flex">
                  <JeepayTableColState :state="vdata.saveObject.seniorStrategy.isChannel"  :onChange="getIsChannel" :showSwitchType="true"   />
                  <div  class="jeepay-tip-text" style="margin: 0 5px 0 5px !important;">开启后允许商户在支付时自主选择支付通道，若选择的通道内无商户，则提示报错。</div>
                </div>
              </a-form-item>
            </a-col>
          </a-row>
      </a-form>



      <a-divider class="jeepay-m-divider" orientation="left" style="color: #1A66FF;">策略门店规则设置</a-divider>

      <a-form
          ref="infoFormModel"
          :model="vdata.receiveList"
          :label-col="{ span: 6 }"
          :wrapper-col="{ span: 15 }">
        <a-table bordered :data-source="vdata.receiveList" :columns="tableColumns"
                 :pagination="false" style="margin-left: -1px;">
          <template #headerCell="{ column }">
              <span v-if="column.tooltipTitle">
                {{ column.title }}
                <a-tooltip :title="column.tooltipTitle"><info-circle-outlined /></a-tooltip>
              </span>
          </template>
          <template #storeId="{ record }">
            <a-select class="tb_width_80"  v-model:value="record.storeId"    placeholder="请选择商户" show-search @change="handleStoreChange" @search="handleDivisionNameChange" :filter-option="false">
              <a-select-option v-for="d in vdata.filteredMchNameInfoList" :key="d.storeId" v-model:value="d.storeId">
                {{ d.storeName }} - {{ d.storeId }}- {{ d.ifName }}
              </a-select-option>
            </a-select>
          </template>
          <template #value="{ record }" >
            <a-input-number class="tb_width_80" addon-after="笔" :min="1" :precision="0" v-model:value="record.value" v-if="vdata.saveObject.ruleStrategy == 'TRADE_NUM'" placeholder="请输入交易笔数"/>
            <a-input-number class="tb_width_80"  addon-after="元" :min="1" :precision="2" v-model:value="record.value" v-if="vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT'" placeholder="请按照门店收款情况预估，输入收款金额"/>
            <!--              <a-input-number addon-after="笔" :min="1" v-model:value="record.content" v-if="vdata.saveObject.rule == 1" placeholder="请输入交易笔数"/>-->
            <div v-if="vdata.saveObject.ruleStrategy == 'TRADE_TIME'" class="con-flex-div" >
              <a-time-picker class="con-flex-span"  v-model:value="record.value" format="HH:mm" />
              <span class="rule-span">至</span>
              <a-time-picker class="con-flex-span"  v-model:value="record.value1" format="HH:mm" />
            </div>
            <div v-if="vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT_INTERVAL'" class="con-flex-div" >
              <a-input-number class="con-flex-span"  addon-after="元" :min="1" :precision="2"  v-model:value="record.value" placeholder="请输入最小金额"/>
              <span class="rule-span">至</span>
              <a-input-number class="con-flex-span"  addon-after="元" :min="1" :precision="2"  v-model:value="record.value1"  placeholder="请输入最大金额"/>
            </div>
            <!--              <div v-if="vdata.saveObject.rule == 5" >-->
            <!--                <a-select class="con-flex-span tb_width_80"   v-model:value="record.content"  mode="multiple" style="width: 100%"  placeholder="请选择配置"  :options="vdata.payWay"  />-->
            <!--              </div>-->
            <!--              <a-input-number addon-after="笔" :min="1" v-model:value="record.content" v-if="vdata.saveObject.rule == 1" placeholder="请输入交易笔数"/>-->
          </template>

          <template #scope="{  record }">
            <div v-if="vdata.saveObject.ruleStrategy == 'TRADE_TIME'">

            </div>
            <div v-else>
              <a-select class="con-flex-span tb_width_80"   v-model:value="record.scope"  style="width: 100%"  placeholder="请选择时限"    >
                <a-select-option :value="-1">不限</a-select-option>
                <a-select-option :value="1">日</a-select-option>
                <a-select-option :value="2">周</a-select-option>
                <a-select-option :value="3">月</a-select-option>
              </a-select>
            </div>

          </template>

          <template #typeStrategy="{  record }">
            <a-select class="con-flex-span tb_width_80"   v-model:value="record.typeStrategy"  mode="multiple" style="width: 100%"  placeholder="请选择支付类型"  :options="vdata.payWay"  />
          </template>

          <template #rate="{  record }">
            <a-input-number class="tb_width_80" addon-after="%" :min="1" :max="100" :precision="0" v-model:value="record.rate"  placeholder="请输入付款率"/>
          </template>
          <template #state="{  record }">
            <div style="display: flex">
              <JeepayTableColState :state="record.state" :showSwitchType="true"   :onChange="(state) => { return getState(record, state)}"   />


              <a-tooltip>
                <template #title>
                   {{record.remark}}
                </template>
                <question-circle-outlined v-if="record.remark" style="padding-left: 10px;color: #ff4c5b"/>
              </a-tooltip>
            </div>
          </template>


          <template #operation="{ record }">
            <a @click="onAdd(0)" class="operation-a" >添加</a>
            <a-popconfirm  title="确认删除吗?" @confirm="onDelete(record.key)">
              <a  class="operation-a"  style="color: #ff4c5b"  v-if="record.key != 1">删除</a>
            </a-popconfirm>
            <a @click="onMove(record,1)"  v-if="record.key != 1" class="operation-a"  >上移</a>
            <a @click="onMove(record,0)"  v-if="record.key != vdata.receiveList[vdata.receiveList.length-1].key && record.key != 1" class="operation-a"  >下移</a>
          </template>
        </a-table>
      </a-form>



      <div class="drawer-btn-center">
        <a-button :style="{ marginRight: '8px' }" @click="vdata.isShow = false"><close-outlined /> 取消</a-button>
        <a-button type="primary" :loading="vdata.confirmLoading" @click="handleOkFunc"><check-outlined /> 保存</a-button>
      </div>
    <!-- 选择码牌组件 -->
<!--    <JeepayModelQrcList ref="jeepayModelQrcListRef" @selectFinishFunc="selectQrcFinishFunc" />-->
      <JeepayModelAccountsQrcList ref="jeepayModelQrcListRef" @selectFinishFunc="selectQrcFinishFunc" />
  </a-drawer>
</template>

<script lang="ts" setup>
import {
  $getMchRouteDetail,
  API_MCH_PAY_DEFINES,
  API_URL_DIVISION_RECEIVER_GROUP,
  API_URL_DIVISION_TEMPLATE_ADD,
  API_URL_DIVISION_TEMPLATE_EDIT,
  API_URL_ENT_MCH_ROUTE_ADD,
  API_URL_ENT_MCH_ROUTE_EDIT,
  API_URL_MCH_APPS,
  API_URL_MCH_STORE_LIST,
  req
} from '@/api/manage'
const { $infoBox, $access } = getCurrentInstance()!.appContext.config.globalProperties
import { message } from 'ant-design-vue'
import {getCurrentInstance, reactive, ref} from 'vue'
import ReceiverGroupAdd from './ReceiverGroupAdd.vue'
import moment from "moment/moment";

const jeepayModelQrcListRef = ref()
 const  props = defineProps({
    callbackFunc: { type: Function,default:null }
  })

    const infoFormModel = ref()
    const vdata = reactive ({
      filteredMchNameInfoList:[] as any,
      filteredMchNoInfoList:[] as any,
      storeList:[] as any,
      detailData:[] as any,
      receiveList:[{ key: 1, storeId: '',rate:1,scope:1,state:0,value: '' as any, typeStrategy: [] as any, value1:'',operation: ''}],
      modeList:[
        {name:"按比例分账",value:0},
        {name:"按金额分账",value:1},
      ],
      typeList:[
        {name:"实时分账",value:0},
        {name:"延时分账",value:1},
        {name:"秒到分账",value:2},
      ],
      payDefines: [] as any,
      confirmLoading: false, // 显示确定按钮loading图标
      isAdd: true, // 新增 or 修改页面标识
      isShow: false, // 是否显示弹层/抽屉
      saveObject: {  } as any, // 数据对象
      recordId: null, // 更新对象ID
      rules: {
        appid: [{ required: true, message: '请输入选择应用', trigger: 'blur' }],
        name: [{ required: true, message: '请输入策略名称', trigger: 'blur' }],
        ruleStrategy: [{ required: true, message: '请选择策略规则', trigger: 'blur' }],
        sortStrategy: [{ required: true, message: '请选择交易顺序策略', trigger: 'blur' }],
        divisionType: [{ required: true, message: '请输入分账类型', trigger: 'blur' }],
        divisionAmount: [{ required: true, message: '请输入分账金额', trigger: 'blur' }],
        minAmount: [{ required: true, message: '请输入最小支付金额', trigger: 'blur' }],
        isSpecify: [{ required: true, message: '请指定指定设备', trigger: 'blur' }],
        deviceInfo: [{ required: true, message: '请选择设备信息', trigger: 'blur' }]
      },
      filteredAppidInfoList:[] as any,
      appidList:[] as any,
      payWay:[
        {
          value: 'WECHAT',
          label: '微信',
        },
        {
          value: 'ALIPAY',
          label: '支付宝',
        }
      ]
    })
function onClose(){
  vdata.isShow = false
}
 defineExpose({show})
  function  show (record) { // 弹层打开事件
      vdata.isAdd = !record
      vdata.saveObject = {}
      vdata.receiveList = [{ key: 1, storeId: '',rate:1,scope:1 as any,state:0,value: '' as any, typeStrategy: [] as any, value1:'',operation: ''}]
      vdata.saveObject.seniorStrategy = {isNewUser:false,isSplit:false,isChannel:false} as any // 数据清空
      vdata.confirmLoading = false // 关闭loading

      if (infoFormModel.value !== undefined) {
        infoFormModel.value.resetFields()
      }
      req.list(API_URL_MCH_APPS, { 'pageSize': -1,state:1 }).then(res => {
        vdata.appidList =  res.records
        vdata.filteredAppidInfoList = res.records
      })

      // payFefines()
      if (!vdata.isAdd) { // 修改信息 延迟展示弹层
        vdata.recordId = record.routeId
        $getMchRouteDetail(record.routeId).then(res => {
          vdata.saveObject = res

          storeList()
          vdata.saveObject.seniorStrategy.isNewUser = vdata.saveObject.seniorStrategy.isNewUser?1:0
          vdata.saveObject.seniorStrategy.isSplit = vdata.saveObject.seniorStrategy.isSplit?1:0
          vdata.saveObject.seniorStrategy.isChannel = vdata.saveObject.seniorStrategy.isChannel?1:0
          vdata.isShow = true
          if(res.configList.length == 0){
             vdata.receiveList = [{ key: 1, storeId: '',rate:1,scope:1,state:0,value: '' as any, typeStrategy: [] as any, value1:'',operation: ''}]
            return false;
          }
          const receiveList = []  as  any;
          for (let i = 0;i<res.configList.length;i++) {
            // moment('12:08', 'HH:mm')
            if (vdata.saveObject.ruleStrategy == 'TRADE_TIME') {
              receiveList.push({
                key: i + 1,
                storeId: res.configList[i].storeId,
                value: moment(res.configList[i].value[0], 'HH:mm'),
                value1: moment(res.configList[i].value[1], 'HH:mm'),
                typeStrategy: res.configList[i].typeStrategy,
                state: res.configList[i].state,
                rate: res.configList[i].rate,
                scope: -1,
                operation: ''
              })
            } else {
              receiveList.push({
                key: i + 1,
                storeId: res.configList[i].storeId,
                value: res.configList[i].value[0],
                value1: res.configList[i].value[1],
                state: res.configList[i].state,
                rate: res.configList[i].rate,
                scope: res.configList[i].scope,
                typeStrategy: res.configList[i].typeStrategy,
                operation: ''
              })
            }
          }
          vdata.receiveList = receiveList;
        })
      } else {
        vdata.isShow = true // 立马展示弹层信息
      }
    }
    function getType(e){
        console.log(vdata.saveObject.type,'vdata.saveObject.type')
    }
function  payFefines() {
  req.list(API_MCH_PAY_DEFINES,{ 'pageSize': -1 }).then(res => {
    vdata.payDefines = res
  })
}

function getIfCode(){
  console.log(vdata.saveObject.ifCode,'saveObjectsaveObjectsaveObject')
}
  function  handleOkFunc() { // 点击【确认】按钮事件

    const configList = vdata.receiveList
    console.log(configList,'configListconfigListconfigList')
    const list = [] as any;
    for (var i=0;i<configList.length;i++){
      if(!configList[i].storeId){
        message.error("请选择门店")
        return false;
      }
      if(!configList[i].value){
        message.error("请输入配置")
        return false;
      }
      if(configList[i].typeStrategy.length == 0){
        message.error("请选择支付配置")
        return false;
      }

      let value = [configList[i].value] as any;

      if(!configList[i].value1){
        if(vdata.saveObject.ruleStrategy == 'TRADE_TIME' || vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT_INTERVAL'){
          message.error("请输入配置")
          return false;
        }
      }else{
        value.push(configList[i].value1)
      }
      if(vdata.saveObject.ruleStrategy == 'TRADE_TIME' || vdata.saveObject.ruleStrategy == 'TRADE_AMOUNT_INTERVAL'){
        // const value = [] as any;
        const value1 =  dateFormat(configList[i].value);
        const value2 = dateFormat(configList[i].value1);
        value = [value1,value2] as any;
      }
      list.push({
        storeId: configList[i].storeId,
        value: value,
        scope: configList[i].scope as any,
        typeStrategy: configList[i].typeStrategy,
        rate: configList[i].rate,
        state: configList[i].state,
        sortNum: i,
      })
    }
    console.log(list,'listlistlist')
    const data = vdata.saveObject
    data.configList = list

     infoFormModel.value.validate().then(valid=>{
        vdata.confirmLoading = true // 显示loading

       // vdata.saveObject.isNewUser = vdata.saveObject.seniorStrategy.isNewUser==1?true:false
       // vdata.saveObject.isSplit = vdata.saveObject.seniorStrategy.isSplit==1?true:false
          if (vdata.isAdd) {
            req.add(API_URL_ENT_MCH_ROUTE_ADD, data).then(res => {
              message.success('添加成功')
              vdata.isShow = false
              props.callbackFunc() // 刷新列表
            }).catch(res => { vdata.confirmLoading = false })
          } else {
            req.updateById(API_URL_ENT_MCH_ROUTE_EDIT, vdata.recordId, data).then(res => {
              message.success('修改成功')
              vdata.isShow = false
              props.callbackFunc() // 刷新列表
            }).catch(res => { vdata.confirmLoading = false })
          }
     })
    }
function  selectQrcFinishFunc (e) { // 码牌选择完成事件

  if (!e || e.length <= 0) {
    return $infoBox.message.error('请开启要绑定的码牌！')
  }

  vdata.saveObject.deviceInfo = e
  jeepayModelQrcListRef.value.close()
}

function showQrcSelectModel() {
  if(!vdata.saveObject.ifCode){
    return $infoBox.message.error('请选择支付通道！')
  }
  jeepayModelQrcListRef.value.show(vdata.saveObject.storeId, vdata.saveObject.deviceInfo, vdata.saveObject.ifCode)
}

function getUserChange(e){
  vdata.saveObject.seniorStrategy.isNewUser = e
}
function getUserChangeNumState(e){

  vdata.saveObject.seniorStrategy.isSplit = e
}

function getIsChannel(e){
  vdata.saveObject.seniorStrategy.isChannel = e
}

//门店搜索
const handleAppidChange = (value) => {
  vdata.filteredAppidInfoList = [];
  vdata.appidList.forEach((item: { appName: string | any[], appId:  any[] },index) => {
    if (item.appName.includes(value) || item.appId.toString().includes(value) ) {
      vdata.filteredAppidInfoList.push(vdata.appidList[index]);
    }
  });
};
function getSaveObjectAppid(e){
  storeList()
}

//接收方
const tableColumns = reactive([
  // { key: 'key', title: '序号', dataIndex: 'key', align: 'center',width:'5%'},
  { key: 'storeId',title: '门店名称', dataIndex: 'storeId', align: 'center',slots: { customRender: 'storeId' },width:'25%' },
  { key: 'value',title: '配置', dataIndex: 'value', align: 'center',slots: { customRender: 'value' } ,width:'15%'},
  { key: 'scope',title: '时效', dataIndex: 'scope', align: 'center',slots: { customRender: 'scope' } ,width:'10%'},
  { key: 'typeStrategy',title: '支付类型', dataIndex: 'typeStrategy', align: 'center',slots: { customRender: 'typeStrategy' } ,width:'15%'},
  { key: 'rate',title: '付款率', dataIndex: 'rate', tooltipTitle: '付款率低于设置的，自动下架', align: 'center',slots: { customRender: 'rate' } ,width:'10%'},
  { key: 'state',title: '状态', dataIndex: 'state', align: 'center',slots: { customRender: 'state' } ,width:'10%'},
  { key: 'operation',title: '操作', dataIndex: 'operation', align: 'center',slots: { customRender: 'operation' },width:'10%' },
])

const onAdd = (type = 0) => {
  if (!vdata.receiveList) {
    vdata.receiveList = [] as any
  }
  if(vdata.receiveList.length >=9){
    return $infoBox.message.error('分账接收方最多设置 9 个！')
  }
  vdata.receiveList.push({
    key: vdata.receiveList[vdata.receiveList.length - 1].key + 1,
    storeId: '',
    value: '',
    value1:'',
    scope:1,
    rate:1,
    state:0,
    typeStrategy: [] as any,
  })
  console.log(vdata.receiveList,'vdata.receiveList')

}
function storeList(){
  vdata.storeList =  []
  vdata.filteredMchNameInfoList = []
  vdata.filteredMchNoInfoList = []
  if(!vdata.saveObject.appid){
    return $infoBox.message.error("请先选择应用")
  }

  vdata.receiveList = [{ key: 1, storeId: '',rate:1,scope:1,state:0,value: '' as any, typeStrategy: [] as any, value1:'',operation: ''}]
  req.list(API_URL_MCH_STORE_LIST, { 'pageSize': -1,bindAppIdName:vdata.saveObject.appid }).then(res => {
    vdata.storeList =  res.records
    vdata.filteredMchNameInfoList = res.records
    vdata.filteredMchNoInfoList = res.records
  })
}
function onMove(record,type){
  console.log(record.key,record.userType,'key')
  const key = record.key
  let receiveList = vdata.receiveList
  vdata.receiveList = [];
  let list = [];
  for (let i=0;i<receiveList.length;i++){
    if(receiveList[i].key == key){
      if(parseInt(type) === 1){
        receiveList[i].key = parseInt(receiveList[i-1].key) - 1
      }else{
        receiveList[i].key = parseInt(receiveList[i+1].key) + 1
      }
    }
  }
  receiveList.sort((a, b) => {
    return a.key - b.key;
  });
  receiveList.forEach((item,index) => {
    item.key = index+1
    vdata.receiveList.push(item)
  });
}

function dateFormat(time) {
  let date = new Date(time);
  let year = date.getFullYear();
  let wk = date.getDay()
  /* 在日期格式中，月份是从0开始的，因此要加0
  * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05
  * */
  let month = date.getMonth() + 1 < 10 ? "0" + (date.getMonth() + 1) : date.getMonth() + 1;
  let day = date.getDate() < 10 ? "0" + date.getDate() : date.getDate();
  let hours = date.getHours() < 10 ? "0" + date.getHours() : date.getHours();
  let minutes = date.getMinutes() < 10 ? "0" + date.getMinutes() : date.getMinutes();
  let seconds = date.getSeconds() < 10 ? "0" + date.getSeconds() : date.getSeconds();
  let weeks = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
  let week = weeks[wk]
  // 拼接
  return  hours + ":" + minutes;
  // return year + "年" + month + "月" + day + "日" + " " + hours + ":" + minutes + ":" + seconds + ' ' + week;
}
const handleStoreChange=(value)=>{
  const key = [];
  vdata.receiveList.forEach((vv,kk) => {
    console.log(vv,'v1')
    const index = kk as any;
    if(vv.storeId == value){
      key.push(index as any)
      // message.error("已存在门店规格")
      return false;
    }
  })
  if(key.length > 1){
    message.error("已存在门店配置")
    vdata.receiveList[key.length-1].storeId = ''
  }
  console.log(vdata.receiveList,'vdatareceiveListvdatareceiveListvdatareceiveList')
}
//门店搜索
const handleDivisionNameChange = (value) => {
  vdata.filteredMchNameInfoList = [];
  vdata.storeList.forEach((item: { mchShortName: string | any[], storeId:  any[] },index) => {
    if (item.mchShortName.includes(value) || item.storeId.toString().includes(value) ) {

      vdata.filteredMchNameInfoList.push(vdata.storeList[index]);
    }
  });
};
const handleDivisionNoChange = (value) => {
  vdata.filteredMchNoInfoList = [];
  vdata.storeList.forEach((item: { mchShortName: string | any[], storeId:  any[] },index) => {
    if (item.mchShortName.includes(value) || item.storeId.toString().includes(value) ) {
      vdata.filteredMchNoInfoList.push(vdata.storeList[index]);
    }
  });
};
const onDelete = (key,type=0) => {
  if (vdata.receiveList.length <= 1) {
    $infoBox.message.error('最少保留一项')
    return false
  }
  vdata.receiveList = vdata.receiveList.filter(item => item.key !== key)
}
function getState(record,e){
  vdata.receiveList[record.key - 1].state  = e

}
</script>
<style lang="less" scoped>
.jeepay-tip-text::before{
  border: none !important;
}

.user-ploy-span{
  padding: 5px 10px;
}
.span-color{
  color: #595959 !important;
}
:deep(.span-color .ant-form-item-label>label){
  color: #595959 !important;
}

:deep(.jeepay-table-top-row){
  display: none;
}
.rule-span{
  padding: 5px 10px;
}
.con-flex-span{
  flex: 1 !important;
}
.tb_width_80{
  width: 80% !important;
}
.con-flex-div{
  display: flex;
  align-items: center;
  justify-content: space-around;
  width: 100%;
}
.operation-a{
  margin-right: 10px;
}
</style>
