<template>
  <div class="zj-page">
    <!-- <t-form class="zj-page-search" :data="formData" ref="form" @reset="onReset1" @submit="onSubmit">
      <t-form-item label="企业名称" class="search-width">
        <t-input v-model="formData.qymc" placeholder="请输入" clearable />
      </t-form-item>
      <t-form-item label="统一社会信用代码" class="search-width">
        <t-input v-model="formData.nsrsbh" placeholder="请输入" clearable />
      </t-form-item>
      <t-form-item class="search-width">
      </t-form-item>
      <t-form-item class="search-width">
        <t-space size="10px" style="margin-left: 100px">
          <t-button theme="default" variant="base" type="reset">重置</t-button>
          <t-button theme="primary" type="submit">查询</t-button>
        </t-space>
      </t-form-item>
    </t-form> -->
        <div class="zj-page-search">
      <search-control-panel
        ref="form"
        class="znsbHeadqueryDiv"
        :config="querySearchConfig"
        @search="onSubmit({ flag: true })"
        :colNum="4"
        @formChange="(v) => (formData = v)"
        :LABEL_THRESHOLD="9"
        :labelWidth="'calc(8em + 32px)'"
      />
    </div>
    <div class="zj-page-table">
      <t-table
        :data="tableData"
        :columns="columns"
        row-key="uuid"
        :max-height="540"
        :pagination="pagination"
        @page-change="onPageChange"
        :loading="tableloading"
      >
        <template #lrrq="{ row }">
          {{ row.lrrq.substr(0, 10) }}
        </template>
         <template #shjg1="{ row }">
          {{ row.shjg1==2?'待审核':(row.shjg1==3?'通过': (row.shjg1==4?'不通过':'已撤销'))}}
        </template>
        <template #cz="{ row }">
          <t-button variant="text" theme="primary" :disabled="row.shjg1!=2"  @click="shtc(row)">审核</t-button>
          <!-- <t-button variant="text" theme="primary" @click="checkAddress(row.uuid, '2')">通过</t-button>
        <t-button variant="text" theme="danger" @click="checkAddress(row.uuid, '3')">不通过</t-button> -->
        </template>
      </t-table>
    </div>

    <!--弹出窗体-->
    <t-dialog :visible="visible" header="企业认证审核" :footer="false" :closeOnOverlayClick="false" :onClose="close">
      <template slot="body">
        <t-form ref="form" :data="addressData" @reset="onReset" @submit="checkAddress()">
          <t-form-item label="企业名称">
            <!-- <t-input v-model="formData.qymc" style="width: 200px" placeholder="请输入" clearable /> -->
            <div class="form-text">{{ row.qymc }}</div>
          </t-form-item>
          <t-form-item label="统一社会信用代码">
            <!-- <t-input v-model="formData.nsrsbh" style="width: 200px" placeholder="请输入" clearable /> -->
            <div class="form-text">{{ row.nsrsbh }}</div>
          </t-form-item>
          <t-form-item label="手机号码">
            <div class="form-text">{{ row.sjhm1 }}</div>
          </t-form-item>
          <t-form-item label="申请时间">
            <!-- <t-input v-model="formData.sjhm1" style="width: 200px" placeholder="请输入" clearable /> -->
            <div class="form-text">{{ row.lrrq }}</div>
          </t-form-item>
          <t-form-item label="申请理由">
            <!-- <t-input v-model="formData.sjhm1" style="width: 200px" placeholder="请输入" clearable /> -->
            <div class="form-text">{{ row.sqsm }}</div>
          </t-form-item>
          <t-form-item label="审核结果">
            <t-select v-model="addressData.shjg1" :options="shztOptions" placeholder="请选择" clearable />
          </t-form-item>

          <t-form-item label="审核意见" name="sqsm">
            <!-- <t-textareat v-model="form.sqsm" :maxlength="100" placeholder="请填写申请理由" /> -->
            <t-textarea v-model="addressData.shyj1" placeholder="请填写审核意见" :maxlength="100"></t-textarea>
          </t-form-item>
          <t-form-item>
            <div style="width: 100%; text-align: center">
              <t-button theme="primary" type="submit" style="margin-right: 12px">保存</t-button>
              <t-button theme="default" variant="base" type="reset">取消</t-button>
            </div>
          </t-form-item>
        </t-form>
      </template>
    </t-dialog>
  </div>
