<template>
  <div class="padding" style="height: 700px; overflow: auto">
    <div class="padding">
      <div style="font-weight: bold; font-size: 16px">基本信息</div>
      <div class="back_color padding marginTop" v-if="baseData1">
        <a-descriptions title="" :column="2">
          <a-descriptions-item :label="rowData.flag + '报告编码'">{{
            baseData1.reportNo
          }}</a-descriptions-item>
          <a-descriptions-item :label="rowData.flag + '报告抬头'">{{
            baseData1.reportName
          }}</a-descriptions-item>
          <a-descriptions-item label="检验日期">{{ baseData1.checkDate }}</a-descriptions-item>
          <a-descriptions-item label="检验员">{{ baseData1.checkUserName }}</a-descriptions-item>

          <a-descriptions-item label="报告生成日期">{{ baseData1.createDate }}</a-descriptions-item>
        </a-descriptions>
      </div>
    </div>
    <div class="padding">
      <div style="font-weight: bold; font-size: 16px">检测配置</div>
      <div class="back_color padding marginTop" v-if="baseData1">
        <a-descriptions title="" :column="2">
          <a-descriptions-item label="抽样标准">
            <span v-if="baseData1.samplingStandard">
              <span v-for="(re, i) in baseData1.samplingStandard.split(',')" :key="i">
                <span v-for="item in judgeResultOptions" :key="item.key">
                  <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
                </span>
              </span>
            </span>
          </a-descriptions-item>
          <a-descriptions-item label="抽样数">{{ baseData1.samplingNum }}</a-descriptions-item>
          <a-descriptions-item label="检验类别">
            <span v-if="baseData1.chekcType">
              <span v-for="(re, i) in baseData1.chekcType.split(',')" :key="i">
                <span v-for="item in checkTypeOptions" :key="item.key">
                  <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
                </span>
              </span>
            </span></a-descriptions-item
          >
          <a-descriptions-item label="检验项目">
            <span v-if="baseData1.checkProduct">
              <span v-for="(re, i) in baseData1.checkProduct.split(',')" :key="i">
                <span v-for="item in checkProductOptions" :key="item.key">
                  <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
                </span>
              </span>
            </span></a-descriptions-item
          >
          <a-descriptions-item label="检验标准">
            <span v-if="baseData1.checkStandard">
              <span v-for="(re, i) in baseData1.checkStandard.split(',')" :key="i">
                <span v-for="item in judgeResultOptions" :key="item.key">
                  <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
                </span>
              </span></span
            ></a-descriptions-item
          >
          <a-descriptions-item label="检验方法">
            <span v-if="baseData1.checkMethod">
              <span v-for="(re, i) in baseData1.checkMethod.split(',')" :key="i">
                <span v-for="item in checkMethodOptions" :key="item.key">
                  <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
                </span>
              </span></span
            ></a-descriptions-item
          >
        </a-descriptions>
      </div>
    </div>
    <div class="padding">
      <div style="font-weight: bold; font-size: 16px">数据检测</div>

      <a-table
        :columns="filterColum(columnsProp.columns)"
        :bordered="true"
        :pagination="true"
        :data-source="detailList"
        :scroll="{ x: 'max-content' }"
      >
        <template #bodyCell="{ column, record, index }">
          <template v-if="column.key !== 'action'">
            <template v-if="column.dataIndex === 'index'">
              {{ index + 1 }}
            </template>
          </template>

          <template v-if="column.dataIndex === 'carId'">
            <span v-for="(re, i) in record.carId.split(',')" :key="i">
              <span v-for="item in carIdOptions" :key="item.key">
                <span v-if="item.value == re">{{ i > 0 ? ',' : '' }}{{ item.label }}</span>
              </span>
            </span>
          </template>
          <template v-if="column.dataIndex === 'imgFile'">
            <Upload
              v-if="record.imgFile"
              :disabled="true"
              v-model:value="record.imgFile"
              listType="dragger"
              :style="{ display: 'none' }"
            />
          </template>
        </template>
      </a-table>
    </div>
    <div class="padding">
      <div style="font-weight: bold; font-size: 16px"></div>
      <div class="back_color padding marginTop" v-if="baseData1">
        <span style="font-weight: bold; font-size: 14px; padding-right: 20px">检测报告编号</span
        >{{ baseData1.checkReportNo }}
      </div>
    </div>
    <div class="padding">
      <div style="font-weight: bold; font-size: 16px">检测结果</div>
      <div class="back_color padding marginTop" v-if="baseData1">
        <span style="font-weight: bold; font-size: 14px; padding-right: 20px; color: #fcb46c"
          >整体判定</span
        ><span
          style="
            width: 80%;
            text-align: center;
            display: inline-block;
            font-size: 15px;
            font-weight: bold;
          "
        >
          <span v-if="baseData1.judgeResult == 1">合格</span>
          <span v-if="baseData1.judgeResult == 2" style="color: red">不合格</span>
        </span>
      </div>
    </div>
    <div class="padding">
      <div class="back_color padding marginTop" v-if="baseData1">
        <span style="font-weight: bold; font-size: 14px; padding-right: 20px"
          >备注&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span
        ><span style="width: 80%; text-align: center; display: inline-block">{{
          baseData1.remark
        }}</span>
      </div>
    </div>
    <a-divider />
  </div>
