add 工作类型配置

赵凤
1 parent 8b4449ae
Showing 7 changed files with 423 additions and 2 deletions
config/routers/backlog.ts
src/pages/backlog/TaskTime/index.tsx
src/pages/backlog/WorkTypeConfig/api.ts
src/pages/backlog/WorkTypeConfig/components/CreateModal.tsx
src/pages/backlog/WorkTypeConfig/components/PageParams.tsx
src/pages/backlog/WorkTypeConfig/entity.ts
src/pages/backlog/WorkTypeConfig/index.tsx
@@ -7,4 +7,9 @@ export default [
     path: "./backlog/taskTime", // 待办时效
     component: "./backlog/TaskTime",
   },
+  /**工作类型配置 */
+  {
+    path: "./backlog/workConfig", 
+    component: "./backlog/WorkTypeConfig",
+  },
 ];
@@ -81,7 +81,6 @@ export default function TaskConfig() {
             }}
           />
           <Column
-            // title="待办延时时间"
             title={
               <Popover
                 placement="topLeft"
@@ -93,7 +92,6 @@ export default function TaskConfig() {
                 }
               >
                 <span>
-                  {" "}
                   待办延时时间&nbsp;&nbsp;
                   <ExclamationCircleFilled style={{ color: "#40a9ff" }} />
                 </span>
+/*
+ * @Date: 2021-12-29 15:35:12
+ * @LastEditors: wangqiang@feewee.cn
+ * @LastEditTime: 2022-01-05 17:53:12
+ */
+import request from "@/utils/request";
+import { common } from "@/typing/common";
+import { BACKLOG } from "@/utils/host";
+import { http } from "@/typing/http";
+
+interface ListParams extends common.PaginationParam {
+  keywords?: string;
+}
+
+export interface Pramas {
+  name?: string;
+}
+/**
+ * 列表项
+ */
+export interface ListVO {
+  id?: number; //ID
+  name?: string; // 名称
+  createTime?: string; //创建时间
+}
+
+/**
+ * 工作类型列表
+ * @param name 类型名称
+ * @returns 
+ */
+export function getWorkTypeListApi(params: Pramas): http.PromisePageResp<ListVO> {
+  return request.get(`${BACKLOG}/work/type/list`, { params });
+}
+
+export interface SaveParams {
+  /** 名称 */
+  name: string,
+  /** id */
+   id?: number
+}
+
+/**
+ * 新增|编辑工作类
+ * work/type/save
+ * @param id 
+ * @returns 
+ */
+export function saveWorkType(params: SaveParams) {
+  return request.post(`${BACKLOG}/work/type/save`, { ...params });
+}
+import React, { useEffect, useState } from "react";
+import { Modal, Form, Input, Radio, message, InputNumber } from "antd";
+import { ListVO, saveWorkType } from "../api";
+import { NotifyTypeEnum, TodoTypeEnum } from "../entity";
+import PageParams, { ValueVO } from "./PageParams";
+import { systemListApi } from "@/pages/admin/Privilege/api";
+import usePagination from "@/hooks/usePagination";
+import { checkNull } from "@/utils/validate";
+
+const { TextArea } = Input;
+
+interface Props {
+  visible: boolean;
+  onCancel: () => void;
+  onRefreshing: () => void;
+  item: ListVO;
+  /** 角色列表 */
+  // roleList: CommonApi.RoleCodeVO[],
+}
+export default function CreateModal({
+  visible,
+  onCancel,
+  item,
+  onRefreshing,
+}: Props) {
+  const [form] = Form.useForm();
+  const [saveLoading, setSaveLoading] = useState(false);
+  const { list } = usePagination(systemListApi, { current: 1, pageSize: 100 });
+  const [value, setValue] = useState<ValueVO[]>([]);
+
+  // useEffect(() => {
+  //   if (visible) {
+  //     const prePageParam: { [key: string]: any } = JSON.parse(
+  //       item.pageParam || "{}"
+  //     );
+  //     let pageParam: ValueVO[] = [{ key: "", value: "" }];
+  //     for (let [key, value] of Object.entries(prePageParam)) {
+  //       pageParam.unshift({ key, value });
+  //     }
+  //     setValue(pageParam);
+
+  //     form.setFieldsValue({
+  //       ...item,
+  //       funcPage: item.funcPage,
+  //       itemName: item.itemName,
+  //       dock: item.dock,
+  //       exShow: item.exShow,
+  //       assess: item.assess,
+  //       itemType: item.itemType || TodoTypeEnum["业务性"],
+  //       listPage: item.listPage,
+  //       detailPage: item.detailPage,
+  //       dynamicTemp: item.dynamicTemp,
+  //       notifyType: item.notifyType || 1,
+  //       pageParam,
+  //       applySysId: item.applySysId,
+  //       customTemp: item.customTemp,
+  //       customTempPath: item.customTempPath,
+  //       closeStand: checkNull(item.closeStand) ? true : item.closeStand,
+  //     });
+  //   }
+  //   if (!visible) {
+  //     setSaveLoading(false);
+  //   }
+  // }, [visible]);
+
+  function handleSave(feildValue: any) {
+    setSaveLoading(true);
+      console.log("表单数据：", feildValue);
+ 
+    const params = {
+      ...feildValue,
+      name: (feildValue.name || "").trim(),
+    };
+    setSaveLoading(false);
+
+    return;
+    saveWorkType(params)
+      .then((res) => {
+        message.success("操作成功！");
+        onRefreshing && onRefreshing();
+        setSaveLoading(false);
+        onCancel && onCancel();
+      })
+      .catch((e) => {
+        message.error(e.message);
+        setSaveLoading(false);
+      });
+  }
+
+  return (
+    <Modal
+      visible={visible}
+      onCancel={onCancel}
+      onOk={form.submit}
+      title={`${item.name ? "编辑" : "新增"}工作类型`}
+      confirmLoading={saveLoading}
+      maskClosable={false}
+    >
+      <Form
+        form={form}
+        onFinish={handleSave}
+        wrapperCol={{ span: 18 }}
+        labelCol={{ span: 6 }}
+      >
+        <Form.Item
+          label="工作类型id"
+          name="id"
+          // rules={[{ required: true }]}
+        >
+          <InputNumber placeholder="请输入工作类型id" />
+        </Form.Item>
+        <Form.Item
+          label="工作类型名称"
+          name="name"
+          rules={[{ required: true }]}
+        >
+          <Input placeholder="请输入工作类型名称" />
+        </Form.Item>
+      </Form>
+    </Modal>
+  );
+}
+import React from 'react';
+import { Input, Card, Button } from 'antd';
+import { PlusOutlined, DeleteOutlined } from '@ant-design/icons';
+
+export interface ValueVO {
+  key: string, 
+  value: string
+}
+
+interface Props {
+  value?: ValueVO[],
+  onChange?: (value: ValueVO[]) => any
+}
+
+export default function PageParams({ value = [{ key: "", value: "" }], onChange }: Props) {
+  function changeLabel(key1: string, i: number) {
+    value[i].key = key1;
+    onChange && onChange([...value]);
+  }
+
+  function changeValue(key2: string, i: number) {
+    value[i].value = key2;
+    onChange && onChange([...value]);
+  }
+
+  function addValue() {
+    value.push({ key: "", value: "" });
+    onChange && onChange([...value]);
+  }
+
+  function deleteValue(i: number) {
+    value.splice(i, 1);
+    onChange && onChange([...value]);
+  }
+
+  return (
+    <Card
+      extra={
+        <div style={{ flex: 1, display: 'flex', justifyContent: "space-between", flexDirection: 'row' }}>
+          <Button type="primary" icon={<PlusOutlined />} onClick={addValue}>新增</Button>
+        </div>}
+    >
+      {value.map((v, i) => (
+        <div key={`key_${i}`} style={{ flex: 1, display: 'flex', justifyContent: "space-between", alignItems: "center", flexDirection: 'row', marginBottom: 5 }}>
+          <Input value={v.key} placeholder="key" onChange={(e) => changeLabel(e.target.value, i)} />
+          <span style={{ marginLeft: 5, marginRight: 5 }}> : </span>
+          <Input value={v.value} placeholder="value" onChange={(e) => changeValue(e.target.value, i)} />
+          <DeleteOutlined color="#FF0000" style={{ color: "#FF0000", fontSize: 14, marginLeft: 10 }} onClick={() => deleteValue(i)} />
+        </div>
+      ))}
+    </Card>
+  )
+}
 \ No newline at end of file
+export enum NotifyTypeEnum {
+  "app消息" = 1,
+  "短信" = 2,
+  "不通知" = 9
+}
+
+export enum TodoTypeEnum {
+  "业务性" = 1,
+  "提示性" = 2,
+}
 \ No newline at end of file
+import React, { useState, useEffect } from "react";
+import { PageHeaderWrapper } from "@ant-design/pro-layout";
+import {
+  Card,
+  Table,
+  Popconfirm,
+  Switch,
+  message,
+  Button,
+  Input,
+  Select,
+} from "antd";
+import { PlusOutlined } from "@ant-design/icons";
+import usePagination from "@/hooks/usePagination";
+import { ListVO, getWorkTypeListApi, taskEnableApi } from "./api";
+import { TodoTypeEnum } from "./entity";
+import moment from "moment";
+import { debounce } from "lodash";
+import CreateModal from "./components/CreateModal";
+import { getAllRoleCodeApi } from "@/common/api";
+import { systemListApi } from "@/pages/admin/Privilege/api";
+
+const Column = Table.Column;
+const Search = Input.Search;
+
+export default function TaskConfig() {
+  const { list, loading, paginationConfig, setList, setParams, setLoading } =
+    usePagination<ListVO>(getWorkTypeListApi, {});
+  console.log("工作类型列表：", list);
+  const [switchLoading, setSwitchLoading] = useState(false);
+  const [modalData, setModalData] = useState<{ visible: boolean; row: ListVO }>(
+    { visible: false, row: {} }
+  );
+
+  const { list: syslist } = usePagination(systemListApi, {
+    current: 1,
+    pageSize: 100,
+  });
+
+  useEffect(() => {
+    getAllRoleCodeApi()
+      .then((res) => {})
+      .catch((e) => {
+        message.error(`获取角色列表失败：${e.message}`);
+      });
+  }, []);
+
+  function triggerModal(row: ListVO = {}) {
+    setModalData({ visible: !modalData.visible, row });
+  }
+
+  const _onChange = debounce((val: string) => {
+    setParams({ keywords: val.trim(), current: 1 }, true);
+  }, 500);
+
+  // 禁用或启用待办
+  const handleChangeStatus = (record: ListVO) => {
+    const API = record.status ? taskDisableApi : taskEnableApi;
+    record.id &&
+      API(record.id)
+        .then((res) => {
+          setSwitchLoading(false);
+          message.success(record.status ? "禁用成功" : "启用成功");
+          const tempList = list.map((item: ListVO) => {
+            if (item.id == record.id) {
+              return { ...item, status: record.status == 0 ? 1 : 0 };
+            }
+            return item;
+          });
+          setList(tempList);
+        })
+        .catch((e) => {
+          setSwitchLoading(false);
+          message.error(e.message);
+        });
+  };
+
+  // 删除待办
+  const handleDelete = (record: any) => {
+    taskDeleteApi(record.id)
+      .then((res) => {
+        message.success("删除成功！");
+        setLoading(true);
+      })
+      .catch((e) => {
+        setSwitchLoading(false);
+        message.error(e.message);
+      });
+  };
+
+  //根据系统名称搜索
+  const _onChangeSys = debounce((e: any) => {
+    setParams({ sysId: e, current: 1 }, true);
+  }, 500);
+
+  return (
+    <PageHeaderWrapper title="工作类型配置">
+      <Card>
+        <div
+          style={{
+            display: "flex",
+            flexDirection: "row",
+            justifyContent: "space-between",
+            alignItems: "center",
+            marginBottom: 20,
+          }}
+        >
+          <div style={{ display: "flex" }}>
+            <Search
+              allowClear
+              placeholder="输入工作类型名称"
+              onChange={(e) => _onChange(e.target.value)}
+              style={{ maxWidth: 260, marginRight: 15 }}
+            />
+            {/* <Select
+              allowClear
+              placeholder="搜索系统名称"
+              style={{ width: 260, marginRight: 5 }}
+              onChange={(e: any) => _onChangeSys(e)}
+            >
+              {syslist.map((item) => (
+                <Select.Option value={item.id!} key={item.id}>
+                  {item.sysName}
+                </Select.Option>
+              ))}
+            </Select> */}
+          </div>
+          <Button
+            type="primary"
+            icon={<PlusOutlined />}
+            onClick={() => triggerModal()}
+          >
+            新增
+          </Button>
+        </div>
+        <Table
+          loading={loading}
+          dataSource={list}
+          pagination={paginationConfig}
+          rowKey="itemCode"
+        >
+          <Column
+            title="工作类型"
+            dataIndex="name"
+            align="center"
+          />
+          <Column
+            title="创建时间"
+            dataIndex="createTime"
+            align="center"
+            render={(text) => moment(text).format("YYYY-MM-DD")}
+          />
+        
+          <Column
+            title="操作"
+            align="center"
+            render={(val, row: ListVO) => (
+              <>
+                <Button type="link" onClick={() => triggerModal(row)}>
+                  编辑
+                </Button>
+                <Popconfirm
+                  placement="top"
+                  title="确认删除？"
+                  onConfirm={() => handleDelete(row)}
+                >
+                  <Button type="link">删除</Button>
+                </Popconfirm>
+              </>
+            )}
+          />
+        </Table>
+        <CreateModal
+          visible={modalData.visible}
+          onCancel={triggerModal}
+          onRefreshing={() => setLoading(true)}
+          item={modalData.row}
+        />
+      </Card>
+    </PageHeaderWrapper>
+  );
+}