inl-ui 0.0.4 → 0.0.7

package/src/pageComponent/views/systemManager/authManager/userManager/updateUserDialog.tsx

@@ -1,294 +0,0 @@
-import { computed, defineComponent, nextTick, PropType, ref, watch } from "vue";
-import useModalVisibleControl from "@/pageComponent/hooks/manage-module/useModalVisibleControl";
-import useVModel from "@/pageComponent/hooks/useVModel";
-import { cloneDeep, omit } from "lodash";
-import { encodeStr } from "@/pageComponent/utils/base64";
-import { getRequiredRule } from "@/pageComponent/utils/validation";
-import api from "@/pageComponent/api/auth/userManager";
-
-import {
-  Modal,
-  Form,
-  FormItem,
-  Input,
-  Select,
-  SelectOption,
-  InputPassword,
-  Space,
-  Button,
-  message,
-} from "ant-design-vue";
-import UserProfileDialog from "./userProfileDialog";
-import SearchSelect from "@/pageComponent/components/SearchSelect";
-
-const UpdateUserDialog = defineComponent({
-  emits: ["update:visible"],
-  props: {
-    visible: {
-      type: Boolean,
-      default: false,
-    },
-    /* 表单类型 add: 新增用户 edit: 编辑用户 view: 查看用户信息 */
-    mode: {
-      type: String as PropType<"add" | "edit" | "view">,
-      default: "view",
-    },
-    /* 需要编辑或查看的用户数据 */
-    record: {
-      type: Object,
-      default: () => ({}),
-    },
-    /* 新增或修改结束后 刷新列表 */
-    onRefresh: {
-      type: Function,
-    },
-  },
-  setup(props, { emit }) {
-    const isVisible = useVModel(props, "visible", emit);
-
-    /* ===== 初始化表单 ===== */
-    const formRef = ref();
-    const form = ref<any>({});
-    watch(isVisible, async (val) => {
-      // 等待record赋值 / 完全关闭
-      await nextTick();
-      // 打开对话框时复制表单 新建用户时不用
-      if (val) {
-        if (props.mode === "add") return;
-        form.value = cloneDeep(props.record);
-        // 转换角色列表
-        form.value.roleIds = form.value.roleIds.split(",").map(Number);
-      } else {
-        // 清空表单
-        formRef.value.resetFields();
-      }
-    });
-
-    // 获取员工列表
-    const employeeList = ref([]);
-    api.getEmployeeList().then(({ data }) => (employeeList.value = data));
-
-    /* 对话框标题 */
-    const modalTitle = computed(() => {
-      if (props.mode === "add") return "新建用户";
-      else if (props.mode === "edit") return "编辑用户";
-      return "查看用户";
-    });
-
-    /* 是否查看模式 */
-    const isView = computed(() => props.mode === "view");
-
-    const cancel = () => {
-      isVisible.value = false;
-    };
-
-    /* 查看模式点击员工姓名 展示员工详情 */
-    const [isProfileShow, handleProfileClick] = useModalVisibleControl();
-
-    // 重置密码
-    const handleResetPassword = async () => {
-      Modal.confirm({
-        title: "密码重置",
-        content: "确定重置密码?",
-        async onOk() {
-          await api.resetPassword(form.value.userId);
-          message.success("重置密码！");
-        },
-      });
-    };
-
-    /* 新增用户的密码验证 */
-    const validatePassword = async (rule: any, value: string) => {
-      if (!value) return;
-      if (value.length < 8 || value.length > 14) {
-        throw new Error("请输入长度为8-14的字符");
-      }
-      if (form.value.checkPass && value !== form.value.checkPass) {
-        throw new Error("两次输入密码不一致");
-      }
-      return true;
-    };
-    const validateCheckPass = async (rule: any, value: string) => {
-      if (!value) return;
-      if (form.value.passWord && value !== form.value.passWord) {
-        throw new Error("两次输入密码不一致");
-      }
-      return true;
-    };
-
-    /* 点击保存按钮回调 */
-    const handleCommit = async () => {
-      await formRef.value.validate();
-      const data = {
-        ...form.value,
-        roleIds: form.value.roleIds.join(","),
-      };
-      let res;
-      if (props.mode === "add") {
-        res = await api.insertOneUserRecord({
-          ...omit(data, "checkPass"),
-          passWord: encodeStr(data.passWord),
-        });
-      } else if (props.mode === "edit") {
-        res = await api.editUserRecord(data);
-      }
-
-      cancel();
-      props.onRefresh?.();
-    };
-
-    return () => (
-      <div class="update-user-dialog">
-        <Modal
-          title={modalTitle.value}
-          centered
-          v-model={[isVisible.value, "visible"]}
-        >
-          {{
-            default: () => (
-              <Form ref={formRef} labelCol={{ span: 4 }} model={form.value}>
-                <FormItem
-                  name="userName"
-                  label="用户名"
-                  required
-                  rules={getRequiredRule("用户名")}
-                >
-                  {isView.value ? (
-                    <span>{form.value.userName}</span>
-                  ) : (
-                    <Input v-model={[form.value.userName, "value"]} />
-                  )}
-                </FormItem>
-                <FormItem
-                  name="employeeName"
-                  label="员工姓名"
-                  help="中英文均可，最长14个英文或者7个汉字"
-                >
-                  {isView.value ? (
-                    <Button type="link" onClick={handleProfileClick}>
-                      {form.value.employeeName}
-                    </Button>
-                  ) : (
-                    <Select v-model={[form.value.employeeId, "value"]}>
-                      {employeeList.value.map((item: any) => (
-                        <SelectOption key={item.id}>{item.name}</SelectOption>
-                      ))}
-                    </Select>
-                  )}
-                </FormItem>
-                {props.mode === "add" ? (
-                  // 新增用户 展示新建密码 和 确认密码
-                  <>
-                    <FormItem
-                      name="passWord"
-                      label="新建密码"
-                      required
-                      help="长度为8-14个字符，支持数字、大小写字母和特殊字符"
-                      rules={[
-                        { validator: validatePassword },
-                        { required: true, message: "请输入密码" },
-                      ]}
-                    >
-                      <InputPassword
-                        v-model={[form.value.passWord, "value"]}
-                      ></InputPassword>
-                    </FormItem>
-                    <FormItem
-                      name="checkPass"
-                      label="确认密码"
-                      required
-                      rules={[
-                        { validator: validateCheckPass },
-                        { required: true, message: "请确认密码" },
-                      ]}
-                    >
-                      <InputPassword
-                        v-model={[form.value.checkPass, "value"]}
-                      ></InputPassword>
-                    </FormItem>
-                  </>
-                ) : (
-                  // 查看和编辑用户 展示重置密码
-                  <FormItem name="passWord" label="密码重置">
-                    <span>●●●●●●●●</span>
-                    {props.mode === "edit" && (
-                      <Button type="link" onClick={handleResetPassword}>
-                        重置密码
-                      </Button>
-                    )}
-                  </FormItem>
-                )}
-                <FormItem
-                  name="roleIds"
-                  label="所属角色"
-                  required
-                  rules={getRequiredRule("所属角色")}
-                >
-                  {isView.value ? (
-                    <span>{form.value.roleTypeNames}</span>
-                  ) : (
-                    <SearchSelect
-                      getUrl="/role/list"
-                      {...{ mode: "multiple" }}
-                      valuePorp={{ key: "roleId", label: "roleName" }}
-                      v-model={[form.value.roleIds, "value"]}
-                    ></SearchSelect>
-                  )}
-                </FormItem>
-                <FormItem
-                  name="phone"
-                  label="电话"
-                  required
-                  rules={getRequiredRule("电话")}
-                >
-                  {isView.value ? (
-                    <span>{form.value.phone}</span>
-                  ) : (
-                    <Input v-model={[form.value.phone, "value"]} />
-                  )}
-                </FormItem>
-                <FormItem name="zhixin" label="智信">
-                  {isView.value ? (
-                    <span>{form.value.zhixin}</span>
-                  ) : (
-                    <Input v-model={[form.value.zhixin, "value"]} />
-                  )}
-                </FormItem>
-                <FormItem name="wechat" label="微信">
-                  {isView.value ? (
-                    <span>{form.value.wechat}</span>
-                  ) : (
-                    <Input v-model={[form.value.wechat, "value"]} />
-                  )}
-                </FormItem>
-                <FormItem name="mail" label="邮箱">
-                  {isView.value ? (
-                    <span>{form.value.mail}</span>
-                  ) : (
-                    <Input v-model={[form.value.mail, "value"]} />
-                  )}
-                </FormItem>
-              </Form>
-            ),
-            footer: () => (
-              <Space>
-                <Button onClick={cancel}>关闭</Button>
-                {!isView.value && (
-                  <Button type="primary" onClick={handleCommit}>
-                    保存
-                  </Button>
-                )}
-              </Space>
-            ),
-          }}
-        </Modal>
-        <UserProfileDialog
-          record={props.record}
-          v-model={[isProfileShow.value, "visible"]}
-        />
-      </div>
-    );
-  },
-});
-
-export default UpdateUserDialog;

