feat(user): change

src/request/URL.ts

@@ -33,6 +33,8 @@ export const delOrganization = `/relics/org/del`;
 export const getOrganizationDetail = `/relics/org/info/:orgId`;
 export const alterOrganization = `/relics/org/update`;
 
+export const registerOrganization = `/relics/org/register`;
+
 // users
 export const addUser = `/relics/user/addUser`;
 export const changeUserStatus = `/relics/user/changeStatus`;
@@ -45,6 +47,8 @@ export const userScenepage = `/relics/user/page`;
 export const getMsgAuthCode = `/relics/user/getMsgAuthCode`;
 export const changePassword = `/relics/user/changePassword`;
 
+
+
 ///drawing
 
 export const addOrUpdateDrawing = `/relics/relics/drawing/saveOrUpdate`;

src/request/organization.ts

@@ -1,4 +1,4 @@
-import { sendFetch, PageProps } from './index'
+import { sendFetch, PageProps, UserType } from './index'
 import { ResPage, ResResult } from './type'
 import { organizationTypeEnum } from '@/store/organization'
 import * as URL from "./URL";
@@ -65,3 +65,10 @@ export const getOrgListFetchList = () =>
         method: "post",
         body: JSON.stringify({}),
     });
+
+
+export const registerOrganization = (params: any) =>
+    sendFetch<ResResult>(URL.registerOrganization, {
+        method: "post",
+        body: JSON.stringify({ ...params }),
+    });

src/request/users.ts

@@ -83,12 +83,8 @@ export const changePassword = async (params: ChangePasswordParam) => {
         }
     }
 
-
-
 }
 
