<template>
  <BasicModal
    v-bind="$attrs"
    :title="title"
    @register="registerInnerModal"
    @ok="handleSubmit"
    :width="1000"
  >
    <div style="width: 100%; text-align: center; font-size: 20px">无感化维保考核报告</div>

    <Descriptions title="维保信息" bordered :column="{ xxl: 1, xl: 2, lg: 2, md: 2, sm: 2, xs: 1 }">
      <DescriptionsItem label="电梯名称"> {{ workInfo.elevatorName || '' }}</DescriptionsItem>
      <DescriptionsItem label="维保单位">{{ workInfo.maintenance || '' }}</DescriptionsItem>
      <DescriptionsItem label="维保类型">
        <span @click="handleViewTable(workInfo.planType)" style="color: #1677ff; cursor: pointer">{{
          filterPlan(workInfo.planType)
        }}</span>
      </DescriptionsItem>
      <DescriptionsItem label="维保日期">{{ workInfo.expectTime || '' }}</DescriptionsItem>
      <DescriptionsItem label="设备注册代码">{{ workInfo.registerCode || '' }}</DescriptionsItem>
      <DescriptionsItem label="维保结果"
        ><span style="color: #1677ff">{{
          filterResult(audioInfo.maintenanceAudit)
        }}</span></DescriptionsItem
      >
      <DescriptionsItem label="	维保用时">{{
        workInfo.maintenanceTime || '暂无时间'
      }}</DescriptionsItem>
    </Descriptions>

    <div style="width: 100%; text-align: left; font-size: 16px; font-weight: bolder; margin: 16px 0"
      >维保考核表</div
    >
    <Table :columns="columns" :pagination="false" :data-source="data" bordered>
      <template #bodyCell="{ column, record }">
        <template v-if="column.dataIndex === 'name'">
          <a href="javascript:;">{{ record.name }}</a>
        </template>
        <template v-if="column.dataIndex === 'phone'">
          <div v-if="record.type1">
            <div
              >开始时间:<span style="color: #1677ff">{{ audioInfo.arriveTime || '-' }}</span>
            </div>
            <div
              >结束时间:<span style="color: #1677ff">{{ audioInfo.finishTime || '-' }}</span>
            </div>
          </div>
          <div v-if="record.type2">
            <div
              >维保人员:<span style="color: #1677ff">{{ workerInfoAdd.operator || '-' }}</span></div
            >
            <div
              >协同人员:<span style="color: #1677ff">{{ audioInfo.collaborator || '-' }}</span></div
            >
          </div>
          <div v-if="record.type3">
            <div
              >电梯与人员距离:<span style="color: #1677ff"
                >{{ workerInfoAdd.distance || '-' }}m</span
              ></div
            ></div
          >
          <div v-if="record.type10 && workInfo.signRecord">
            <Image
              v-for="(item, index) in workInfo.signRecord.split(',')"
              :key="index"
              style="width: 120px; height: 60px"
              :src="item"
            />
          </div>
          <div v-if="record.type4">
            <Image style="width: 120px; height: 60px" :src="workInfo.cabinAttachment" />
          </div>
          <div v-if="record.type5">
            <Image style="width: 120px; height: 60px" :src="workInfo.doorAttachment" />
          </div>
          <div v-if="record.type9">
            <Image style="width: 120px; height: 60px" :src="workInfo.carRoofAttachment" />
          </div>
          <div v-if="record.type6">
            <Image style="width: 120px; height: 60px" :src="workInfo.channelAttachment" />
          </div>
          <div v-if="record.type7">
            <Image style="width: 120px; height: 60px" :src="workInfo.pitAttachment" />
          </div>
          <div v-if="record.type8">
            <Image style="width: 120px; height: 60px" :src="workInfo.machineRoomAttachment" />
          </div>
        </template>
      </template>
    </Table>
    <div style="display: flex">
      <div
        style="
          width: 155px;
          height: 60px;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          color: #1677ff;
        "
        >考核结果</div
      >
      <div
        style="
          width: 155px;
          height: 60px;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          color: #1677ff;
        "
      >
        <div v-if="typeof audioInfo.maintenanceAudit != 'number'">
          <Button type="primary" @click="handleResult(1)">通过</Button>
          <Button style="margin-left: 16px" @click="handleResult(0)">不通过</Button>
        </div>
        <div v-else>
          <img
            v-if="!audioInfo.maintenanceAudit"
            style="width: 50px; height: 50px"
            src="https://minio.hbrja.com/elevator/2024/12/31/229605d795a640fe98b156547ce6d86e.png"
            alt=""
          />
          <img
            v-else
            style="width: 50px; height: 50px"
            src="https://minio.hbrja.com/elevator/2024/12/31/520f56890059439682fb01a00de1057a.png"
            alt=""
          />
        </div>
      </div>
    </div>
  </BasicModal>
  <Modal v-model:open="open" title="维保工作表" :footer="null" :width="1200">
    <Tabs v-model:activeKey="activeKey">
      <TabPane key="1" tab="轿厢">
        <Descriptions title="" bordered :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }">
          <DescriptionsItem label="轿厢照明、风扇、应急照明">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.fanLightState)}} </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="轿厢检修开关、停止装置">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.switchDeviceState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="轿内报警装置、对讲系统">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.switchDeviceState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="轿内显示、指令按钮、IC卡系统">
            <div class="full-widths flex-space">
              <div>齐全、有效</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.displayButtonCardState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="轿门防撞击保护装置（安全触板，光幕、光电等）">
            <div class="full-widths flex-space">
              <div>功能有效</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.protectorState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="轿门门锁电气触点">
            <div class="full-widths flex-space">
              <div>清洁，触点接触良好，接线可靠</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.doorLockContactState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="轿门运行">
            <div class="full-widths flex-space">
              <div>开启和关闭工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.doorOperationStete)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="轿厢平层准确度">
            <div class="full-widths flex-space">
              <div>符合标准值</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.levelingAccuracyState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层站召唤、层楼显示">
            <div class="full-widths flex-space">
              <div>齐全、有效</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.callDisplayState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门地坎">
            <div class="full-widths flex-space">
              <div>清洁</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.landingSillsState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门自动关门装置">
            <div class="full-widths flex-space">
              <div>正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.autoCloseState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门门锁自动复位">
            <div class="full-widths flex-space">
              <div>用层门钥匙打开手动开锁装置释放后，层门门锁能自动复位</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.doorLockResetState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门门锁电气触点">
            <div class="full-widths flex-space">
              <div>清洁，触点接触良好，接线可靠</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.electricalContactState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门锁紧元件啮合长度">
            <div class="full-widths flex-space">
              <div>不小于7mm</div>
              <div class="c-1677ff">{{filterState(audioInfo.elevatorCabin.componentLengthState)}}  </div>
            </div>
          </DescriptionsItem>
        </Descriptions>
      </TabPane>
      <TabPane key="2" tab="轿顶" force-render>
        <Descriptions title="" bordered :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }">
          <DescriptionsItem label="轿顶">
            <div class="full-widths flex-space">
              <div>清洁，防护栏安全可靠</div>
              <div class="c-1677ff">{{filterState(audioInfo.carRoof.carRoofState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="轿顶检修开关、停止装置">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.carRoof.overhaulSwitchState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="导靴上油杯">
            <div class="full-widths flex-space">
              <div>吸油毛毡齐全，油量适宜，油杯无泄漏</div>
              <div class="c-1677ff">{{filterState(audioInfo.carRoof.guideShoeState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="对重/平衡重块及其压板">
            <div class="full-widths flex-space">
              <div>对重/平衡重块无松动，压板紧固</div>
              <div class="c-1677ff">{{filterState(audioInfo.carRoof.pressingPlateState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="井道照明">
            <div class="full-widths flex-space">
              <div>齐全、正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.carRoof.wellLightingState)}}  </div>
            </div></DescriptionsItem
          >
        </Descriptions>
      </TabPane>
      <TabPane key="3" tab="机房">
        <Descriptions title="" bordered :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }">
          <DescriptionsItem label="机房、滑轮间环境">
            <div class="full-widths flex-space">
              <div>清洁，门窗完好、照明正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.environmentState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="手动紧急操作装置">
            <div class="full-widths flex-space">
              <div>齐全，在指定位置</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.emergencyOperationState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="驱动主机">
            <div class="full-widths flex-space">
              <div>运行时无异常振动和异常声响</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.driveHostState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="制动器各销轴部位">
            <div class="full-widths flex-space">
              <div>动作灵活</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.brakeShaftState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="制动器间隙">
            <div class="full-widths flex-space">
              <div>打开时制动衬与制动轮不应发生摩擦，间隙值符合制造单位要求
              </div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.brakeClearanceState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="制动器作为轿厢意外移动保护装置制停子系统时的自监测">
            <div class="full-widths flex-space">
              <div>制动力人工方式检测符合使用维护说明书要 求；制动力自监测系统有记录</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.shutdownSubsystemState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="编码器">
            <div class="full-widths flex-space">
              <div>清洁，安装牢固</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.encoderState)}}  </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="限速器各销轴部位">
            <div class="full-widths flex-space">
              <div>润滑，转动灵活；电气开关正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.speedLimiterState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="层门和轿门旁路装置">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.bypassDeviceState)}}  </div>
            </div>
          </DescriptionsItem>
          <DescriptionsItem label="紧急电动运行">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.machineRoom.emergencyElectricalOperationState)}}  </div>
            </div>
          </DescriptionsItem>
         
         
        </Descriptions>

      </TabPane>
      <TabPane key="4" tab="底坑">
        <Descriptions title="" bordered :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }">
          <DescriptionsItem label="底坑环境">
            <div class="full-widths flex-space">
              <div>清洁，无渗水、积水，照明正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.workPit.environmentState)}} </div>
            </div></DescriptionsItem
          >
          <DescriptionsItem label="底坑停止装置">
            <div class="full-widths flex-space">
              <div>工作正常</div>
              <div class="c-1677ff">{{filterState(audioInfo.workPit.stopFeatureState)}} </div>
            </div>
          </DescriptionsItem>
 
        </Descriptions>
      </TabPane>
    </Tabs>
  </Modal>
