inl-ui 0.0.50 → 0.0.52

package/src/pageComponent/views/pssRecord/components/Info.tsx

@@ -1,223 +1,223 @@
-import {
-  defineComponent,
-  onMounted,
-  nextTick,
-  ref,
-  shallowRef,
-  reactive,
-  watch,
-} from "vue";
-import { Row, Col, Timeline, TimelineItem, Input } from "ant-design-vue";
-const { TextArea } = Input;
-import { CheckOutlined } from "@ant-design/icons-vue";
-
-import dayjs, { Dayjs } from "dayjs";
-
-import pssApi from "@/api/pss";
-
-const Format = "YYYY-MM-DD HH:mm";
-
-export default defineComponent({
-  props: {
-    detail: {
-      type: Object,
-      default: () => {},
-    },
-    showInfo: {
-      type: Boolean,
-      default: false,
-    },
-  },
-
-  emits: ["update:showInfo"],
-
-  setup(props, context) {
-    const getUserInfo = () => {
-      return (
-        sessionStorage.getItem("userinfo") &&
-        JSON.parse(sessionStorage.getItem("userinfo") as any)
-      );
-    };
-
-    const dataObj: any = ref({});
-
-    // 我发起的
-    const getStartByMe = async () => {
-      const { data } = await pssApi.doneDetail({
-        id: props.detail.taskId,
-        name: props.detail.taskName,
-        processInstanceId: props.detail.processInstanceId,
-        taskDefinitionKey: props.detail.taskDefKey,
-        taskFlag: props.detail.taskFlag,
-        taskStatus: props.detail.taskStatus,
-        properties: {
-          startTime: props.detail.applyDt,
-          stopTime: props.detail.planStopPowerDt,
-          supplyTime: props.detail.planSupplyPowerDt,
-          applyuserId: props.detail.applyUserId,
-          equipmentId: props.detail.equipId,
-          loopIds: props.detail.loops.map((lo: any) => lo.id),
-          busId: "spms",
-          processId: props.detail.supplyTypeCode,
-          processName: props.detail.supplyTypeName,
-          corpId: sessionStorage.getItem("corpId") || getUserInfo()?.corpId,
-          reason: props.detail.applyReason,
-        },
-      });
-
-      dataObj.value = data;
-    };
-
-    // 查询回路挂锁列表
-    const getLockLoop = () => {
-      dataObj.value.loopVOs.forEach(async (loopVo: any) => {
-        if (loopVo.loop.id) {
-          const { data } = await pssApi.findlockLoop(loopVo.loop.id);
-          loopVo.loop.list = data;
-        }
-      });
-    };
-
-    const getData = async () => {
-      await getStartByMe();
-
-      getLockLoop();
-    };
-
-    watch(
-      () => props.showInfo,
-      (nval, oval) => {
-        if (nval) {
-          getData();
-        }
-      }
-    );
-
-    const close = () => {
-      context.emit("update:showInfo", false);
-    };
-
-    return () => (
-      <div class="pssRecordInfo">
-        <a-modal
-          v-model={[props.showInfo, "visible"]}
-          title="记录表/详情"
-          wrapClassName="pssRecordInfoModal"
-          maskStyle={{ position: "absolute" }}
-          getContainer={() => document.getElementById("pssRecord")}
-          onCancel={close}
-          footer={null}
-        >
-          <div class="info_container">
-            <div class="content">
-              <div class="content_title" style="margin-top: 0">
-                申请{dataObj.value.supplyTypeName}
-                <span>{dataObj.value.applyUserName}</span>
-                <span>创建于{dayjs(dataObj.value.applyDt).format(Format)}</span>
-              </div>
-              <div class="content_info">
-                <Row gutter={24}>
-                  <Col span={8}>
-                    <div class="label">当前状态:</div>
-                    {dataObj.value.taskStatus && (
-                      <div class={["stateNode", dataObj.value.taskFlag]}>
-                        {dataObj.value.taskStatus}
-                      </div>
-                    )}
-                  </Col>
-                  <Col span={8}>
-                    <div class="label">设备名称:</div>
-                    <div class="value">{dataObj.value.equipName}</div>
-                  </Col>
-                  <Col span={8}>
-                    {dataObj.value.supplyTypeCode !== "supplyPower" &&
-                      dataObj.value.planStopPowerDt && (
-                        <>
-                          <div class="label">计划停电时间:</div>
-                          <div class="value">
-                            {dayjs(dataObj.value.planStopPowerDt).format(
-                              Format
-                            )}
-                          </div>
-                        </>
-                      )}
-                  </Col>
-                  <Col span={8}>
-                    <div class="label">任务编号:</div>
-                    <div class="value">{dataObj.value.processInstanceId}</div>
-                  </Col>
-                  <Col span={8}>
-                    <div class="label">停电原因:</div>
-                    <div class="value"> {dataObj.value.applyReason}</div>
-                  </Col>
-
-                  <Col span={8}>
-                    {dataObj.value.supplyTypeCode !== "stopPower" &&
-                      dataObj.value.planSupplyPowerDt && (
-                        <>
-                          <div class="label">计划送电时间:</div>
-                          <div class="value">
-                            {dayjs(dataObj.value.planSupplyPowerDt).format(
-                              Format
-                            )}
-                          </div>
-                        </>
-                      )}
-                  </Col>
-                </Row>
-              </div>
-
-              <div class="content_title">
-                控制回路 ({dataObj.value?.loopVOs?.length})
-              </div>
-              <div class="loopBox flex">
-                {dataObj.value?.loopVOs?.map((loopVo: any, index: number) => (
-                  <div class="loopTitle">{loopVo.loop.name}</div>
-                ))}
-              </div>
-
-              <div class="content_title">工单流程</div>
-              <div class="timeLine">
-                <Timeline>
-                  {dataObj.value?.process?.map((pro: any, index: number) => (
-                    <TimelineItem
-                      dot={
-                        dataObj.value?.process?.length - 1 === index ? (
-                          <div class="complate">
-                            <CheckOutlined />
-                          </div>
-                        ) : (
-                          <div class="active">
-                            <span></span>
-                          </div>
-                        )
-                      }
-                    >
-                      <div class="content flex">
-                        <div
-                          class={[
-                            "label",
-                            dataObj.value?.process?.length - 1 === index
-                              ? "timeLineActive"
-                              : "",
-                          ]}
-                        >
-                          <div>{pro.activityName}</div>
-                          <div>{pro.assigneeName || "-"}</div>
-                          <div>{pro.comments}</div>
-                        </div>
-                        <div class="time">
-                          {pro.endTime && dayjs(pro.endTime).format(Format)}
-                        </div>
-                      </div>
-                    </TimelineItem>
-                  ))}
-                </Timeline>
-              </div>
-            </div>
-          </div>
-        </a-modal>
-      </div>
-    );
-  },
-});
+import {
+  defineComponent,
+  onMounted,
+  nextTick,
+  ref,
+  shallowRef,
+  reactive,
+  watch,
+} from "vue";
+import { Row, Col, Timeline, TimelineItem, Input } from "ant-design-vue";
+const { TextArea } = Input;
+import { CheckOutlined } from "@ant-design/icons-vue";
+
+import dayjs, { Dayjs } from "dayjs";
+
+import pssApi from "@/api/pss";
+
+const Format = "YYYY-MM-DD HH:mm";
+
+export default defineComponent({
+  props: {
+    detail: {
+      type: Object,
+      default: () => {},
+    },
+    showInfo: {
+      type: Boolean,
+      default: false,
+    },
+  },
+
+  emits: ["update:showInfo"],
+
+  setup(props, context) {
+    const getUserInfo = () => {
+      return (
+        sessionStorage.getItem("userinfo") &&
+        JSON.parse(sessionStorage.getItem("userinfo") as any)
+      );
+    };
+
+    const dataObj: any = ref({});
+
+    // 我发起的
+    const getStartByMe = async () => {
+      const { data } = await pssApi.doneDetail({
+        id: props.detail.taskId,
+        name: props.detail.taskName,
+        processInstanceId: props.detail.processInstanceId,
+        taskDefinitionKey: props.detail.taskDefKey,
+        taskFlag: props.detail.taskFlag,
+        taskStatus: props.detail.taskStatus,
+        properties: {
+          startTime: props.detail.applyDt,
+          stopTime: props.detail.planStopPowerDt,
+          supplyTime: props.detail.planSupplyPowerDt,
+          applyuserId: props.detail.applyUserId,
+          equipmentId: props.detail.equipId,
+          loopIds: props.detail.loops.map((lo: any) => lo.id),
+          busId: "spms",
+          processId: props.detail.supplyTypeCode,
+          processName: props.detail.supplyTypeName,
+          corpId: sessionStorage.getItem("corpId") || getUserInfo()?.corpId,
+          reason: props.detail.applyReason,
+        },
+      });
+
+      dataObj.value = data;
+    };
+
+    // 查询回路挂锁列表
+    const getLockLoop = () => {
+      dataObj.value.loopVOs.forEach(async (loopVo: any) => {
+        if (loopVo.loop.id) {
+          const { data } = await pssApi.findlockLoop(loopVo.loop.id);
+          loopVo.loop.list = data;
+        }
+      });
+    };
+
+    const getData = async () => {
+      await getStartByMe();
+
+      getLockLoop();
+    };
+
+    watch(
+      () => props.showInfo,
+      (nval, oval) => {
+        if (nval) {
+          getData();
+        }
+      }
+    );
+
+    const close = () => {
+      context.emit("update:showInfo", false);
+    };
+
+    return () => (
+      <div class="pssRecordInfo">
+        <a-modal
+          v-model={[props.showInfo, "visible"]}
+          title="记录表/详情"
+          wrapClassName="pssRecordInfoModal"
+          maskStyle={{ position: "absolute" }}
+          getContainer={() => document.getElementById("pssRecord")}
+          onCancel={close}
+          footer={null}
+        >
+          <div class="info_container">
+            <div class="content">
+              <div class="content_title" style="margin-top: 0">
+                申请{dataObj.value.supplyTypeName}
+                <span>{dataObj.value.applyUserName}</span>
+                <span>创建于{dayjs(dataObj.value.applyDt).format(Format)}</span>
+              </div>
+              <div class="content_info">
+                <Row gutter={24}>
+                  <Col span={8}>
+                    <div class="label">当前状态:</div>
+                    {dataObj.value.taskStatus && (
+                      <div class={["stateNode", dataObj.value.taskFlag]}>
+                        {dataObj.value.taskStatus}
+                      </div>
+                    )}
+                  </Col>
+                  <Col span={8}>
+                    <div class="label">设备名称:</div>
+                    <div class="value">{dataObj.value.equipName}</div>
+                  </Col>
+                  <Col span={8}>
+                    {dataObj.value.supplyTypeCode !== "supplyPower" &&
+                      dataObj.value.planStopPowerDt && (
+                        <>
+                          <div class="label">计划停电时间:</div>
+                          <div class="value">
+                            {dayjs(dataObj.value.planStopPowerDt).format(
+                              Format
+                            )}
+                          </div>
+                        </>
+                      )}
+                  </Col>
+                  <Col span={8}>
+                    <div class="label">任务编号:</div>
+                    <div class="value">{dataObj.value.processInstanceId}</div>
+                  </Col>
+                  <Col span={8}>
+                    <div class="label">停电原因:</div>
+                    <div class="value"> {dataObj.value.applyReason}</div>
+                  </Col>
+
+                  <Col span={8}>
+                    {dataObj.value.supplyTypeCode !== "stopPower" &&
+                      dataObj.value.planSupplyPowerDt && (
+                        <>
+                          <div class="label">计划送电时间:</div>
+                          <div class="value">
+                            {dayjs(dataObj.value.planSupplyPowerDt).format(
+                              Format
+                            )}
+                          </div>
+                        </>
+                      )}
+                  </Col>
+                </Row>
+              </div>
+
+              <div class="content_title">
+                控制回路 ({dataObj.value?.loopVOs?.length})
+              </div>
+              <div class="loopBox flex">
+                {dataObj.value?.loopVOs?.map((loopVo: any, index: number) => (
+                  <div class="loopTitle">{loopVo.loop.name}</div>
+                ))}
+              </div>
+
+              <div class="content_title">工单流程</div>
+              <div class="timeLine">
+                <Timeline>
+                  {dataObj.value?.process?.map((pro: any, index: number) => (
+                    <TimelineItem
+                      dot={
+                        dataObj.value?.process?.length - 1 === index ? (
+                          <div class="complate">
+                            <CheckOutlined />
+                          </div>
+                        ) : (
+                          <div class="active">
+                            <span></span>
+                          </div>
+                        )
+                      }
+                    >
+                      <div class="content flex">
+                        <div
+                          class={[
+                            "label",
+                            dataObj.value?.process?.length - 1 === index
+                              ? "timeLineActive"
+                              : "",
+                          ]}
+                        >
+                          <div>{pro.activityName}</div>
+                          <div>{pro.assigneeName || "-"}</div>
+                          <div>{pro.comments}</div>
+                        </div>
+                        <div class="time">
+                          {pro.endTime && dayjs(pro.endTime).format(Format)}
+                        </div>
+                      </div>
+                    </TimelineItem>
+                  ))}
+                </Timeline>
+              </div>
+            </div>
+          </div>
+        </a-modal>
+      </div>
+    );
+  },
+});