<template>
    <div class="RecordWriteOffBySearch">
      <div class="partTitle">查询条件</div>
      <businessForm :form-config="formConfigTwo" />
      <FormLayout
        ref="formLayout"
        :default-column="formLayout.defaultColumn"
        :defaultconfig="formLayout.defaultConfig"
      />
      <businessForm class='tipbusinessFormOne' :form-config="formConfig" />
      <div class="partTitle">说明</div>
      <businessForm :form-config="formConfigOne" />
      <businessButton :btn-config="btnConfig" />
    </div>
  </template>
  
  
  <script>
    import businessForm from 'professionalComponents/businessForm';
    import businessButton from 'professionalComponents/businessButton';
    const R3 = window.R3;
    const { network, urlSearchParams } = R3;
  
    export default {
      components: {
        businessForm,
        businessButton
      },
      props: {},
      data() {
        return {
          vmI18n: window.vmI18n,
          formConfigTwo: {
            formValue: {
              // VERIFICATIONBATCHES: '', // number
              SOURCECODE: '', // number
            },
            formData: [
              // {
              //   style: 'input',
              //   label: '核销批次',
              //   value: 'VERIFICATIONBATCHES', // 输入框的值
              //   width: '24',
              //   icon: '',
              //   placeholder: '输入核销批次，多个以空格、逗号、分号隔开',
              //   ghost: false, // 是否关闭幽灵按钮，默认开启
              //   inputenter: () => {
              //   }, // 表单回车事件
              //   iconclick: () => {
              //   } // 点击icon图标事件
              //   // setRequired: "required" //必选标识,值不为required时无标识
              // },
              {
                style: 'input',
                label: '平台单号',
                value: 'SOURCECODE', // 输入框的值
                width: '24',
                icon: '',
                placeholder: '输入平台单号，多个以空格、逗号、分号隔开',
                ghost: false, // 是否关闭幽灵按钮，默认开启
                inputenter: () => {
                }, // 表单回车事件
                iconclick: () => {
                } // 点击icon图标事件
                // setRequired: "required" //必选标识,值不为required时无标识
              },
            ],
          },
          formLayout: {
            defaultColumn: 1,
            defaultConfig: [
              {
                item: {
                  type: 'DropMultiSelectFilter',
                  required: false,
                  label: '平台',
                  props: {
                    disabled: false,
                    totalRowCount: 100,
                    pageSize: 10,
                    hidecolumns: ['ID'],
                    showColnameKey: 'isak', // 选中展示字段：对应表头需要增加改字段为true（isak：true）
                    AutoData: [],
                    defaultSelected: [],
                    data: {
                      start: 0,
                      totalRowCount: 70,
                      pageSize: 10,
                      tabth: [],
                      row: []
                    },
                  },
                  style: {
                    width: 60,
                  },
                  event: {
                    'on-fkrp-selected': (e) => {
                      this.formLayout.formValue.platforms = e;
                    },
                    'on-clear': () => {
                      this.formLayout.formValue.platforms = [];
                    },
                    'on-popper-show': async () => {
                      this.getPlatform();
                    },
                    'on-page-change': (value) => {
                      this.getPlatform(value);
                    },
                    'on-input-value-change': async (value) => {
                      let fd = new FormData();
                      fd.append('ak', value);
                      fd.append('colid', 198187);
                      const res = await this.service.common.fuzzyquerybyak(fd);
                      if (res.data.code === 0) {
                        let autoData = []
                        res.data.data.forEach(item => {
                          let obj = {
                            id:item.id,
                            value:item.value
                          }
                          autoData.push(obj)
                        })
                        this.formLayout.defaultConfig[0].item.props.AutoData = autoData;
                      }
                    }
                  }
                }
              },
              {
                item: {
                  type: 'DropMultiSelectFilter',
                  required: false,
                  label: '店铺',
                  props: {
                    disabled: false,
                    totalRowCount: 100,
                    pageSize: 10,
                    hidecolumns: ['ID'],
                    showColnameKey: 'isak', // 选中展示字段：对应表头需要增加改字段为true（isak：true）
                    AutoData: [],
                    defaultSelected: [],
                    data: {
                      start: 0,
                      totalRowCount: 70,
                      pageSize: 10,
                      tabth: [],
                      row: []
                    },
                  },
                  style: {
                    width: 60,
                  },
                  event: {
                    'on-fkrp-selected': (e) => {
                      this.formLayout.formValue.shops = e;
                    },
                    'on-clear': () => {
                      this.formLayout.formValue.shops = [];
                    },
                    'on-popper-show': async () => {
                      this.getShop();
                    },
                    'on-page-change': (value) => {
                      this.getShop(value);
                    },
                    'on-input-value-change': async (value) => {
                      let fd = new FormData();
                      fd.append('ak', value);
                      fd.append('colid', 198185);
                      const res = await this.service.common.fuzzyquerybyak(fd);
                      if (res.data.code === 0) {
                        let autoData = []
                        res.data.data.forEach(item => {
                          let obj = {
                            id:item.id,
                            value:item.value
                          }
                          autoData.push(obj)
                        })
                        this.formLayout.defaultConfig[1].item.props.AutoData = autoData;
                      }
                    }
                  }
                }
              
              },
            ],
            formValue: {
              platforms: [],
              shops: [],
              brands: []
            }
          },
          // 查询条件this.formLayout.formValue.brands
          formConfig: {
            formValue: {
              CHECKSTSTUS: '', // 对账状态
              BILL_START_DATE: '', // 账单开始时间
              BILL_END_DATE: '', // 账单结束时间
              CHECK_START_TIME: '', // 对账开始时间
              CHECK_END_TIME: '', // 对账结束时间
              OUTOFSTORE_START_TIME: '', // 出库开始时间
              OUTOFSTORE_END_TIME: '', // 出库结束时间
              INSTORE_START_TIME: '', // 入库开始时间
              INSTORE_END_TIME: '', // 入库结束时间
              IS_BILLDATE_NULL: false,
            },
            formData: [
              {
                style: 'selectnew', // 单选框
                label: '对账状态', // 订单状态 前面字段
                width: '24', // 宽度
                value: 'CHECKSTSTUS1', // 绑定到formValue的值
                multiple: true,
                chooseAll: true,
                selectChange: (value) => {
                  this.formConfig.formValue.CHECKSTSTUS=value.join(',')
                },
                // setRequired: "required", //必选标识,值不为required时无标识
                options: [
                  {
                    label: '未对账', // 待发货
                    value: 0,
                  },
                  {
                    label: '已对账', // 待发货
                    value: 1,
                  },
                ]
              },
              {
                style: 'datenew',
                label: '账单时间',
                value: 'BILLDATE',
                disabled: false,
                width: '24',
                format: 'yyyy-MM-dd hh:mm:ss',
                vModelFormat: true,
                type: 'datetimerange',
                onChange: (value) => {
                  this.formConfig.formValue.BILL_START_DATE = value[0]
                  this.formConfig.formValue.BILL_END_DATE = value[1]
                }
              },
              {
                style: 'datenew',
                label: '对账时间',
                value: 'CHECKTIME',
                disabled: false,
                width: '24',
                format: 'yyyy-MM-dd hh:mm:ss',
                vModelFormat: true,
                type: 'datetimerange',
                onChange: (value) => {
                  this.formConfig.formValue.CHECK_START_TIME = value[0]
                  this.formConfig.formValue.CHECK_END_TIME = value[1]
                }
              },
              {
                style: 'datenew',
                label: '平台账单时间',
                value: 'PLATFORM',
                id:'PLATFORM_START_BILLDATE',
                disabled: false,
                width: '24',
                isNotNull:true,
                format: 'yyyy-MM-dd hh:mm:ss',
                vModelFormat: true,
                type: 'datetimerange',
                options: {
                    shortcuts: [
                        {
                            text: '为空',
                            value() {
                              return ['is null','is null'];                           
                         },
                           
                        },
                        
                    ]
                },
                onChange: (value) => {
                  console.log(value,'=====34343=')
                  if(value[0] !== 'is null'){
                    this.formConfig.formValue.PLATFORM_START_BILLDATE = value[0]
                    this.formConfig.formValue.PLATFORM_END_BILLDATE = value[1]
                    this.formConfig.formValue.IS_BILLDATE_NULL = ''
                  }else {
                    this.formConfig.formValue.IS_BILLDATE_NULL = 1
                    this.formConfig.formValue.PLATFORM_START_BILLDATE = ''
                    this.formConfig.formValue.PLATFORM_END_BILLDATE = ''
                  }
                }
              },
              {
                style: 'datenew',
                label: '出库时间',
                value: 'OUTOFSTORE_TIME',
                disabled: false,
                width: '24',
                format: 'yyyy-MM-dd hh:mm:ss',
                vModelFormat: true,
                type: 'datetimerange',
                onChange: (value) => {
                  this.formConfig.formValue.OUTOFSTORE_START_TIME = value[0]
                  this.formConfig.formValue.OUTOFSTORE_END_TIME = value[1]
                }
              },
              {
                style: 'datenew',
                label: '入库时间',
                value: 'INSTORE_TIME',
                disabled: false,
                width: '24',
                format: 'yyyy-MM-dd hh:mm:ss',
                vModelFormat: true,
                type: 'datetimerange',
                onChange: (value) => {
                  this.formConfig.formValue.INSTORE_START_TIME = value[0]
                  this.formConfig.formValue.INSTORE_END_TIME = value[1]
                }
              },
            ],
          },
          formConfigOne: {
              formValue: {
                VERIFICATION_EXPLAIN: '', // number
              },
              formData: [
                  {
                      style: 'input',
                      label: '核销说明',
                      value: 'VERIFICATION_EXPLAIN', // 输入框的值
                      width: '24',
                      icon: '',
                      placeholder: '',
                      ghost: false, // 是否关闭幽灵按钮，默认开启
                      inputenter: () => {
                      }, // 表单回车事件
                      iconclick: () => {
                      } // 点击icon图标事件
                      // setRequired: "required" //必选标识,值不为required时无标识
                  },
              ],
              // 表单非空提示
              ruleValidate: {
                  // lowInventory: [{
                  //     required: true,
                  //     message: ' ',
                  //     trigger: 'blur'
                  // }],
              }
          },
          btnConfig: {
            typeAll: '', // 按钮统一风格样式
            btnsite: 'center', // 按钮位置 (right , center , left)
            buttons: [
              {
                type: 'posdefault', // 按钮类型
                text: '确定', // 按钮文本
                icon: '', // 按钮图标
                size: '', // 按钮大小
                ghost: true, // 是否关闭幽灵按钮，默认开启
                disabled: false, // 按钮禁用控制
                btnclick: () => {
                  this.determine();
                }, // 按钮点击事件
              },
              {
                type: 'fcdefault', // 按钮类型
                text: window.vmI18n.t('common.cancel'), // 取消 按钮文本
                icon: '', // 按钮图标
                size: '', // 按钮大小
                ghost: true, // 是否关闭幽灵按钮，默认开启
                disabled: false, // 按钮禁用控制
                btnclick: () => {
                  this.$emit('closeActionDialog', false);
                } // 按钮点击事件
              },
            ]
          },
        };
      },
      mounted() {
      },
      methods: {
        // formLayout形式获取平台
        async getPlatform(pageNum = 1, start = 0, range = 10) {
          const query = {
            isdroplistsearch: true,
            refcolid: 198187,
            startindex: (pageNum - 1) * range,
            range,
            fixedcolumns: {
              // PLATFORM: `=${this.PLATFORM[this.$route.params.tableName]}`,
            }
          };
          const fd = new FormData();
          fd.append('searchdata', JSON.stringify(query));
          const res = await this.service.common.QueryList(fd);
          if (res.data.code == 0) {
            let data = {
              start,
              totalRowCount: res.data.data.totalRowCount,
              pageSize: range,
              tabth: res.data.data.tabth,
              row: res.data.data.row
            };
            this.formLayout.defaultConfig[0].item.props.data = data;
            this.formLayout.defaultConfig[0].item.props.totalRowCount = res.data.data.totalRowCount;
          }
        },
        // formLayout形式获取平台店铺
        async getShop(pageNum = 1, start = 0, range = 10) {
          const query = {
            isdroplistsearch: true,
            refcolid: 198185,
            startindex: (pageNum - 1) * range,
            range,
            fixedcolumns: {
              // PLATFORM: `=${this.PLATFORM[this.$route.params.tableName]}`,
            }
          };
          const fd = new FormData();
          fd.append('searchdata', JSON.stringify(query));
          const res = await this.service.common.QueryList(fd);
          if (res.data.code == 0) {
            let data = {
              start,
              totalRowCount: res.data.data.totalRowCount,
              pageSize: range,
              tabth: res.data.data.tabth,
              row: res.data.data.row
            };
            this.formLayout.defaultConfig[1].item.props.data = data;
            this.formLayout.defaultConfig[1].item.props.totalRowCount = res.data.data.totalRowCount;
          }
        },
        // 确定按钮
        determine() {
          const formValue = this.formConfig.formValue;
          const formValue2 = this.formConfigTwo.formValue;
          const formLayoutFormValue = this.formLayout.formValue;
          const formValueOne = this.formConfigOne.formValue;
          console.log(formValue,'formValue')
          // !formValue2.VERIFICATIONBATCHES && 
          if (!formValue2.SOURCECODE
              && !formLayoutFormValue.platforms.length 
              && !formLayoutFormValue.shops.length 
              && !formValue.CHECKSTSTUS 
              && !formValue.BILL_START_DATE 
              && !formValue.CHECK_START_TIME
              && !formValue.OUTOFSTORE_START_TIME
              && !formValue.PLATFORM_START_BILLDATE
              && !formValue.IS_BILLDATE_NULL
              && !formValue.INSTORE_START_TIME) {
            this.$Message.warning('请选择查询条件！'); // 请选择需要下载的店铺
            return;
          }
          // if (!formValueOne.lowInventory) {
          //   this.$Message.warning('请填写低库存数！'); // 请填写低库存数！
          //   return;
          // }
          let platforms = []
          let shopIds = []
          formLayoutFormValue.platforms.forEach(item => {
            platforms.push(item.ID)
          })
          formLayoutFormValue.shops.forEach(item => {
            shopIds.push(item.ID)
          })
          let params = {
            // VERIFICATIONBATCHES: formValue2.VERIFICATIONBATCHES,
            SOURCECODE: formValue2.SOURCECODE,
            PLATFORM: platforms.join(','),
            IESSHOPID: shopIds.join(','),
            CHECKSTSTUS: formValue.CHECKSTSTUS,
            BILL_START_DATE: formValue.BILL_START_DATE, // 账单开始时间
            BILL_END_DATE: formValue.BILL_END_DATE, // 账单结束时间
            CHECK_START_TIME: formValue.CHECK_START_TIME, // 对账开始时间
            CHECK_END_TIME: formValue.CHECK_END_TIME, // 对账结束时间
            OUTOFSTORE_START_TIME: formValue.OUTOFSTORE_START_TIME, // 出库开始时间
            OUTOFSTORE_END_TIME: formValue.OUTOFSTORE_END_TIME, // 出库结束时间
            INSTORE_START_TIME: formValue.INSTORE_START_TIME, // 入库开始时间
            INSTORE_END_TIME: formValue.INSTORE_END_TIME, // 入库结束时间
            PLATFORM_START_BILLDATE: formValue.PLATFORM_START_BILLDATE, // 平台账单开始时间
            IS_BILLDATE_NULL: formValue.IS_BILLDATE_NULL,
            PLATFORM_END_BILLDATE: formValue.PLATFORM_END_BILLDATE, // 平台账单结束时间
            VERIFICATION_EXPLAIN: formValueOne.VERIFICATION_EXPLAIN,
          }
          network.post('/p/cs/billCancelAfterVerification/condition',params).then(res => {
            if(res.data.code == 0){
              this.$Message.success(res.data.message);
              this.$emit('closeActionDialog', true);
            }
          })
        }
      }
    };
  </script>
  
  <style>
    @import "~@yunque/css/modal/interfacePlatform/downLoadAll.less";
  
    .ark-col.ark-col-span-24:last-child {
      margin-bottom: 26px;
    }
  
    .RecordWriteOffBySearch {
      width: 600px;
    }
  
    .RecordWriteOffBySearch /deep/ .formlayout {
      padding-right: 28px;
    }
  
    .RecordWriteOffBySearch .formlayout-Item {
      margin-bottom: 6px;
      margin-right: 28px;
    }
  
    .RecordWriteOffBySearch .ark-col-span-24 {
      margin-bottom: 6px;
    }

    .RecordWriteOffBySearch .ark-col-span-24:last-child {
      margin-bottom: 6px;
    }

    .RecordWriteOffBySearch .tipbusinessFormOne .ark-col-span-24:last-child {
      margin-bottom: 20px;
    }

    .RecordWriteOffBySearch .ark-select-multiple .ark-select-item.ark-select-item-all {
      display: none;
    }
  </style>
  <style lang='less' scoped>
      .partTitle {
          font-size: 14px;
          font-weight: 600;
          margin-bottom: 12px;
          margin-left: 24px;
      }
  </style>
