inl-ui 0.0.37 → 0.0.39

package/src/pageComponent/views/workforceManager/workforceRule/components/classManager.tsx

@@ -1,380 +1,380 @@
-import { defineComponent, ref } from "vue";
-import { message, Modal } from "ant-design-vue";
-
-import useTableList from "@/pageComponent/hooks/useTableList";
-import workforceApi from "@/api/workforceManager";
-
-import "../assets/classManager.less";
-
-const columns = [
-  {
-    title: "班制编码",
-    dataIndex: "code",
-    key: "code",
-  },
-  {
-    title: "班制名称",
-    dataIndex: "name",
-    key: "name",
-  },
-  {
-    title: "班次数量",
-    dataIndex: "infoCount",
-    key: "infoCount",
-  },
-  {
-    title: "最后修改人",
-    dataIndex: "updateUser",
-    key: "updateUser",
-  },
-  {
-    title: "最后修改时间",
-    dataIndex: "updateDt",
-    key: "updateDt",
-  },
-  {
-    title: "操作",
-    dataIndex: "operation",
-  },
-];
-
-const shiftDutyList = [
-  { key: 1, name: "检修班" },
-  { key: 2, name: "生产班" },
-];
-
-const countShiftTypeList = [
-  { key: 1, name: "按前一天统计" },
-  { key: 2, name: "按当天统计" },
-];
-
-export default defineComponent({
-  setup() {
-    // table
-    const {
-      currPage,
-      isLoading,
-      refresh,
-      tableList,
-      handlePageChange,
-      total,
-      hanldePageSizeChange,
-      pageSize,
-    } = useTableList(
-      () =>
-        workforceApi.getClassList({
-          currentPage: currPage.value,
-          pageSize: pageSize.value,
-        }),
-      "rows",
-      "total"
-    );
-
-    refresh();
-
-    const userinfo = JSON.parse(sessionStorage.getItem("userinfo") as string);
-
-    let cls = {
-      name: "", // 班次名称
-      shiftDuty: null, // 班次职能：1-检修班 2-生产班
-      startTime: "", // 起始时间
-      endTime: "", // 结束时间
-      shiftSort: 1, //排序
-    };
-
-    const formState = ref({
-      name: "",
-      countShiftType: null,
-      createUser: userinfo.userName,
-      // code: '',
-      infos: [{ ...cls }],
-    } as any);
-
-    const visible = ref(false);
-    const isAdd = ref();
-    const handleOk = async () => {
-      await formRef.value.validateFields();
-
-      if (isAdd.value) {
-        //新增
-        const resp = await workforceApi.classAdd(formState.value);
-        if (resp.data) {
-          message.success("保存成功！");
-          handleCancel();
-          refresh();
-        }
-      } else {
-        // 编辑
-        const resp = await workforceApi.classEdit(
-          formState.value.id,
-          formState.value
-        );
-        message.success("保存成功！");
-        handleCancel();
-        refresh();
-      }
-    };
-    const handleCancel = () => {
-      visible.value = false;
-      formRef.value.resetFields();
-      formState.value = {
-        name: "",
-        countShiftType: null,
-        infos: [{ ...cls }],
-      };
-    };
-
-    const handleEditClick = async (row: any) => {
-      const resp = await workforceApi.classDetails(row.id);
-      formState.value = resp.data;
-
-      isAdd.value = false;
-      visible.value = true;
-    };
-
-    const handleDelClick = async (row: any) => {
-      Modal.confirm({
-        title: `删除班制`,
-        content: `确定删除班制“${row.name}”?`,
-        async onOk() {
-          const resp: any = await workforceApi.classRemove(row.id);
-          message.success("删除成功！");
-          refresh();
-        },
-        onCancel() {},
-        class: "test",
-      });
-    };
-
-    const formRef = ref();
-
-    return () => (
-      <div class="classManager">
-        <a-row class="row">
-          <a-col span="24" style={{ textAlign: "right" }}>
-            <a-button
-              type="primary"
-              onClick={() => {
-                isAdd.value = true;
-                visible.value = true;
-              }}
-            >
-              添加班制
-            </a-button>
-          </a-col>
-        </a-row>
-
-        <a-table
-          dataSource={tableList.value}
-          columns={columns}
-          pagination={{
-            current: currPage.value,
-            pageSize: pageSize.value,
-            showTotal: (num: number) => `共${num}条`,
-            showQuickJumper: true,
-            showSizeChanger: true,
-            total: total.value,
-            onChange: handlePageChange,
-            "onUpdate:current": handlePageChange,
-            "onUpdate:pageSize": hanldePageSizeChange,
-          }}
-          loading={isLoading.value}
-          v-slots={{
-            bodyCell: ({ column, record }) => {
-              if (column.dataIndex === "operation") {
-                return (
-                  <a-space>
-                    <a-button
-                      size="small"
-                      type="link"
-                      onClick={() => handleEditClick(record)}
-                    >
-                      编辑
-                    </a-button>
-
-                    {/* <a-button
-                      size='small'
-                      type='link'
-                      danger
-                      onClick={() => handleDelClick(record)}
-                    >
-                      删除
-                    </a-button> */}
-                  </a-space>
-                );
-              }
-            },
-          }}
-        />
-
-        <a-modal
-          v-model={[visible.value, "visible"]}
-          title={isAdd.value ? "添加班制" : "编辑班制"}
-          destroyOnClose
-          width="700px"
-          onOk={handleOk}
-          onCancel={handleCancel}
-          wrapClassName="chassManagerModal"
-        >
-          <a-form
-            model={formState.value}
-            ref={formRef}
-            name="basic"
-            labelCol={{ style: { width: "120px" } }}
-            autocomplete="off"
-          >
-            {!isAdd.value && (
-              <a-form-item label="班制编码" name="num">
-                {formState.value.code}
-              </a-form-item>
-            )}
-
-            <a-row class="row" gutter={[16, 16]}>
-              <a-col span="12">
-                <a-form-item
-                  label="班制名称"
-                  name="name"
-                  rules={[{ required: true, message: "不能为空!" }]}
-                >
-                  <a-input v-model={[formState.value.name, "value"]} />
-                </a-form-item>
-              </a-col>
-
-              <a-col span="12">
-                <a-form-item
-                  label="统计班次类型"
-                  name="countShiftType"
-                  rules={[{ required: true, message: "不能为空!" }]}
-                >
-                  <a-select
-                    ref="select"
-                    style="width: 100%"
-                    placeholder="请选择"
-                    v-model={[formState.value.countShiftType, "value"]}
-                  >
-                    {countShiftTypeList.map((countShiftType: any) => (
-                      <a-select-option
-                        key={countShiftType.key}
-                        value={countShiftType.key}
-                      >
-                        {countShiftType.name}
-                      </a-select-option>
-                    ))}
-                  </a-select>
-                </a-form-item>
-              </a-col>
-            </a-row>
-
-            {isAdd.value && (
-              <a-button
-                type="primary"
-                onClick={() => {
-                  if (formState.value.infos.length < 5) {
-                    cls = { ...cls, shiftSort: ++cls.shiftSort };
-                    formState.value.infos.push({ ...cls });
-                  } else {
-                    message.info("最多可添加5个班次！");
-                  }
-                }}
-              >
-                添加班次
-              </a-button>
-            )}
-
-            <div>
-              <a-row gutter={[16, 16]}>
-                <a-col span="2"></a-col>
-                <a-col span="5">班次名称</a-col>
-                <a-col span="5">班次职能</a-col>
-                <a-col span="5">起始时间</a-col>
-                <a-col span="5">结束时间</a-col>
-                <a-col span="2"></a-col>
-              </a-row>
-
-              {formState.value.infos?.map((item: any, index: number) => (
-                <a-space style="display: flex;" align="baseline" key={index}>
-                  <a-row gutter={[16, 16]} class="classManager_infoRow flex">
-                    <a-col span="2" class="mtop">
-                      {index + 1}
-                    </a-col>
-                    <a-col span="5">
-                      <a-form-item
-                        label=""
-                        name={["infos", index, "name"]}
-                        rules={[{ required: true, message: "不能为空!" }]}
-                      >
-                        <a-input
-                          v-model={[item.name, "value"]}
-                          placeholder="请输入"
-                        />
-                      </a-form-item>
-                    </a-col>
-                    <a-col span="5">
-                      <a-form-item
-                        label=""
-                        name={["infos", index, "shiftDuty"]}
-                        rules={[{ required: true, message: "不能为空!" }]}
-                      >
-                        <a-select
-                          ref="select"
-                          style="width: 100%"
-                          placeholder="请选择"
-                          v-model={[item.shiftDuty, "value"]}
-                        >
-                          {shiftDutyList.map((shiftDuty) => (
-                            <a-select-option
-                              key={shiftDuty.key}
-                              value={shiftDuty.key}
-                            >
-                              {shiftDuty.name}
-                            </a-select-option>
-                          ))}
-                        </a-select>
-                      </a-form-item>
-                    </a-col>
-                    <a-col span="5">
-                      <a-form-item
-                        label=""
-                        name={["infos", index, "startTime"]}
-                        rules={[{ required: true, message: "不能为空!" }]}
-                      >
-                        <a-time-picker
-                          v-model={[item.startTime, "value"]}
-                          format="HH:mm"
-                          valueFormat="HH:mm"
-                        />
-                      </a-form-item>
-                    </a-col>
-                    <a-col span="5">
-                      <a-form-item
-                        label=""
-                        name={["infos", index, "endTime"]}
-                        rules={[{ required: true, message: "不能为空!" }]}
-                      >
-                        <a-time-picker
-                          v-model={[item.endTime, "value"]}
-                          format="HH:mm"
-                          valueFormat="HH:mm"
-                        />
-                      </a-form-item>
-                    </a-col>
-                    <a-col span="2" class="mtop">
-                      {isAdd.value && index > 0 && (
-                        <delete-outlined
-                          style={{ color: "red" }}
-                          onClick={() => {
-                            formState.value.infos.splice(index, 1);
-                          }}
-                        />
-                      )}
-                    </a-col>
-                  </a-row>
-                </a-space>
-              ))}
-            </div>
-          </a-form>
-        </a-modal>
-      </div>
-    );
-  },
-});
+import { defineComponent, ref } from "vue";
+import { message, Modal } from "ant-design-vue";
+
+import useTableList from "@/pageComponent/hooks/useTableList";
+import workforceApi from "@/api/workforceManager";
+
+import "../assets/classManagerAndWorkforceRuleComp.less";
+
+const columns = [
+  {
+    title: "班制编码",
+    dataIndex: "code",
+    key: "code",
+  },
+  {
+    title: "班制名称",
+    dataIndex: "name",
+    key: "name",
+  },
+  {
+    title: "班次数量",
+    dataIndex: "infoCount",
+    key: "infoCount",
+  },
+  {
+    title: "最后修改人",
+    dataIndex: "updateUser",
+    key: "updateUser",
+  },
+  {
+    title: "最后修改时间",
+    dataIndex: "updateDt",
+    key: "updateDt",
+  },
+  {
+    title: "操作",
+    dataIndex: "operation",
+  },
+];
+
+const shiftDutyList = [
+  { key: 1, name: "检修班" },
+  { key: 2, name: "生产班" },
+];
+
+const countShiftTypeList = [
+  { key: 1, name: "按前一天统计" },
+  { key: 2, name: "按当天统计" },
+];
+
+export default defineComponent({
+  setup() {
+    // table
+    const {
+      currPage,
+      isLoading,
+      refresh,
+      tableList,
+      handlePageChange,
+      total,
+      hanldePageSizeChange,
+      pageSize,
+    } = useTableList(
+      () =>
+        workforceApi.getClassList({
+          currentPage: currPage.value,
+          pageSize: pageSize.value,
+        }),
+      "rows",
+      "total"
+    );
+
+    refresh();
+
+    const userinfo = JSON.parse(sessionStorage.getItem("userinfo") as string);
+
+    let cls = {
+      name: "", // 班次名称
+      shiftDuty: null, // 班次职能：1-检修班 2-生产班
+      startTime: "", // 起始时间
+      endTime: "", // 结束时间
+      shiftSort: 1, //排序
+    };
+
+    const formState = ref({
+      name: "",
+      countShiftType: null,
+      createUser: userinfo.userName,
+      // code: '',
+      infos: [{ ...cls }],
+    } as any);
+
+    const visible = ref(false);
+    const isAdd = ref();
+    const handleOk = async () => {
+      await formRef.value.validateFields();
+
+      if (isAdd.value) {
+        //新增
+        const resp = await workforceApi.classAdd(formState.value);
+        if (resp.data) {
+          message.success("保存成功！");
+          handleCancel();
+          refresh();
+        }
+      } else {
+        // 编辑
+        const resp = await workforceApi.classEdit(
+          formState.value.id,
+          formState.value
+        );
+        message.success("保存成功！");
+        handleCancel();
+        refresh();
+      }
+    };
+    const handleCancel = () => {
+      visible.value = false;
+      formRef.value.resetFields();
+      formState.value = {
+        name: "",
+        countShiftType: null,
+        infos: [{ ...cls }],
+      };
+    };
+
+    const handleEditClick = async (row: any) => {
+      const resp = await workforceApi.classDetails(row.id);
+      formState.value = resp.data;
+
+      isAdd.value = false;
+      visible.value = true;
+    };
+
+    const handleDelClick = async (row: any) => {
+      Modal.confirm({
+        title: `删除班制`,
+        content: `确定删除班制“${row.name}”?`,
+        async onOk() {
+          const resp: any = await workforceApi.classRemove(row.id);
+          message.success("删除成功！");
+          refresh();
+        },
+        onCancel() {},
+        class: "test",
+      });
+    };
+
+    const formRef = ref();
+
+    return () => (
+      <div class="classManager flex">
+        <a-row class="row">
+          <a-col span="24" style={{ textAlign: "right" }}>
+            <a-button
+              type="primary"
+              onClick={() => {
+                isAdd.value = true;
+                visible.value = true;
+              }}
+            >
+              添加班制
+            </a-button>
+          </a-col>
+        </a-row>
+
+        <a-table
+          dataSource={tableList.value}
+          columns={columns}
+          pagination={{
+            current: currPage.value,
+            pageSize: pageSize.value,
+            showTotal: (num: number) => `共${num}条`,
+            showQuickJumper: true,
+            showSizeChanger: true,
+            total: total.value,
+            onChange: handlePageChange,
+            "onUpdate:current": handlePageChange,
+            "onUpdate:pageSize": hanldePageSizeChange,
+          }}
+          loading={isLoading.value}
+          v-slots={{
+            bodyCell: ({ column, record }) => {
+              if (column.dataIndex === "operation") {
+                return (
+                  <a-space>
+                    <a-button
+                      size="small"
+                      type="link"
+                      onClick={() => handleEditClick(record)}
+                    >
+                      编辑
+                    </a-button>
+
+                    {/* <a-button
+                      size='small'
+                      type='link'
+                      danger
+                      onClick={() => handleDelClick(record)}
+                    >
+                      删除
+                    </a-button> */}
+                  </a-space>
+                );
+              }
+            },
+          }}
+        />
+
+        <a-modal
+          v-model={[visible.value, "visible"]}
+          title={isAdd.value ? "添加班制" : "编辑班制"}
+          destroyOnClose
+          width="700px"
+          onOk={handleOk}
+          onCancel={handleCancel}
+          wrapClassName="chassManagerModal"
+        >
+          <a-form
+            model={formState.value}
+            ref={formRef}
+            name="basic"
+            labelCol={{ style: { width: "120px" } }}
+            autocomplete="off"
+          >
+            {!isAdd.value && (
+              <a-form-item label="班制编码" name="num">
+                {formState.value.code}
+              </a-form-item>
+            )}
+
+            <a-row class="row" gutter={[16, 16]}>
+              <a-col span="12">
+                <a-form-item
+                  label="班制名称"
+                  name="name"
+                  rules={[{ required: true, message: "不能为空!" }]}
+                >
+                  <a-input v-model={[formState.value.name, "value"]} />
+                </a-form-item>
+              </a-col>
+
+              <a-col span="12">
+                <a-form-item
+                  label="统计班次类型"
+                  name="countShiftType"
+                  rules={[{ required: true, message: "不能为空!" }]}
+                >
+                  <a-select
+                    ref="select"
+                    style="width: 100%"
+                    placeholder="请选择"
+                    v-model={[formState.value.countShiftType, "value"]}
+                  >
+                    {countShiftTypeList.map((countShiftType: any) => (
+                      <a-select-option
+                        key={countShiftType.key}
+                        value={countShiftType.key}
+                      >
+                        {countShiftType.name}
+                      </a-select-option>
+                    ))}
+                  </a-select>
+                </a-form-item>
+              </a-col>
+            </a-row>
+
+            {isAdd.value && (
+              <a-button
+                type="primary"
+                onClick={() => {
+                  if (formState.value.infos.length < 5) {
+                    cls = { ...cls, shiftSort: ++cls.shiftSort };
+                    formState.value.infos.push({ ...cls });
+                  } else {
+                    message.info("最多可添加5个班次！");
+                  }
+                }}
+              >
+                添加班次
+              </a-button>
+            )}
+
+            <div>
+              <a-row gutter={[16, 16]}>
+                <a-col span="2"></a-col>
+                <a-col span="5">班次名称</a-col>
+                <a-col span="5">班次职能</a-col>
+                <a-col span="5">起始时间</a-col>
+                <a-col span="5">结束时间</a-col>
+                <a-col span="2"></a-col>
+              </a-row>
+
+              {formState.value.infos?.map((item: any, index: number) => (
+                <a-space style="display: flex;" align="baseline" key={index}>
+                  <a-row gutter={[16, 16]} class="classManager_infoRow flex">
+                    <a-col span="2" class="mtop">
+                      {index + 1}
+                    </a-col>
+                    <a-col span="5">
+                      <a-form-item
+                        label=""
+                        name={["infos", index, "name"]}
+                        rules={[{ required: true, message: "不能为空!" }]}
+                      >
+                        <a-input
+                          v-model={[item.name, "value"]}
+                          placeholder="请输入"
+                        />
+                      </a-form-item>
+                    </a-col>
+                    <a-col span="5">
+                      <a-form-item
+                        label=""
+                        name={["infos", index, "shiftDuty"]}
+                        rules={[{ required: true, message: "不能为空!" }]}
+                      >
+                        <a-select
+                          ref="select"
+                          style="width: 100%"
+                          placeholder="请选择"
+                          v-model={[item.shiftDuty, "value"]}
+                        >
+                          {shiftDutyList.map((shiftDuty) => (
+                            <a-select-option
+                              key={shiftDuty.key}
+                              value={shiftDuty.key}
+                            >
+                              {shiftDuty.name}
+                            </a-select-option>
+                          ))}
+                        </a-select>
+                      </a-form-item>
+                    </a-col>
+                    <a-col span="5">
+                      <a-form-item
+                        label=""
+                        name={["infos", index, "startTime"]}
+                        rules={[{ required: true, message: "不能为空!" }]}
+                      >
+                        <a-time-picker
+                          v-model={[item.startTime, "value"]}
+                          format="HH:mm"
+                          valueFormat="HH:mm"
+                        />
+                      </a-form-item>
+                    </a-col>
+                    <a-col span="5">
+                      <a-form-item
+                        label=""
+                        name={["infos", index, "endTime"]}
+                        rules={[{ required: true, message: "不能为空!" }]}
+                      >
+                        <a-time-picker
+                          v-model={[item.endTime, "value"]}
+                          format="HH:mm"
+                          valueFormat="HH:mm"
+                        />
+                      </a-form-item>
+                    </a-col>
+                    <a-col span="2" class="mtop">
+                      {isAdd.value && index > 0 && (
+                        <delete-outlined
+                          style={{ color: "red" }}
+                          onClick={() => {
+                            formState.value.infos.splice(index, 1);
+                          }}
+                        />
+                      )}
+                    </a-col>
+                  </a-row>
+                </a-space>
+              ))}
+            </div>
+          </a-form>
+        </a-modal>
+      </div>
+    );
+  },
+});