package/src/pageComponent/views/systemManager/authManager/userManager/userProfileDialog.tsx

@@ -1,102 +0,0 @@
-/*
- * @Abstract: 用户详情对话框
- * @Author: wang liang
- * @Date: 2022-03-25 09:27:03
- * @LastEditors: wang liang
- * @LastEditTime: 2022-04-14 10:37:33
- */
-
-import { defineComponent, watch, nextTick, ref } from "vue";
-import useVModel from "@/pageComponent/hooks/useVModel";
-import api from "@/pageComponent/api/auth/userManager";
-
-import { Modal, Descriptions, DescriptionsItem, Button } from "ant-design-vue";
-
-const UserProfileDialog = defineComponent({
-  emits: ["update:visible"],
-  props: {
-    visible: {
-      type: Boolean,
-      default: false,
-    },
-    record: {
-      type: Object,
-      required: true,
-    },
-  },
-  setup(props, { emit }) {
-    const isVisible = useVModel(props, "visible", emit);
-
-    const profile = ref<any>({});
-
-    /* 打开对话框后 获取用户详情 */
-    watch(isVisible, async (val) => {
-      if (val) {
-        await nextTick();
-        const { data } = await api.getEmployeeDetailInfo(
-          props.record.employeeId
-        );
-        profile.value = data;
-      }
-    });
-
-    return () => (
-      <div class="user-profile-dialog">
-        <Modal
-          title="员工详情"
-          width={650}
-          v-model={[isVisible.value, "visible"]}
-        >
-          {{
-            default: () => (
-              <Descriptions
-                column={2}
-                labelStyle={{
-                  display: "block",
-                  textAlign: "right",
-                  width: "100px",
-                }}
-              >
-                <DescriptionsItem label="编号">
-                  {profile.value.code}
-                </DescriptionsItem>
-                <DescriptionsItem label="姓名">
-                  {profile.value.name}
-                </DescriptionsItem>
-                <DescriptionsItem label="性别">
-                  {profile.value.sex === 0 ? "女" : "男"}
-                </DescriptionsItem>
-                <DescriptionsItem label="年龄">
-                  {profile.value.age}
-                </DescriptionsItem>
-                <DescriptionsItem label="籍贯">
-                  {profile.value.nativePlace}
-                </DescriptionsItem>
-                <DescriptionsItem label="身份证号">
-                  {profile.value.identityCard}
-                </DescriptionsItem>
-                <DescriptionsItem label="入职时间">
-                  {profile.value.hiredate}
-                </DescriptionsItem>
-                <DescriptionsItem label="手机号">
-                  {profile.value.mobile}
-                </DescriptionsItem>
-                <DescriptionsItem label="直属领导">
-                  {profile.value.bossName}
-                </DescriptionsItem>
-                <DescriptionsItem label="岗位">
-                  {profile.value.jobPostNames}
-                </DescriptionsItem>
-              </Descriptions>
-            ),
-            footer: () => (
-              <Button onClick={() => (isVisible.value = false)}>关闭</Button>
-            ),
-          }}
-        </Modal>
-      </div>
-    );
-  },
-});
-
-export default UserProfileDialog;