</template>
<script lang="ts" setup>
  import { uploadApi } from '/@/api/sys/upload';
  import { PlusOutlined, MinusCircleOutlined } from '@ant-design/icons-vue';
  import { ref, reactive, watch, onMounted, createVNode } from 'vue';
  // import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
  import {
    getDicItem,
    getAutoCode,
    getMesFactoryListByType,
    getMesQbCheckstandardList,
    getMesQbCheckTypeList,
    getMesQbCheckProductList,
    getMesQbCheckMethodList,
  } from '/@/api/mes/common';

  import { getMesQbFinishReport } from '/@/api/mes/mesfinishreport';
  import { getMesQbSemifinReport } from '/@/api/mes/messemifinishreport';
  // import SelectUser from '/@/components/Form/src/components/SelectUser.vue';
  import Upload from '/@/components/Form/src/components/Upload.vue';
  // import { useModal } from '/@/components/Modal';
  import { useMessage } from '/@/hooks/web/useMessage';
  import { useI18n } from '/@/hooks/web/useI18n';
  // import { Modal } from 'ant-design-vue';
  const { notification } = useMessage();
  const { t } = useI18n();
  let props = defineProps(['rowData']);
  const rowData: {
    id: string;
    reportId: string;
    isUpdate: boolean;
    flag: string;
  } = reactive({
    id: '',
    reportId: '',
    isUpdate: false,
    flag: '',
  });
  const columnsProp = {
    mainKey: 'mesQbFinishErrorDetailList',

    columns: [
      { dataIndex: 'index', title: '#' },
      {
        key: 'dabeba3007b241c399397f8ae89efc00',
        title: '工单编号',
        dataIndex: 'workNo',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'work_no',
        },
      },
      {
        key: 'bed7c973cd3f441b9369b9085cd5dd7a',
        title: '物料ID',
        dataIndex: 'materialId',
        componentType: 'Input',
        defaultValue: '',
        show: false,
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'material_id',
        },
      },
      {
        key: 'ecbc6fbab18e4dfaa657459d088d91e3',
        title: '物料编号',
        dataIndex: 'materialNo',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'material_no',
        },
      },
      {
        key: '2f7136e8490b4a97b342bcc936d1a441',
        title: '物料名称',
        dataIndex: 'materialName',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'material_name',
        },
      },
      {
        key: '17cccbb142164484ad4f1ff6e79c773e',
        title: '销售单ID',
        dataIndex: 'saleId',
        componentType: 'Input',
        defaultValue: '',
        show: false,
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'sale_id',
        },
      },
      {
        key: '64c7df03224c4d9a993c090307382670',
        title: '销售订单号',
        dataIndex: 'saleNo',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'sale_no',
        },
      },
      {
        key: 'd8b0e941d0b547629e04d63918c21e92',
        title: '车间',
        dataIndex: 'carId',
        componentType: 'XjrSelect',
        componentProps: {
          width: '100%',
          span: '',
          placeholder: '',
          showLabel: true,
          showSearch: false,
          clearable: false,
          disabled: true,
          staticOptions: [
            { key: 1, label: 'Option 1', value: 'Option 1' },
            { key: 2, label: 'Option 2', value: 'Option 2' },
            { key: 3, label: 'Option 3', value: 'Option 3' },
          ],
          defaultSelect: '',
          datasourceType: 'api',
          params: null,
          labelField: 'label',
          valueField: 'value',
          apiConfig: {
            path: '/mes/mesFactory',
            method: 'GET',
            apiId: '6b4b40b3db664831b709f56bc98a7f04',
            apiParams: [
              {
                key: '1',
                title: 'Query Params',
                tableInfo: [
                  {
                    name: 'factory_type',
                    value: '1',
                    description: null,
                    required: false,
                    dataType: 'String',
                    type: null,
                    defaultValue: null,
                    validateType: null,
                    error: null,
                    expression: null,
                    children: null,
                    bindType: 'value',
                  },
                  {
                    name: 'factory_id',
                    value: '',
                    description: null,
                    required: false,
                    dataType: 'String',
                    type: null,
                    defaultValue: null,
                    validateType: null,
                    error: null,
                    expression: null,
                    children: null,
                    bindType: '',
                  },
                  {
                    name: 'car_id',
                    value: '',
                    description: null,
                    required: false,
                    dataType: 'String',
                    type: null,
                    defaultValue: null,
                    validateType: null,
                    error: null,
                    expression: null,
                    children: null,
                    bindType: '',
                  },
                  {
                    name: 'parent_id',
                    value: '',
                    description: null,
                    required: false,
                    dataType: 'String',
                    type: null,
                    defaultValue: null,
                    validateType: null,
                    error: null,
                    expression: null,
                    children: null,
                    bindType: '',
                  },
                ],
              },
              { key: '2', title: 'Header', tableInfo: [] },
              { key: '3', title: 'Body' },
            ],
            script:
              'var condition="";\r\nif(factory_type!=null&&factory_type!=""){ //0-工厂、1-车间、2产线,3-工位\r\n    condition+=" and factory_type=#{factory_type}";\r\n}\r\nif(factory_id!=null&&factory_id!=""){ \r\n    condition+=" and factory_id=#{factory_id}";\r\n}\r\nif(car_id!=null&&car_id!=""){ \r\n    condition+=" and car_id=#{car_id}";\r\n}\r\nif(parent_id!=null&&parent_id!=""){ \r\n    condition+=" and parent_id=#{parent_id}";\r\n}\r\n\r\nreturn db.select("SELECT id AS `key` ,id AS `value`,CONCAT(factory_name) AS label,t.* FROM mes_base_factory t where 1=1 "+condition)',
          },
          dicOptions: [],
          required: false,
          rules: [],
          events: {},
          prestrainField: 'car_id',
        },
      },
      {
        key: '3016ddefad32472fabd06422b4f605ec',
        title: '基准值',
        dataIndex: 'referenceValue',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'reference_value',
        },
      },
      {
        key: 'd6bc6bfecc1f4da693421b92c14888d3',
        title: '上公差',
        dataIndex: 'upTolerance',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'up_tolerance',
        },
      },
      {
        key: '541a8b3c35ca4b7cbebe35814509d5be',
        title: '下公差',
        dataIndex: 'downTolerance',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'down_tolerance',
        },
      },
      {
        key: '1b304611b4cd426982e531051cc9118e',
        title: '测量值',
        dataIndex: 'measuredValue',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'measured_value',
        },
      },
      {
        key: '34d59d103b2040a2afeee0f92762cd49',
        title: '不良数',
        dataIndex: 'errorNum',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'error_num',
        },
      },
      {
        key: '9cfecdf3f1ad41e887ba8fd79cf403a4',
        title: '不良处理方式',
        dataIndex: 'errorMethod',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'error_method',
        },
      },
      {
        key: '83bc6b1a5a794e3089bbbd1e74e85dc9',
        title: '附件',
        dataIndex: 'imgFile',
        componentType: 'Input',
        defaultValue: '',
        componentProps: {
          width: '100%',
          span: '',
          defaultValue: '',
          placeholder: '',
          maxlength: null,
          prefix: '',
          suffix: '',
          addonBefore: '',
          addonAfter: '',
          disabled: true,
          allowClear: false,
          showLabel: true,
          required: false,
          rules: [],
          events: {},
          prestrainField: 'img_file',
        },
      },
      // { title: '操作', key: 'action', fixed: 'right', width: '50px' },
    ],
    span: '24',
    preloadType: 'api',
    apiConfig: {
      path: '/mes/getFinishDetailList',
      method: 'GET',
      apiId: 'copy1691475380638d69749',
      apiParams: [
        {
          key: '1',
          title: 'Query Params',
          tableInfo: [
            {
              name: 'keyword',
              value: null,
              description: null,
              required: false,
              dataType: 'String',
              type: null,
              defaultValue: null,
              validateType: null,
              error: null,
              expression: null,
              children: null,
              bindType: '',
            },
            {
              name: 'showLabel',
              value: '',
              description: '回显字段',
              required: false,
              dataType: 'String',
              type: null,
              defaultValue: 'code',
              validateType: null,
              error: null,
              expression: null,
              children: null,
              bindType: '',
            },
            {
              name: 'queryType',
              value: null,
              description: '查询类型',
              required: false,
              dataType: 'String',
              type: null,
              defaultValue: null,
              validateType: null,
              error: null,
              expression: null,
              children: null,
              bindType: '',
            },
            {
              name: 'report_id',
              value: 'report_id',
              description: '报告ID',
              required: false,
              dataType: 'String',
              type: null,
              defaultValue: null,
              validateType: null,
              error: null,
              expression: null,
              children: null,
              bindType: 'data',
            },
          ],
        },
        { key: '2', title: 'Header', tableInfo: [] },
        { key: '3', title: 'Body' },
      ],
      script:
        'var condition="";\r\nif(report_id!=null&&report_id!=""){ \r\n    condition+=" and report_id=#{report_id}";\r\n}\r\nreturn db.select("SELECT t.id AS `key` ,t.id AS `value`,t.work_no AS label,t.* FROM mes_qb_finish_detail t where 1=1  "+condition)',
      outputParams: [
        { tableTitle: '工单编号', name: 'work_no' },
        { tableTitle: '物料编号', name: 'material_no' },
        { tableTitle: '物料名称', name: 'material_name' },
        { tableTitle: '销售订单号', name: 'sale_no' },
        { tableTitle: '测量值', name: 'measured_value' },
        { tableTitle: '不良数', name: 'error_num' },
        { tableTitle: '不良处理方式', name: 'error_method' },
      ],
    },
    itemId: '',
    dicOptions: [],
    useSelectButton: true,
    useAddButton: false, //不显示新增按钮
    buttonName: '选择',
    showLabel: true,
    showComponentBorder: true,
    showFormBorder: true,
    showIndex: false,
    multipleHeads: [],
  };
  const detailList = ref<any[]>([]);
  // const format = ref('YYYY-MM-DD HH:mm:ss');
  const multipleDialog = ref<boolean>(false);
  function filterColum(column) {
    return column.filter((o) => {
      return o.show == false ? false : true;
    });
  }
  const renderSubFormList = async (list) => {
    // detailList.value = [];
    list?.forEach((x) => {
      const dataObj = {};
      columnsProp.columns?.map((item) => {
        if (!item?.dataIndex) return;
        dataObj[item.dataIndex as string] = item.componentProps?.prestrainField
          ? x[item.componentProps.prestrainField]
          : null;
      });

      //判断是否存在。
      let exist = false;
      detailList.value.forEach((e) => {
        // console.log(JSON.stringify(e), JSON.stringify(dataObj));
        if (JSON.stringify(e) == JSON.stringify(dataObj)) exist = true;
      });
      if (!exist) detailList.value.push(dataObj);
    });
  };
  const removeList = (index) => {
    detailList.value.splice(index, 1);
  };
  const baseData1 = ref<any>({});
  const formData = ref<any>({
    reportId: '',
    reportNo: '',
    errorNo: '',
    reportName: '',
    isSysNum: '',
    isSysNumBoolean: true,
    disJudge: '',
    errorLevel: '',
    remark: '',
    judgeResult: '',
  });

  const emit = defineEmits(['cancel', 'success']);
  const formRef = ref();
  onMounted(async () => {
    rowData.id = props.rowData.id;
    rowData.flag = props.rowData.flag;
    console.log('row===', rowData);
    columnsProp.apiConfig.path = '/mes/getFinishDetailList?report_id=' + rowData.reportId;
    getDetailData();

    errorLevelOptions.value = await getDicItem('1688808042268565506');
    disJudgeOptions.value = await getDicItem('1688808244736008194');

    carIdOptions.value = await getMesFactoryListByType(1, '');
    checkTypeOptions.value = await getMesQbCheckTypeList();
    checkMethodOptions.value = await getMesQbCheckMethodList();
    checkProductOptions.value = await getMesQbCheckProductList();
    judgeResultOptions.value = await getMesQbCheckstandardList();
  });

  watch(
    () => props.rowData,
    (val) => {
      console.log('监听', val);
      if (val) {
        rowData.id = props.rowData.id;
        rowData.reportId = props.rowData.reportId;
        rowData.isUpdate = props.rowData.isUpdate;
        rowData.flag = props.rowData.flag;
        getDetailData();
      }
    },
  );
  const errorLevelOptions = ref<any[]>([]);
  const judgeResultOptions = ref<any[]>([]);
  const disJudgeOptions = ref<any[]>([]);
  const checkProductOptions = ref<any[]>([]);
  const carIdOptions = ref<any[]>([]);
  const checkTypeOptions = ref<any[]>([]);
  const checkMethodOptions = ref<any[]>([]);

  const getDetailData = async () => {
    if (rowData.flag == '成品') {
      const data = await getMesQbFinishReport(rowData.id);
      baseData1.value = data;
      detailList.value = data.mesQbFinishDetailList;
    }
    if (rowData.flag == '半成品') {
      const data = await getMesQbSemifinReport(rowData.id);
      baseData1.value = data;
      detailList.value = data.mesQbSemifinDetailList;
    }
  };

  function handleClose() {
    emit('cancel');
  }
</script>

<style lang="less" scoped>
  .padding {
    padding: 12px;
  }

  .back_color {
    background-color: hsl(0, 0%, 98%);
    position: relative;
  }

  .marginTop {
    margin-top: 12px;
  }
</style>