</template>
  
  <script setup lang="ts">
import { BasicModal, useModalInner } from '@/components/Modal';
import { BasicTable, useTable, TableAction } from '@/components/Table';
import { computed, onMounted, ref, unref } from 'vue';
import { infoList } from '@/api/basicInfo/elevator';
import { formEvaSchemas, evaColumns, modalEvaSchemas } from './workData.data';
import { BasicForm, useForm } from '@/components/Form';
import { useMessage } from '@/hooks/web/useMessage';

import { workDataDistribute, workDataInfo, workAudiooUpdate } from '@/api/workPlace/workInfo';
import {
  Descriptions,
  DescriptionsItem,
  Table,
  TableSummary,
  TableSummaryCell,
  TableSummaryRow,
  Image,
  Button,
  Modal,
  Tabs,
  TabPane,
} from 'ant-design-vue';
import type { TableColumnType } from 'ant-design-vue';

defineOptions({ name: 'WorkDataModal' });
const { createMessage } = useMessage();
const emit = defineEmits(['register', 'reload']);
const tableRefs = ref<any>(null);
const isUpdate = ref<number>(1);
const open = ref<boolean>(false);
const title = computed<string>(() => {
  return '维保考核';
});
const sharedOnCell = (_, index) => {
  if (index === 9) {
    return { colSpan: 0 };
  }
};
const activeKey = ref('1');
const workInfo = ref<any>({});
const audioInfo = ref<any>({});
const workerInfoAdd = ref<any>({});
const data = [
  {
    key: '1',
    name: '维保时间的合理性',
    age: '维保时间不得低于30分钟，根据系统记录的维保开始时间和结束时间确定。',
    type1: 1,
    phone: 'time',
  },
  {
    key: '2',
    name: '维保人员的合理性',
    type2: 2,
    phone: 'klklkk',
    age: '通过APP打卡人数及机房人数感应来确定，合理维保人员数量为2人。',
  },
  {
    key: '3',
    name: '维保人员位置的合理性',
    age: '通过APP打卡位置确定维保人员的位置，维保人员的合理位置距离电梯100米以内。',
    type3: 3,
    phone: 18900010002,
  },
  {
    key: '10',
    name: '维保人员签名',
    age: '展示维保人员维保过后的签名',
    type10: 10,
    phone: 18900010002,
  },
  {
    key: '4',
    name: '轿厢附件',
    age: '轿厢的图片和视频展示',
    type4: 4,
    phone: 18900010002,
  },
  {
    key: '5',
    name: '轿顶附件',
    age: '轿顶的图片和视频展示',
    type9: 9,
    phone: 18900010002,
  },
  {
    key: '6',
    name: '轿门附件',
    age: '轿门的图片和视频展示',
    type5: 5,
    phone: 18900010002,
  },
  {
    key: '7',
    name: '井道附件',
    age: '井道的图片和视频展示',
    type6: 6,
    phone: 18900010002,
  },
  {
    key: '8',
    name: '底坑附件',
    age: '底坑的图片和视频展示',
    type7: 7,
    phone: 18900010002,
  },
  {
    key: '9',
    name: '机房附件',
    age: '机房的图片和视频展示',
    type8: 8,
    phone: 18900010002,
  },
];

