<template>
  <div>
    <FormSearch
      :form-arr="formArr"
      :form-data="formData"
      @outOperation="outOperation"
      @searchSubmit="searchSubmit"
      @input="handleInput"
      @reset="resetForm"
    />
    <div class="tableBox">
      <PublicTable
        ref="table"
        class="table"
        row-key="id"
        :loading="loading"
        :has-index="true"
        :need-select="true"
        :table-data="tableData"
        :table-info="tableInfo"
        :table-column="columns"
        :events="events"
        operation-width="150px"
        :btn-button="operations"
        :table-top-button="tableTopButton"
        :operation-fixed="true"
        :is-need-pagination="true"
        :current-page="searchParams.pageNum"
        :page-size="searchParams.pageSize"
        :total="total"
        :operated-string="operatedString"
        :is-need-customcolumn="false"
        :has-operation="false"
        @sizeChange="handleSizeChange"
        @currentChange="handleCurrentChange"
        @customColumnChange="handleCustomColumnChange"
        @handleTableTopColumnIconClick="handleTableTopColumnIconClick"
        @handleSelectionChange="(val)=> currentSelect = val"
      />
    </div>
    <NewDialog
      :text="'新增'"
      :width="'30%'"
      :form-data="dialogFormData"
      :form-arr="dialogFormArr"
      :dialog-visible="visible"
      @onSubmit="handleSubmit"
      @onClose="handleClose"
    />
  </div>
</template>

<script>
import FormSearch from '../../../components/formSearch/index.vue';
import PublicTable from '../../../components/table/index.vue';
import NewDialog from './dialogWithForm.vue';
import { formatDateString } from './date.js';
import { queryMdsFindAllCptysi18n } from './dataProcessing.js';
import isNil from 'lodash/isNil';
import { TYPE, TYPE_NAME } from './constants/index';