</template>
<script>
import { getCjjlPage, qyRzSp, udpFhzt, getRegisterList } from '@/pages/index/api/htgl';
import { MessagePlugin } from 'tdesign-vue';
import SearchControlPanel from '@/pages/index/components/header-search/indexByTz.vue';
export default {
   components: { SearchControlPanel },
  data() {
    return {
            querySearchConfig: [
        {
          label: '企业名称',
          key: 'qymc',
          type: 'input',
          value: '',
          placeholder: '请输入',
          clearable: true,
        },
        {
          label: '统一社会信用代码',
          key: 'nsrsbh',
          type: 'input',
          value: '',
          placeholder: '请输入',
          clearable: true,
        },
        {
          label: '审核状态',
          key: 'shjg1',
          type: 'select',
          value: '',
          selectList: [
            { value: '2', label: '待审核' },
            { value: '3', label: '通过' },
            { value: '4', label: '不通过' },
            { value: '5', label: '已撤销' },
          ],
          placeholder: '请选择',
          clearable: true,
          isimport: true,
          filterable: true,
        },
        {
    label: '申请时间起',
    key: 'sqsjq',
    type: 'datepicker',
    value: '',
    placeholder: '请选择',
    clearable: true,
    isDisableToday: true,
    relation: 'sqsjq',
    timeRange: 'start',
  },
  {
    label: '申请时间止',
    key: 'sqsjz',
    type: 'datepicker',
    value: '',
    placeholder: '请选择',
    clearable: true,
    isDisableToday: true,
    relation: 'sqsjz',
    timeRange: 'end',
  },
      ],
      formData: {
        qymc: '', 
        nsrsbh: '',
        shjg1:'',
        sqsjq:'',
        sqsjz:''
      },
      tableloading: true,
      tableData: [],
      pagination: {
        current: 1,
        pageSize: 10,
        total: 0,
      },
      columns: [
        { colKey: 'xh', width: 60, align: 'left', title: '序号' },
        { colKey: 'qymc', title: '企业名称', align: 'left', width: 100 },
        { colKey: 'nsrsbh', title: '统一社会信用代码', align: 'left', width: 120 },
        { colKey: 'sjhm1', title: '手机号码', align: 'left', width: 100 },
        { colKey: 'lrrq', title: '申请时间', align: 'left', width: 80 },


        { colKey: 'dlzh', title: '申请账号', align: 'left', width: 120 },
        { colKey: 'zsxm1', title: '申请人姓名', align: 'left', width: 120 },

        { colKey: 'sqsm', title: '申请理由', align: 'left', width: 120 },
        { colKey: 'shjg1', title: '审核状态', align: 'left', width: 120 },
        { colKey: 'cz', title: '操作', align: 'left', width: 50 },
      ],
      visible: false,
      shztOptions: [
        { value: '3', label: '通过' },
        { value: '4', label: '不通过' },
      ],
      addressData: {
        shjg1: '',
        shyj1: '',
      },
      row: {
        qymc: '',
        nsrsbh: '',
        sjhm1: '',
        lrrq: '',
        sqsm: '',
      },
    };
  },
  created() {
    this.initView();
  },
  methods: {
    //初始化接口
    initView() {
      this.getCjjlPage();
    },
    async getCjjlPage() {
      const params = {...this.formData};
      // const params = {};
      this.tableloading = true;
      try {
        const res = await getRegisterList(params);
        console.log('res.data', res.data);

        if (res.data && res.code === 1) {
          // this.pagination.current = res.data.current;
          this.pagination.total = res.data.length;
          res.data.map((item, index) => {
            item.xh = index + 1;
          });
          this.tableData = res.data;
        } else {
          this.tableData = [];
        }
      } catch (error) {
        console.error('数据加载失败', error);
      } finally {
        this.tableloading = false;
      }
    },
    //查看奖品地址
    shtc(row) {
      this.visible = true;
      this.row = row;
    },
    close() {
      this.visible = false;
      this.row = {
        qymc: '',
        nsrsbh: '',
        sjhm1: '',
        lrrq: '',
        sqsm: '',
      };
    },
    async checkAddress() {
      // this.visible = true;
      let params = {
        uuid: this.row.uuid,
        ...this.addressData,
      };
      console.log('params', params);

      try {
        const res = await qyRzSp(params);
        console.log('res', res);
        if (res.code == 1) {
          MessagePlugin.info('审核成功');
          this.pagination = {
            current: 1,
            pageSize: 10,
            total: 0,
            showJumper: true,
          };
          this.getCjjlPage();
          this.visible = false;
        }
      } catch (error) {
        console.error('数据加载失败', error);
      }
    },
    onReset() {
      this.visible = false;
      // this.$message.success('重置成功');
    },
    onReset1() {
      this.formData = {
        qymc: '',
        nsrsbh: '',
      };
      this.pagination = {
        current: 1,
        pageSize: 10,
        total: 0,
        showJumper: true,
      };
      this.getCjjlPage();
    },
    //查询方法
    onSubmit() {
      this.getCjjlPage();
    },
    //提交修改地址信息
    async onSubmitUpdata() {
      //调用保存接口，修改成功关闭弹窗
      const param = {
        uuid: this.addressData.uuid,
        zt: this.addressData.zt,
      };
      console.log('获取数据信息：', param);
      try {
        const res = await udpFhzt(param);
        if (res.data && res.code === 1) {
          this.visible = false;
        }
      } catch (error) {
        console.error('数据加载失败', error);
      }
    },
    async onPageChange(pageInfo) {
      console.log('onPageChange', pageInfo);
      this.pagination.current = pageInfo.current;
      this.pagination.pageSize = pageInfo.pageSize;
      this.getCjjlPage();
    },
  },
};
</script>
<style lang="less" scoped>
.zj-page {
  padding: 24px;
}
.zj-page-search {
  padding: 24px;
  background: white;
  border-radius: 4px;
}
.zj-page-table {
  width: 100%;
  min-height: 600px;
  padding: 16px;
  overflow: auto;
  background: white;
}
.t-table {
  width: 100%;
  padding: 8px;
  margin: 24px auto;
  border-radius: 4px;
}
/deep/.t-dialog__wrap .t-dialog {
  width: 40%;
  height: 50%;

  .t-form__label {
    width: 136px !important;
  }
}
.t-table /deep/ .t-input--suffix {
  width: 110px;
}
.form-text {
  color: #666;
}
.search-width {
  width: 22%;
}
</style>