const columns: TableColumnType[] = [
  {
    title: '考核内容',
    dataIndex: 'name',
    align: 'center',
  },
  {
    title: '考核依据',
    dataIndex: 'age',
  },
  // {
  //   title: '考核结果',
  //   colSpan: 1,
  //   dataIndex: 'tel',
  // },
  {
    title: '验证记录或视图资料',
    colSpan: 2,
    dataIndex: 'phone',
    width: 300,
  },
];
const [registerTable, { getSelectRows }] = useTable({
  rowSelection: {
    type: 'checkbox',
  },
  title: '电梯列表',
  showTableSetting: false,
  api: infoList,
  showIndexColumn: true,
  rowKey: 'id',
  useSearchForm: true,
  formConfig: {
    schemas: formEvaSchemas,
    baseColProps: {
      xs: 24,
      sm: 24,
      md: 24,
      lg: 15,
    },
  },
  columns: evaColumns,
  // 需要添加上部门参数
});

const [registerInnerModal, { modalLoading, closeModal }] = useModalInner(
  async (data: { record?: Recordable; update: number }) => {
    modalLoading(true);
    const { record, update } = data;
    isUpdate.value = update;
    workInfo.value = record;
    console.log(workInfo.value);
    getWorkInfoo();
    modalLoading(false);
  },
);
const getWorkInfoo = () => {
  workDataInfo(workInfo.value.id).then((res: any) => {
    console.log(res);
    audioInfo.value = res;
    workerInfoAdd.value = res.operationRecords
      ? res.operationRecords.filter((item) => item.operationState == 3)[0]
      : {};
  });
};
const planMap = ref<any>({
  1: '半月维保',
  2: '季度维保',
  3: '半年维保',
  4: '年度维保',
});
const resultMap = ref<any>({
  0: '不合格',
  1: '合格',
});
const statesMap = ref<any>({
  1: '正常',
  2: '润滑',
  3: '调整',
  4: '更换',
  5: '异常待修复',
  6: '无此项',
})
const filterPlan = (data: any) => {
  if (!data) {
    return '暂无类型';
  }
  return planMap.value[data];
};
const filterState = (data: any) => {

  if (data==='null'||typeof(data)=='object') {
    return '-';
  }
  return statesMap.value[data];
};
const filterResult = (data: any) => {
  if (typeof data != 'number') {
    return '未考核';
  }
  return resultMap.value[data];
};
const handleViewTable = (data:any) => {
  console.log(data,'any')

  if(data=='null'||typeof(data)=='object'){
    createMessage.info('当前暂无维保工作数据');
    return
  }
  open.value = true;
};
const handleResult = (res: any) => {
  workAudiooUpdate({ id: workInfo.value.id, maintenanceAudit: res }).then((re) => {
    // closeModal();
    getWorkInfoo();
  });
};
const [registerForm, { setFieldsValue, resetForm, validate }] = useForm({
  labelWidth: 100,
  showActionButtonGroup: false,
  baseColProps: { span: 24 },
  schemas: modalEvaSchemas,
});
async function handleSubmit() {
  try {
    emit('reload');
    closeModal();
  } catch (e) {
    console.warn(e);
  } finally {
    modalLoading(false);
  }
}
</script>
  
  <style scoped>
.full-widths {
  width: 100%;
}
.flex-space {
  display: flex;
  justify-content: space-between;
}
.c-1677ff {
  color: #1677ff;
}
.c-red{color:red}
</style>
  