feat : 个人中心和用户管理设置代理

src/views/auth/index.vue

@@ -1,8 +1,8 @@
 <template>
   <div class="my">
     <el-row :gutter="20">
-      <el-col :span="10" :xs="24">
-        <el-card class="box-card1">
+      <el-col :span="12" :xs="24">
+        <el-card>
           <!-- 标题 -->
           <template #header>
             <div class="card-header">
@@ -28,24 +28,24 @@
               </div>
               <div>{{ userParams.nickName }}</div>
             </div>
-            <div class="userInfo_item">
-              <div style="display: flex;align-items: center">
-                <el-icon size="18" style="margin-right: 5px">
-                  <Notification/>
-                </el-icon>
-                工号:
-              </div>
-              <div>{{ userParams.workCode }}</div>
-            </div>
-            <div class="userInfo_item">
-              <div style="display: flex;align-items: center">
-                <el-icon size="18" style="margin-right: 5px">
-                  <Phone/>
-                </el-icon>
-                电话号码:
-              </div>
-              <div>{{ userParams.mobile }}</div>
-            </div>
+<!--            <div class="userInfo_item">-->
+<!--              <div style="display: flex;align-items: center">-->
+<!--                <el-icon size="18" style="margin-right: 5px">-->
+<!--                  <Notification/>-->
+<!--                </el-icon>-->
+<!--                工号:-->
+<!--              </div>-->
+<!--              <div>{{ userParams.workCode }}</div>-->
+<!--            </div>-->
+<!--            <div class="userInfo_item">-->
+<!--              <div style="display: flex;align-items: center">-->
+<!--                <el-icon size="18" style="margin-right: 5px">-->
+<!--                  <Phone/>-->
+<!--                </el-icon>-->
+<!--                电话号码:-->
+<!--              </div>-->
+<!--              <div>{{ userParams.mobile }}</div>-->
+<!--            </div>-->
             <div class="userInfo_item">
               <div style="display: flex;align-items: center">
                 <el-icon size="18" style="margin-right: 5px">
@@ -94,7 +94,70 @@
           </div>
         </el-card>
       </el-col>
-      <el-col :span="14" :xs="24">
+      <el-col :span="12" :xs="24">
+        <el-card>
+        <baseTitle title="设置代理" ></baseTitle>
+        <el-form ref="userForm" :model="agentInfoForm" label-width="85px">
+          <el-row gutter="30">
+            <el-col :span="24">
+              <el-form-item label="被代理人" prop="nickName">
+                <span>{{ agentInfoForm.nickName }}</span>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="代理人" prop="" required >
+                <el-button style="margin-right: 10px" color="#DED0B2" @click="handleShowAgentDialog">
+                  {{ agentUserList?.length !== 0 ? '更改' : '请选择' }}
+                </el-button>
+                <div v-for="item in agentUserList" :key="item.id" style="margin-right: 5px">
+                  {{ item.name }}
+                </div>
+                <user-picker :multiple="false" ref="agentUserPickerRef" title="请选择代理人"
+                             v-model:value="agentUserList" @ok="agentUserPickerOk"
+                             @cancelOrClear="agentUserPickerOk"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="代理状态" prop="agentState">
+                <Tag dictType="agent_state" :value="agentInfoForm.agentState"/>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="开始时间" prop="agentStartTime">
+                <el-config-provider>
+                  <el-date-picker
+                      v-model="agentInfoForm.agentStartTime"
+                      type="datetime"
+                      placeholder="请选择开始时间"
+                      value-format="YYYY-MM-DD HH:mm:ss"
+                  />
+                </el-config-provider>
+              </el-form-item>
+            </el-col>
+            <el-col :span="24">
+              <el-form-item label="结束时间" prop="agentEndTime" :title="!agentInfoForm.agentStartTime?'请先选择开始时间!':''">
+                <el-config-provider>
+                  <el-date-picker
+                      v-model="agentInfoForm.agentEndTime"
+                      type="datetime"
+                      placeholder="请选择结束时间"
+                      value-format="YYYY-MM-DD HH:mm:ss"
+                      :disabled="!agentInfoForm.agentStartTime"
+                      :disabled-date="disabledAgentEndTime"
+                  />
+                </el-config-provider>
+              </el-form-item>
+            </el-col>
+            <el-form-item>
+                <el-button color="#DED0B2" @click="handleSubmitAgent" style="margin-left: 16px">提交</el-button>
+            </el-form-item>
+          </el-row>
+        </el-form>
+        </el-card>
+      </el-col>
+    </el-row>
+    <el-row :gutter="20">
+      <el-col :span="12" :xs="24">
         <el-card class="box-card">
           <!-- 标题 -->
           <template #header>