-
-
 export const getMsgAuthCode = (areaNum: string,
     phoneNum: string) =>
     sendFetch<ResResult>(URL.getMsgAuthCode, {
@@ -103,3 +99,5 @@ export const getMsgAuthCode = (areaNum: string,
 
 
 
+
+

src/view/login.vue

@@ -28,7 +28,7 @@
             </div>
           </div>
           <!-- login right panel -->
-          <template v-if="!isShowRegister">
+          <template v-if="currentStatus(0)">
             <el-form class="panel login" :model="form" @submit.stop>
               <h2>欢迎登录</h2>
               <el-form-item class="panel-form-item">
@@ -78,10 +78,12 @@
               </div>
             </el-form>
           </template>
-          <template v-else>
+          <template v-if="currentStatus(1)">
             <register></register>
           </template>
-
+          <template v-if="currentStatus(2)">
+            <reset></reset>
+          </template>
         </div>
       </div>
     </div>
@@ -89,7 +91,7 @@
 </template>
 
 <script lang="ts" setup>
-import { reactive, watch, ref } from "vue";
+import { reactive, watch, ref, computed } from "vue";
 import { View, Hide, DArrowRight, SuccessFilled } from "@element-plus/icons-vue";
 import { login } from "@/store/user";
 import { ElMessage } from "element-plus";
@@ -97,7 +99,7 @@ import { router } from "@/router";
 import qrCode from "qrcode";
 import DragVerify from "@/components/drag-verify.vue";
 import register from '@/view/register/register.vue'
-
+import reset from '@/view/register/reset.vue'
 const PHONE = {
   REG: /^1(3|4|5|6|7|8|9)\d{9}$/,
   // REG: /^((13[0-9]|14[01456879]|15[0-3,5-9]|16[2567]|17[0-8]|18[0-9]|19[0-3,5-9])\d{8})|(8){11}$/,
@@ -107,7 +109,9 @@ const PHONE = {
 const flag = ref(false);
 const verify = ref<any>();
 const isPassing2 = ref(false);
-const isShowRegister = ref(false);
+
+const registerStatus = ref(0);
+const currentStatus = computed(() => (status: number) => status === registerStatus.value)
 // 表单
 const form = reactive({
   phone: import.meta.env.DEV ? "13800000001" : "",
@@ -178,11 +182,11 @@ const submitClick = async () => {
 
 // 忘记密码
 const handleForgetPassword = () => {
-
+  registerStatus.value = 2
 }
 // 注册
 const handleRegister = () => {
-  isShowRegister.value = true
+  registerStatus.value = 1
 }
 
 
@@ -533,4 +537,8 @@ input[type="password"]::-ms-reveal {
 .drag_verify {
   border: 1px solid #dcdfe6;
 }
+
+.register span {
+  cursor: pointer;
+}
 </style>

src/view/organization-edit.vue

@@ -62,13 +62,12 @@ const data = ref<OrganizationType & {}>({
 const setParentId = () => {
   if (user.value) {
     const isSuper = user.value.roles.filter(item => item.roleKey === "super_admin").length > 0;
-    
     data.value.parentId = isSuper ? 0 : Number(user.value.orgId)
   }
 }
 watchEffect(() => {
   if (props.org) {
-    data.value = { ...props.org}
+    data.value = { ...props.org }
   }
 
 })

src/view/register/register.vue

@@ -1,13 +1,80 @@
 <template>
-    <div>
-        <el-form class="panel login" :model="form" @submit.stop>
+    <div class="register">
+        <el-form class="panel" :model="form" :rules="rules" ref="baseFormRef">
             <h2>单位注册</h2>
-            <el-form-item class="panel-form-item">
-                <!-- <p class="err-info">xxx</p> -->
-                <el-input :maxlength="11" v-model.trim="form.phone" placeholder="手机号"
-                    @keydown.enter="submitClick"></el-input>
+            <span class="desc">
+                此功能仅用于注册单位及单位管理员，
+                单位内其它用户可由单位管理员登录后创建。
+            </span>
+            <el-form-item class="panel-form-item" label="单位名称">
+                <el-input :maxlength="11" v-model.trim="form.orgName" placeholder="请输入"></el-input>
+            </el-form-item>
+
+            <el-form-item class="panel-form-item" label="类型" prop="type">
+                <el-select v-model="form.type">
+                    <el-option class="register-select-option" :value="Number(key)" :label="type"
+                        v-for="(type, key) in OrganizationTypeDesc" />
+                </el-select>
+            </el-form-item>
+            <el-form-item class="panel-form-item" label="姓名" prop="contact">
+                <el-input :maxlength="200" v-model.trim="form.contact" placeholder="请选择"></el-input>
+            </el-form-item>
+
+
+            <el-form-item class="panel-form-item" prop="userName" label="账号" required>
+                <el-input v-model.trim="form.userName" placeholder="请输入手机号码">
+                </el-input>
             </el-form-item>
 
+            <el-form-item class="panel-form-item msgcode" prop="msgAuthCode" label="验证码" required>
+                <el-input :maxlength="8" v-model.trim="form.msgAuthCode" placeholder="输入验证码">
+                </el-input>
+                <!-- <el-button class="getMsgAuthCode" @click="getCheckCode">
+                    获取验证码
+                </el-button> -->
+                <el-button class="getMsgAuthCode" :loading="checkCodeBtn.loading" :disabled="checkCodeBtn.disabled"
+                    style="margin-left: 10px" @click="getCheckCode"> {{ checkCodeBtn.text }}</el-button>
+            </el-form-item>
+
+            <!-- <el-form-item class="panel-form-item" label="密码" prop="password" required>
+                <el-input v-model.trim="form.password" placeholder="请输入8-16位数字、字母大小写组合">
+                </el-input>
+            </el-form-item> -->
+            <el-form-item class="panel-form-item" label="密码" prop="password" required>
+                <el-input autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"
+                    v-model="form.password" :type="addPassFlag ? 'text' : 'password'" :maxlength="20"
+                    placeholder="请输入8-16位数字、字母大小写组合">
+                    <template #suffix>
+                        <span @click="addPassFlag = !addPassFlag" style="cursor: pointer;">
+                            <el-icon v-if="addPassFlag">
+                                <View />
+                            </el-icon>
+                            <el-icon v-else>
+                                <Hide />
+                            </el-icon>
+                        </span>
+                    </template>
+                </el-input>
+
+            </el-form-item>
+
+            <el-form-item class="panel-form-item" label="密码确认" prop="confirmPwd" required>
+                <el-input autocomplete="off" readonly onfocus="this.removeAttribute('readonly');"
+                    v-model="form.confirmPwd" :type="addPassFlag1 ? 'text' : 'password'" :maxlength="20"
+                    placeholder="输入再次输入密码">
+                    <template #suffix>
+                        <span @click="addPassFlag1 = !addPassFlag1" style="cursor: pointer;">
+                            <el-icon v-if="addPassFlag1">
+                                <View />
+                            </el-icon>
+                            <el-icon v-else>
+                                <Hide />
+                            </el-icon>
+                        </span>
+                    </template>
+                </el-input>
+
+            </el-form-item>
 
             <el-form-item class="panel-form-item">
                 <el-button type="primary" class="fill submit" @click="submitClick">注册</el-button>
@@ -18,20 +85,191 @@
     </div>
 </template>
 <script lang="ts" setup>
-import { reactive } from 'vue'
+import { reactive, ref, unref } from 'vue'
+import { ElMessage, type FormInstance, type FormRules } from "element-plus";
+import { OrganizationTypeDesc } from '@/store/organization';
+import { View, Hide } from '@element-plus/icons-vue';
+import { registerOrganization } from '@/request/organization';
+
+
+import {
+    getMsgAuthCode,
+} from "@/request";
+
+
+const baseFormRef = ref<FormInstance>();
+const addPassFlag = ref(false) //图标显示标识
+const addPassFlag1 = ref(false) //图标显示标识
+
+let checkCodeBtn = reactive<any>({
+    text: '获取验证码',
+    loading: false,
+    disabled: false,
+    duration: 60,
+    timer: null
+})
+
+const equalToPassword = (_, value: any, callback: any) => {
+    if (form.password !== value) {
+        callback(new Error("两次输入的密码不一致"));
+    } else {
+        callback();
+    }
+};
+const rules = reactive<FormRules>({
+    orgName: [
+        { required: true, message: "请选择单位名称", trigger: "select" },
+    ],
+    msgAuthCode: [
+        { required: true, message: "请输入验证码", trigger: "change" },
+    ],
+    contact: [
+        { required: true, message: "请输入姓名", trigger: "blur" },
+    ],
+    userName: [
+        { required: true, message: "请输入手机号码", trigger: "blur" },
+        { required: true, pattern: /^1[3456789]\d{9}$/, message: "请输入手机号码", trigger: "blur" },
+    ],
+    password: [
+        { required: true, pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/, message: "请输入8-16位数字、字母大小写组合", trigger: "blur" },
+        { required: true, min: 8, message: '密码太短！', trigger: "blur" },
+    ],
+    confirmPwd: [
+        { required: true, pattern: /^(?=.*[A-Za-z])(?=.*\d)[A-Za-z\d]{8,16}$/, message: "请输入8-16位数字、字母大小写组合", trigger: "blur" },
+        { required: true, min: 8, message: '密码太短！', trigger: "blur" },
+        { required: true, validator: equalToPassword, trigger: "blur" }
+    ],
+},)
+
 
 const form = reactive({
-    phone: import.meta.env.DEV ? "13800000001" : "",
-    psw: import.meta.env.DEV ? "88888888Sw" : "",
+    orgName: "",
+    type: "",
+    phone: "",
+    userName: "",
+    password: "",
+    contact: "",
+    confirmPwd: "",
+    msgAuthCode: "",
 });
 
-const submitClick = () => {
+const getCheckCode = async () => {
+    // 倒计时期间按钮不能单击
+    await unref(baseFormRef)?.validateField('userName');
 
+    const phoneNum = form.userName
+    console.log('getMsgCode', phoneNum)
+    const res = await getMsgAuthCode('+86', phoneNum)
+    if (res.success) {
+        ElMessage.success(res.data);
+    }
+    if (checkCodeBtn.duration == 60) {
+        checkCodeBtn.disabled = true
+    }
+    // 清除掉定时器
+    checkCodeBtn.timer && clearInterval(checkCodeBtn.timer)
+    // 开启定时器
+    checkCodeBtn.timer = setInterval(() => {
+        const tmp = checkCodeBtn.duration--
+        checkCodeBtn.text = `${tmp}秒`
+        if (tmp <= 0) {
+            // 清除掉定时器
+            clearInterval(checkCodeBtn.timer)
+            checkCodeBtn.duration = 60
+            checkCodeBtn.text = '重新获取'
+            // 设置按钮可以单击
+            checkCodeBtn.disabled = false
+        }
+        console.info(checkCodeBtn.duration)
+    }, 1000)
+}
+
+const submitClick = async () => {
+    if (unref(baseFormRef)) {
+        const res = await unref(baseFormRef)?.validate();
+        if (res) {
+            const result = await registerOrganization(form)
+            console.log('result', result)
+            // ElMessage.success('新增成功！');
+        }
+    } else {
+        throw "";
+    }
 }
 </script>
 
-<style lang="scss" sc>
-.login .panel-form-item{
-    
+<style lang="scss" scoped>
+.register {
+    padding: 10px 0;
+
+    .panel {
+        width: 430px;
+    }
+
+    .panel-form-item {
+        padding-left: 0;
+        padding-right: 0;
+    }
+
+    h2 {
+        padding-left: 0;
+        margin-bottom: 0;
+    }
+
+    .desc {
+        color: #93795D;
+        display: block;
+        margin-bottom: 20px;
+    }
+
+    :deep(.panel-form-item .el-form-item__label) {
+        line-height: 40px;
+        font-size: 16px;
+        min-width: 90px;
+    }
+
+    :deep(.el-form-item__error) {
+        font-size: 14px;
+    }
+
+    :deep(.el-select) {
+        width: 100%;
+        height: 42px;
+        line-height: 42px;
+
+        .el-select__wrapper {
+            height: 100%;
+            font-size: 1.14rem;
+        }
+    }
+
+    .msgcode {
+        position: relative;
+    }
+
+    .getMsgAuthCode {
+        border: 1px solid #93795D;
+        background: rgba(147, 121, 93, 0.05);
+        font-size: 14px;
+        position: absolute;
+        right: 5px;
+        top: 5px;
+        height: 32px;
+        line-height: 32px;
+    }
+
+    .fill {
+        width: 100%;
+    }
+
+
+}
+</style>
+<style>
+.register-select-option {
+    font-size: 1.14rem;
+    min-height: 50px;
+    line-height: 50px;
+    /* padding: 5px 0; */
 }
 </style>

src/view/register/reset.vue

@@ -0,0 +1,109 @@
+<template>
+    <div class="register">
+        <el-form class="panel" :model="form" @submit.stop>
+            <h2>重置密码</h2>
+
+
+            <el-form-item class="panel-form-item" label="手机号">
+                <el-input v-model.trim="form.userName" placeholder="请输入手机号码">
+                </el-input>
+            </el-form-item>
+
+
+            <el-form-item class="panel-form-item msgcode" label="验证码">
+                <el-input :maxlength="11" v-model.trim="form.msgAuthCode" placeholder="输入验证码">
+                </el-input>
+                <el-button class="getMsgAuthCode">
+                    获取验证码
+                </el-button>
+            </el-form-item>
+
+            <el-form-item class="panel-form-item" label="重置密码">
+                <el-input v-model.trim="form.password" placeholder="请输入8-16位数字、字母大小写组合">
+                </el-input>
+            </el-form-item>
+
+
+            <el-form-item class="panel-form-item" label="确认密码">
+                <el-input v-model.trim="form.confirmPwd" placeholder="输入再次输入密码">
+                </el-input>
+            </el-form-item>
+
+            <el-form-item class="panel-form-item">
+                <el-button type="primary" class="fill submit" @click="submitClick">注册</el-button>
+            </el-form-item>
+
+
+        </el-form>
+    </div>
+</template>
+<script lang="ts" setup>
+import { reactive } from 'vue'
+
+const form = reactive({
+    orgName: "",
+    type: "",
+    phone: "",
+    nickName: "",
+    userName: "",
+    password: "",
+    confirmPwd: "",
+    msgAuthCode: "",
+    country: 86,
+});
+
+const submitClick = () => {
+
+}
+</script>
+
+<style lang="scss" scoped>
+.register {
+    // background: #FFFFFF;
+    // box-shadow: 0px 2px 20px 0px rgba(5, 38, 38, 0.15);
+    // border-radius: 10px 10px 10px 10px;
+    padding: 10px 0;
+
+    .panel-form-item {
+        padding-left: 0;
+        padding-right: 0;
+    }
+
+    h2 {
+        padding-left: 0;
+        margin-bottom: 0;
+    }
+
+    .desc {
+        color: #93795D;
+        display: block;
+        margin-bottom: 20px;
+    }
+
+    :deep(.panel-form-item .el-form-item__label) {
+        line-height: 40px;
+        font-size: 16px;
+        min-width: 80px;
+    }
+
+    .msgcode {
+        position: relative;
+
+    }
+
+    .getMsgAuthCode {
+        border: 1px solid #93795D;
+        background: rgba(147, 121, 93, 0.05);
+        font-size: 14px;
+        position: absolute;
+        right: 5px;
+        top: 5px;
+        height: 32px;
+        line-height: 32px;
+    }
+
+    .fill {
+        width: 100%;
+    }
+}
+</style>

src/view/users-add.vue

@@ -101,7 +101,7 @@ watch(data, (newValue) => {
 onMounted(async () => {
   const data = await getOrgListFetchList()
 
-  console.log('allOrgs', data);
+  // console.log('allOrgs', data);
   allOrgs.value = data as any as SelectType[]
   // allOrgs.value = Array.from(data.records).map((item: OrganizationType) => {
   //   const i: SelectType = { value: item['orgName'], id: item['orgId'] }

src/view/users-password-edit.vue

@@ -28,7 +28,7 @@
     </el-form-item>
     <el-form-item label="密码确认" prop="confirmPwd" required>
       <el-input autocomplete="off" readonly onfocus="this.removeAttribute('readonly');" v-model="data.confirmPwd"
-        :type="addPassFlag ? 'text' : 'password'" style="width: 300px" :maxlength="500"
+        :type="addPassFlag ? 'text' : 'password'" style="width: 300px" :maxlength="40"
         placeholder="请输入8-16位数字、字母大小写组合">
         <template #suffix>
           <span @click="addPassFlag = !addPassFlag" style="cursor: pointer;">
@@ -114,7 +114,6 @@ const rules = reactive<FormRules>({
     { required: true, pattern: /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)[\s\S]{8,16}$/, message: "请输入8-16位数字、字母大小写组合", trigger: "blur" },
     { required: true, min: 8, message: '密码太短！', trigger: "blur" },
     { required: true, validator: equalToPassword, trigger: "blur" }
-
   ]
 },)
 

vite.config.ts

@@ -29,22 +29,22 @@ export default ({ mode }: any) =>
       port: 5173,
       open: true,
       proxy: {
-        // "/api": {
-        //   target: "http://192.168.0.11:8324",
-        //   changeOrigin: true,
-        //   rewrite: (path) => path.replace(/^\/api/, ""),
-        // },
+        "/api": {
+          target: "http://192.168.0.11:8324",
+          changeOrigin: true,
+          rewrite: (path) => path.replace(/^\/api/, ""),
+        },
         "/gear1": {
           target: `http://devimages.apple.com/iphone/samples/bipbop`,
           changeOrigin: true,
           rewrite: (path) => path.replace(/^\/gear1/, "/gear1"),
         },
-        "/api": {
-          target: loadEnv(mode, process.cwd()).VITE_API,
-          // target: `http://192.168.0.11:8324/relics/`,
-          changeOrigin: true,
-          rewrite: (path) => path.replace(/^\/api/, "/api"),
-        },
+        // "/api": {
+        //   target: loadEnv(mode, process.cwd()).VITE_API,
+        //   // target: `http://192.168.0.11:8324/relics/`,
+        //   changeOrigin: true,
+        //   rewrite: (path) => path.replace(/^\/api/, "/api"),
+        // },
         // "/api": {
         //   target: `https://uat-sp.4dkankan.com/`,
         //   // target: `http://192.168.0.11:8324/relics/`,