export default {
  components: {
    FormSearch,
    PublicTable,
    NewDialog,
  },
  data() {
    return {
      formArr: [
        {
          type: 'selectApi',
          prop: 'selectApi1',
          span: 6,
          options: [],
          attrs: {
            label: '评级目标:',
          },
        },
        {
          type: 'selectApi',
          prop: 'selectApi2',
          span: 4,
          options: [],
          attrs: {},
        },
        {
          type: 'selectApi',
          prop: 'ratingAgencyCode',
          span: 6,
          options: [],
          attrs: {
            label: '评级机构:',
          },
        },
        {
          type: 'selectApi',
          prop: 'ratingCode',
          span: 4,
          options: [],
          attrs: {},
        },
        {
          type: 'pickerDate',
          prop: 'pickerDate1',
          span: 8,
          attrs: {
            label: '日期:',
            type: 'daterange',
            'value-format': 'yyyy-MM-dd',
            'range-separator': '至',
            'start-placeholder': '开始日期',
            'end-placeholder': '结束日期',
          },
        },
      ],
      // 默认值
      formData: {},
      // 获取列表前是否loading加载
      loading: false,
      // table数据源
      tableData: [
        {
          historyKey: 'mdsTargetRating-100012AAABC',
          historyType: 'mdsTargetRating',
          targetCode: 'Z23071404.BJ',
          targetType: 'B',
          ratingAgencyCode: '100012',
          ratingCode: 'AAA',
          term: 'C',
          innerRating: 0,
          ratingDate: formatDateString(20250306),
          comments: '',
          auditTimes: 1741345038000,
          bondsCode: null,
          ratingAgencyCodes: null,
          name: null,
          ratingAgencyName: '标准普尔评级',
          ratingName: null,
          termName: 'C',
          ratingDateStr: null,
          targetTypeName: '债券评级',
        },
      ],
      // 表格项绑定的属性
      columns: [
        {
          prop: 'targetTypeName',
          minWidth: '100px',
          align: 'center',
          label: this.$t('field.targetTypeName'),
        },
        {
          prop: 'name',
          minWidth: '100px',
          align: 'center',
          label: this.$t('field.name'),
        },
        {
          prop: 'ratingAgencyName',
          minWidth: '200px',
          align: 'center',
          label: this.$t('field.ratingAgencyName'),
        },
        {
          prop: 'term',
          minWidth: '100px',
          align: 'center',
          label: this.$t('field.term'),
        },
        {
          prop: 'ratingCode',
          minWidth: '100px',
          align: 'center',
          label: this.$t('field.ratingCode'),
        },
      ],
      // 表格行单机双击事件
      events: {
        'row-dblclick': (row) => {
          // 双击表格 行 触发的函数
          console.log('row-dblclick', row);
        },
        'row-click': (row) => {
          // 单机表格 行 触发的函数
          console.log('row-click', row);
        },
      },
      tableTopButton: [
        {
          text: this.$t('button.add'),
          type: 'primary',
          class: 'el-text-color',
          callback: (value) => {
            this.handletableTopButton(value, TYPE.ADD);
          },
        },
        {
          text: this.$t('button.edit'),
          type: 'primary',
          class: 'el-text-color',
          callback: (value) => {
            this.handletableTopButton(value, TYPE.EDIT);
          },
        },
        {
          text: this.$t('button.delete'),
          type: 'primary',
          class: 'el-text-color',
          callback: (value) => {
            this.handletableTopButton(value, TYPE.DELETE);
          },
        },
        {
          text: this.$t('button.copy'),
          type: 'primary',
          class: 'el-text-color',
          callback: (value) => {
            this.handletableTopButton(value, TYPE.COPY);
          },
        },
      ],
      // 搜索查询的参数
      searchParams: {
        pageNum: 1,
        pageSize: 20,
      },
      total: 100,
      operatedString: '',
      componentsPropName: null,
      currentSelect: [],
      visible: false,
      dialogFormArr: [
        {
          type: 'selectApi',
          prop: 'targetType',
          span: 24,
          options: [],
          attrs: {
            label: '评级目标',
          },
        },
        {
          type: 'selectApi',
          prop: 'targetCode',
          span: 24,
          options: [],
          attrs: {
            label: '交易对手',
          },
        },
        {
          type: 'selectApi',
          prop: 'ratingAgencyCode',
          span: 24,
          options: [],
          attrs: {
            label: '评级机构',
          },
        },
        {
          type: 'selectApi',
          prop: 'ratingCode',
          span: 24,
          options: [],
          attrs: {
            label: '评级',
          },
        },
        {
          type: 'pickerDate',
          prop: 'ratingDate',
          span: 24,
          attrs: {
            label: '评级日期',
          },
        },
      ],
      dialogFormData: null,
    };
  },

  async mounted() {
    // this.queryPage();
    this.queryComboxData();
    this.msdFindRatingAgenciesByContainsTermRating();
  },
  methods: {
    isProp(index) {
      return !isNil(this.componentsPropName) && this.componentsPropName === this.formArr[index].prop;
    },

    async handleInput(val) {
      console.log(val);
      if (!isNil(this.componentsPropName) && this.componentsPropName === this.formArr[0].prop && val) {
        this.formArr[1].options = await queryMdsFindAllCptysi18n(val);
      }
      if (!isNil(this.componentsPropName) && this.componentsPropName === this.formArr[2].prop) {
        this.msdFindRatingByAgencyIdAndTerm();
      }
      return;
    },
    searchSubmit(val) {
      console.log('search结果', val);
    },
    resetForm() {
      this.formData = {};
    },
    outOperation(val, index, prop, num) {
      console.log(val, index, prop, num);
      this.componentsPropName = prop;
    },
    // 页面展示条数改变事件-pageSize
    handleSizeChange(pageSize) {
      this.searchParams.pageSize = pageSize;
    },
    // 页面切换事件-pageNum
    handleCurrentChange(pageNum) {
      // console.log('');
      this.searchParams.pageNum = pageNum;
    },
    handleAddOrEdit(type, row) {
      // console.log('新增编辑',type, row);
    },
    // 数据列确定修改事件
    handleCustomColumnChange(val) {
      // console.log('数据列确定修改事件',val);
      // this.tableData = mockData2;
    },
    // 导入按钮点击事件
    handleDataImport() { },
    // 导出按钮点击事件
    handleDataExport() { },
    // 点击当前列前的图标事件
    handleTableTopColumnIconClick(val) {
      this.operatedString = '我是计算了之后的字符串';
      console.log('当前列 ', val);
    },
    // 多选事件
    handleSelectionChange(val) {
      console.log('多选事件 ', val);
      this.currentSelect = val;
    },
    // 自定义按钮 点击事件
    handletableTopButton(val, type) {
      console.log('自定义按钮', val, type);
      if (type === 'add') {
        this.dialogFormData = {
          targetType: null,
          targetCode: null,
          ratingAgencyCode: null,
          ratingCode: null,
          ratingDate: new Date(),
        };
        this.visible = true;
        return;
      }
      if ([TYPE.EDIT, TYPE.COPY].includes(type)) {
        if (this.currentSelect.length > 1) {
          this.$message.error('至多选择一条');
          return;
        }
        if (this.currentSelect.length < 1) {
          this.$message.error('至少选择一条');
          return;
        }
        const { targetType, targetCode, ratingAgencyCode, ratingCode, ratingDate } = this.currentSelect[0];
        this.dialogFormData = {
          targetType,
          targetCode,
          ratingAgencyCode,
          ratingCode,
          ratingDate,
        };
        this.visible = true;
        this.text = TYPE_NAME[type];
        return;
      }
      if (type === TYPE.DELETE) {
        if (this.currentSelect.length < 1) {
          this.$message.error('至少选择一条');
          return;
        }
      }
      return;
    },
    async queryPage() {
      const params = {
        queryParam: {
          grpid: '',
          code: '',
          pageStart: this.searchParams.pageNum,
          pageLimit: this.searchParams.pageSize,
        },
      };
      const res = await this.$apis.msdQueryPage(params);
      if (res.success) {
        this.tableData = res.data.result.datals;
        this.total = res.data.result.total;
        this.$message.success('请求成功');
      }
    },

    async queryComboxData() {
      const params = {
        codifierGrpCodes: 'RatingType,RatingTermType,static_cptys',
      };
      const res = await this.$apis.msdQueryComboxData(params);
      if (res.success) {
        const { RatingType = [] } = res.data?.result;
        this.formArr[0].options = RatingType.map(item => ({ label: item.text, value: item.value }));
        this.$message.success('请求成功');
      }
    },

    async msdFindRatingAgenciesByContainsTermRating() {
      const res = await this.$apis.msdFindRatingAgenciesByContainsTermRating();
      if (res.success) {
        const { data: { ratingAgency }} = res;
        this.formArr[2].options = ratingAgency.map(item => ({ label: item.name, value: item.id }));
        this.$message.success('请求成功');
      }
    },

    async msdFindRatingByAgencyIdAndTerm() {
      const params = {
        ratingAgencyId: this.formData.ratingAgencyCode,
        term: 'C',
      };
      const res = await this.$apis.msdFindRatingByAgencyIdAndTerm(params);
      if (res.success) {
        const { data: { rating }} = res;
        this.formArr[3].options = rating.map(item => ({ label: item.name, value: item.code }));
      }
    },

    handleSubmit(val) {
      this.visible = false;
      console.log('submitVal', val);
    },
    handleClose() {
      this.visible = false;
    },
  },
};
</script>

<style lang="scss" scoped></style>