@@ -113,8 +176,8 @@
               <el-input placeholder="请确认新密码" v-model="userPassword.confirmPassword" type="password"/>
             </el-form-item>
             <el-form-item>
-              <el-button color="#DED0B2" @click="handleSubmit">提交</el-button>
-              <el-button @click="close">关闭</el-button>
+              <el-button color="#DED0B2" @click="handleSubmitPassword">提交</el-button>
+              <el-button @click="closeIndividualCenter">关闭</el-button>
             </el-form-item>
           </el-form>
         </el-card>
@@ -126,18 +189,23 @@
 import {ElNotification} from 'element-plus'
 import {useTagsView} from '@/stores/tagsview.js'
 import {getAuthInfo} from "@/api/login";
-import {editPassword, initPassword} from "@/api/auth/auth";
+import {editPassword, initPassword,getAgentInfo,editAgentInfo} from "@/api/auth/auth";
+import UserPicker from "@/views/workflow/process/common/UserPicker.vue";
 
+const router = useRouter()
+const tagsViewStore = useTagsView()
 const isInitPassword = ref(false);
+const agentUserList = ref([])
+const agentUserPickerRef = ref()
 const userParams = ref({});
 const passwordRef = ref();
-const router = useRouter()
+const agentInfoForm = ref({});
 const userPassword = ref({
   oldPassword: '',
   newPassword: '',
   confirmPassword: ''
 });
-const tagsViewStore = useTagsView()
+
 const validatePasswordComplexity = (rule, value, callback) => {
   const reg = /^(?=.*[a-zA-Z])(?=.*\d).{1,9}$/; //密码必须是至少包含字母、数字，1-9位
   if (!reg.test(value)) {
@@ -176,21 +244,90 @@ const rules = reactive({
     }
   ],
 })
+const disabledAgentEndTime = (time) => {
+  return time.getTime() <= new Date(agentInfoForm.value.agentStartTime)-1 * 24 * 3600 * 1000
+}
 
-const getInfo = async () => {
+const handleShowAgentDialog = () => {
+  agentUserPickerRef.value.showUserPicker()
+}
+
+const agentUserPickerOk = (userList) => {
+  console.info("🚀 ~method:userList -----", userList)
+  agentUserList.value = userList
+}
+const getUserInfo = async () => {
   await getAuthInfo().then(res => {
-    userParams.value = res.data.user
-    isInitPassword.value = res.data.initPassword
+    if(res.code===1000){
+      userParams.value = res.data.user
+      isInitPassword.value = res.data.initPassword
+    }else {
+      ElNotification({
+        title: '提示',
+        message: res.msg,
+        type:  'error'
+      })
+    }
   })
 }
 
+const getUserAgentInfo = async () => {
+  await getAgentInfo().then(res => {
+    if(res.code===1000){
+      agentInfoForm.value=res.data
+      agentUserList.value=[
+        {
+          id:res.data.agentUserId,
+          name:res.data.agentNickName,
+          companyName:res.data.agentCompanyName,
+        }
+      ]
+    }else {
+      ElNotification({
+        title: '提示',
+        message: res.msg,
+        type:  'error'
+      })
+    }
+  })
+}
+localStorage.removeItem('originallySelectedList')
+
 const belongToRole = (roles) => {
   if (!roles) return;
   return roles.map(item => item.roleName).join('，')
 }
-
+const handleSubmitAgent=()=>{
+  let agentUserId=''
+  if(agentUserList.value&&agentUserList.value.length>0){
+    agentUserId=agentUserList.value[0]?.id
+  }else {
+    ElNotification({
+      title: '提示',
+      message: '请选择代理人!',
+      type: 'error'
+    })
+    return;
+  }
+  let agentParams={
+    agentUserId:agentUserId,
+    agentStartTime:agentInfoForm.value.agentStartTime,
+    agentEndTime:agentInfoForm.value.agentEndTime
+  }
+  console.info("🚀 ~method:agentParams -----", agentParams)
+  editAgentInfo(agentParams).then(res => {
+    ElNotification({
+      title: '提示',
+      message: res.msg,
+      type: res.code === 1000 ? 'success' : 'error'
+    })
+    if (res.code === 1000) {
+      getUserAgentInfo()
+    }
+  })
+}
 // 修改密码
-const handleSubmit = async () => {
+const handleSubmitPassword = async () => {
   if (isInitPassword.value) {
     editPassword({
       ...userPassword.value
@@ -221,23 +358,28 @@ const handleSubmit = async () => {
   }
 }
 // 关闭
-const close = () => {
+const closeIndividualCenter = () => {
   tagsViewStore.delVisitedViews(router.currentRoute.value.path)
   router.push('/')
 }
 onMounted(() => {
-  getInfo()
+  getUserInfo()
+  getUserAgentInfo()
 })
 </script>
 <style lang="scss">
+.box-card {
+  //margin-left: 10px;
+  margin-top: 10px;
+}
+
 body, div {
   margin: 0;
   padding: 0;
 }
 
 .my {
-  margin: 0 auto;
-  margin-top: 20px;
+  margin: 20px auto 0;
 
   .userDetail {
     .userImg {
@@ -256,21 +398,14 @@ body, div {
   }
 
   .userInfo_item {
-    display: flex;align-items: center;
+    display: flex;
+    align-items: center;
     justify-content: space-between;
     height: 40px;
     border-bottom-style: solid;
     border-color: #daddd2;
     border-width: 1px;
-    //text-align: left;
-    //line-height: 40px;
-
   }
-
-  //
-  //.userInfo_item > div {
-  //  float: right;
-  //}
 }
 
 </style>

src/views/system/user/agentSetting.vue

@@ -0,0 +1,142 @@
+<template>
+  <div style="padding: 0 30px">
+    <baseTitle title="设置代理" ></baseTitle>
+    <el-form ref="userForm" :model="agentInfoForm" label-width="85px">
+      <el-row gutter="30">
+        <el-col :span="24">
+          <el-form-item label="被代理人" prop="nickName">
+            <span>{{ agentInfoForm.nickName }}</span>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="代理人" prop="" required >
+            <el-button style="margin-right: 10px" color="#DED0B2" @click="handleShowAgentDialog">
+              {{ agentUserList?.length !== 0 ? '更改' : '请选择' }}
+            </el-button>
+            <div v-for="item in agentUserList" :key="item.id" style="margin-right: 5px">
+              {{ item.name }}
+            </div>
+            <user-picker :multiple="false" ref="agentUserPickerRef" title="请选择代理人"
+                         v-model:value="agentUserList" @ok="agentUserPickerOk"
+                         @cancelOrClear="agentUserPickerOk"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="代理状态" prop="agentState">
+            <Tag dictType="agent_state" :value="agentInfoForm.agentState"/>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="开始时间" prop="agentStartTime">
+            <el-config-provider>
+              <el-date-picker
+                  v-model="agentInfoForm.agentStartTime"
+                  type="datetime"
+                  placeholder="请选择开始时间"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+              />
+            </el-config-provider>
+          </el-form-item>
+        </el-col>
+        <el-col :span="24">
+          <el-form-item label="结束时间" prop="agentEndTime" :title="!agentInfoForm.agentStartTime?'请先选择开始时间!':''">
+            <el-config-provider>
+              <el-date-picker
+                  v-model="agentInfoForm.agentEndTime"
+                  type="datetime"
+                  placeholder="请选择结束时间"
+                  value-format="YYYY-MM-DD HH:mm:ss"
+                  :disabled="!agentInfoForm.agentStartTime"
+                  :disabled-date="disabledAgentEndTime"
+              />
+            </el-config-provider>
+          </el-form-item>
+        </el-col>
+        <el-form-item>
+          <el-button color="#DED0B2" @click="handleSubmitAgent" style="margin-left: 16px">提交</el-button>
+        </el-form-item>
+      </el-row>
+    </el-form>
+  </div>
+</template>
+
+<script setup>
+import {ElNotification} from "element-plus";
+
+import {editAgentInfo,getAgentInfo} from "@/api/auth/auth";
+const agentUserList = ref([])
+const agentInfoForm = ref({});
+const agentUserPickerRef = ref()
+const router = useRouter()
+localStorage.removeItem('originallySelectedList')
+
+const getUserAgentInfo = async () => {
+  await getAgentInfo().then(res => {
+    if(res.code===1000){
+      agentInfoForm.value=res.data
+      agentUserList.value=[
+        {
+          id:res.data.agentUserId,
+          name:res.data.agentNickName,
+          companyName:res.data.agentCompanyName,
+        }
+      ]
+    }else {
+      ElNotification({
+        title: '提示',
+        message: res.msg,
+        type:  'error'
+      })
+    }
+  })
+}
+const disabledAgentEndTime = (time) => {
+  return time.getTime() <= new Date(agentInfoForm.value.agentStartTime)-1 * 24 * 3600 * 1000
+}
+
+const handleShowAgentDialog = () => {
+  agentUserPickerRef.value.showUserPicker()
+}
+
+const agentUserPickerOk = (userList) => {
+  agentUserList.value = userList
+}
+
+const handleSubmitAgent=()=>{
+  let agentUserId=''
+  if(agentUserList.value&&agentUserList.value.length>0){
+    agentUserId=agentUserList.value[0]?.id
+  }else {
+    ElNotification({
+      title: '提示',
+      message: '请选择代理人!',
+      type: 'error'
+    })
+    return;
+  }
+  let agentParams={
+    agentUserId:agentUserId,
+    agentStartTime:agentInfoForm.value.agentStartTime,
+    agentEndTime:agentInfoForm.value.agentEndTime
+  }
+  console.info("🚀 ~method:agentParams -----", agentParams)
+  editAgentInfo(agentParams).then(res => {
+    ElNotification({
+      title: '提示',
+      message: res.msg,
+      type: res.code === 1000 ? 'success' : 'error'
+    })
+    if (res.code === 1000) {
+      router.push({name: 'User'})
+    }
+  })
+}
+
+onMounted(() => {
+  getUserAgentInfo()
+})
+</script>
+
+<style scoped>
+
+</style>

src/views/system/user/index.vue

@@ -89,6 +89,7 @@ const auths = {
   del: ['admin:user:del'],
   add: ['admin:user:add'],
   bindUser: ['admin:bind:account'],
+  agentSetting: ['admin:user:agentSetting'],
 }
 
 const tableConfig = reactive({
@@ -165,6 +166,7 @@ const tableConfig = reactive({
         return (
           <div>
             <el-button type="primary" v-perm={auths.edit} link onClick={()=>handleEdit(row)}>编辑</el-button>
+            <el-button type="primary" v-perm={auths.agentSetting} link onClick={()=>handleAgentSetting(row)}>设置代理</el-button>
             {
               row.userType != 0 ?
               <el-button type="danger" v-perm={auths.del} link onClick={()=>handleDel(row)}>删除</el-button> :
@@ -186,7 +188,11 @@ const tableConfig = reactive({
     {name: '新增', color:"#DED0B2", auth: ['admin:user:add'], key: 'add'}
   ]
 })
-
+const handleAgentSetting=()=>{
+  router.push({
+    name: 'AgentSetting',
+  })
+}
 const init = async () => {
   // console.log(authStore.roles,'userinfo');
   if(!authStore.roles.includes('superAdmin')) {