系统账号管理

src/assets/css/index.css

@@ -1513,6 +1513,11 @@ border-radius:8px;
   font-weight: bold;
   margin-bottom: 20px;
 }
+.header_info {
+  font-size: 14px;
+	color: #404a62;
+  padding-left: 20px;
+}
 .name_btn {
   color: #3759be;
   cursor: pointer;
@@ -1527,3 +1532,11 @@ border-radius:8px;
   font-size: 14px;
   color: #404a62;
 }
+.icon_eye {
+  font-size: 12px; 
+  color: #a9b1c7; 
+  margin-right: 8px;
+  vertical-align: baseline;
+  cursor: pointer;
+}
+

src/bg-ui/bg-upload-image.vue

@@ -59,7 +59,7 @@ export default {
     },
     action: {
       type: String,
-      default: "/apaas/static/image/upload",
+      default: "/apaas/common/file/upload",
     },
     autoUpload: {
       type: Boolean,

src/bg-ui/index.scss

@@ -2045,6 +2045,7 @@ a {
   background-color: #2b4695;
   cursor: pointer;
   user-select: none;
+  transition: all .3s;
 
   > .label {
     font-size: 12px;

src/page/main/develop/account/add/contact-form.vue

@@ -7,16 +7,16 @@
     ref="contactRef"
     style="max-width: 66%"
   >
-    <el-form-item label="联系人姓名" prop="contact_user">
-      <el-input v-model="contactForm.contact_user" />
+    <el-form-item label="联系人姓名" prop="contact_name">
+      <el-input v-model="contactForm.contact_name" />
     </el-form-item>
-    <el-form-item label="联系人手机号" prop="phone">
-      <el-input v-model="contactForm.phone" />
+    <el-form-item label="联系人手机号" prop="contact_phone">
+      <el-input v-model="contactForm.contact_phone" />
     </el-form-item>
-    <el-form-item label="联系人邮箱">
-      <el-input v-model="contactForm.email"/>
+    <el-form-item label="联系人邮箱" prop="contact_email">
+      <el-input v-model="contactForm.contact_email"/>
     </el-form-item>
-     <el-form-item label="备注">
+     <el-form-item label="备注" prop="remark">
       <el-input type="textarea" :rows="3" v-model="contactForm.remark" />
     </el-form-item>
   </el-form>
@@ -26,18 +26,30 @@
 import { reactive, ref, onMounted } from 'vue'
 
 const contactForm = reactive({
-  contact_user: '',
-  phone: '',
-  email: '',
+  contact_name: '',
+  contact_phone: '',
+  contact_email: '',
   remark: '',
 })
 
+const checkPhone = (rule, value, callback) => {
+      var phone_ruler = /^(?:(?:\+|00)86)?1[3-9]\d{9}$/;
+      setTimeout(() => {
+        if (!phone_ruler.test(value)&&value.length!==0) {
+          callback(new Error("请输入正确的手机号码"));
+        } else {
+          callback();
+        }
+      });
+    };
+
 const contactFormRules = reactive({
-  contact_user: [
+  contact_name: [
     { required: true, message: '请输入联系人姓名', trigger: 'blur' },
   ],
-  phone: [
+  contact_phone: [
     { required: true, message: '请输入联系人手机号', trigger: 'blur' },
+    { validator: checkPhone, trigger: 'blur' },
   ],
 })
 const contactRef = ref(null)

src/page/main/develop/account/add/index.vue

@@ -4,7 +4,7 @@
             <el-breadcrumb separator="/">
                 <el-breadcrumb-item> 开发管理 </el-breadcrumb-item>
                 <el-breadcrumb-item :to="{ path: '/develop/account' }"> 系统账号管理 </el-breadcrumb-item>
-                <el-breadcrumb-item> {{ route.query.type === "0" ? '新建' : '编辑'}} </el-breadcrumb-item>
+                <el-breadcrumb-item> {{ route.query.id ? '编辑' : '新建'}} </el-breadcrumb-item>
             </el-breadcrumb>
         </div>
         <div class="page_content flex_cloumn">
@@ -44,14 +44,17 @@
                      
                 </div>
                 <div class="content_main">
-                    <systemForm v-show="step === 1" ref="systemFormRef" @action="getSystemFormData"></systemForm>
+                    <systemForm v-show="step === 1" ref="systemFormRef" :form-type="route.query.id ? true : false" :id="route.query.id" @action="getSystemFormData"></systemForm>
                     <contactForm v-show="step === 2" ref="contactFormRef" @action="getContactFormData"></contactForm>
                     <div class="process_end" v-show="step === 3">
                         <div>
-                            <div><img src="@/assets/imgs/img_data-complete.png" alt=""></div>
-                            <div class="font_bold">业务系统新增成功</div>
+                            <div>
+                                <img v-if="successFlag" src="@/assets/imgs/img_data-complete.png" alt="">
+                                <img v-else src="@/assets/imgs/img_data-fail.png" alt="">
+                            </div>
+                            <div class="font_bold">{{route.query.id ? (successFlag ? '业务系统编辑成功' : '业务系统编辑失败') : (successFlag ? '业务系统新建成功' : '业务系统新建失败')}}</div>
                             <el-button  @click="cancel">返回列表</el-button>
-                            <el-button type="primary" @click="continueCreate">继续创建</el-button>
+                            <el-button v-if="!route.query.id" type="primary" @click="continueCreate">继续创建</el-button>
                         </div>
                             
                     </div>
@@ -78,30 +81,35 @@
 import { useRoute, useRouter } from 'vue-router';
 import systemForm from './system-form.vue';
 import contactForm from './contact-form.vue';
-import { reactive, ref,onBeforeMount,toRefs,computed, onBeforeUnmount, onMounted  } from 'vue';
-
+import { reactive, ref,onBeforeMount,toRefs,computed, onBeforeUnmount, onMounted, getCurrentInstance  } from 'vue';
+import CryptoJS from "crypto-js"; 
+const { proxy } = getCurrentInstance()
+const { $axios,$message } = proxy
 const route = useRoute();
 const router = useRouter();
 const step = ref(1);
 const systemFormRef = ref(null);
 const contactFormRef = ref(null);
 const formData = reactive({
-  org: '',
-  code: '',
-  name: '',
-  desc: '',
+  organization_id: '',
+  business_code: '',
+  business_name: '',
+  business_desc: '',
   logo: '',
-  role: '',
-  account: '',
+  system_role_id: '',
+  system_account: '',
   password: '',
-  url: '',
-  firm_name: '',
-  is_use: '',
-  contact_user: '',
-  phone: '',
-  email: '',
+  confirm_password: '',
+  access_address: '',
+  develop_id: '',
+  state: 1,
+
+  contact_name: '',
+  contact_phone: '',
+  contact_email: '',
   remark: '',
 }); //业务系统表单+联系人表单
+const successFlag = ref(false)
 
 // 下一步
 const nextStep = () => {
@@ -118,10 +126,62 @@ const getSystemFormData = (data) => {
 }
 //联系人表单检验触发事件 data为null 校验失败 
 const getContactFormData = (data) => {
+
     if(data) {
         formData.value = Object.assign(formData,data);
-        console.log(formData);
+        if(route.query.id) {
+            console.log(formData)
+            let params = {
+                id: parseInt(route.query.id),
+                business_name: formData.value.business_name,
+                system_account: formData.value.system_account,
+                contact_email: formData.value.contact_email,
+                contact_phone: formData.value.contact_phone,
+                contact_name: formData.value.contact_name,
+                logo: formData.value.logo && formData.value.logo.length > 0 ? formData.value.logo[0].url : '',
+                state: formData.value.state,
+                business_desc: formData.value.business_desc,
+                develop_id: formData.value.develop_id,
+                access_address: formData.value.access_address,
+                remark: formData.value.remark
+            }
+            $axios.post(`/apaas/system/v5/user/update`,params)
+                .then((res) => {
+                if (res.data.code == 200) {
+                    successFlag.value = true;
                     step.value = 3;
+                }else {
+                    $message.error(res.data.msg)
+                }
+            })
+        }else {
+            let params = {
+                organization_id: formData.value.organization_id,
+                system_role_id: "ab98a936-9046-455b-aba3-4c73671024d0",
+                logo: formData.value.logo && formData.value.logo.length > 0 ? formData.value.logo[0].url : '',
+                password: CryptoJS.AES.encrypt(formData.value.password,"swuE9cmCZQwrkYRV").toString(),
+                business_code: formData.value.business_code,
+                business_name: formData.value.business_name,
+                business_desc: formData.value.business_desc,
+                system_account: formData.value.system_account,
+                access_address: formData.value.access_address,
+                develop_id: formData.value.develop_id,
+                state: formData.value.state,
+                contact_name: formData.value.contact_name,
+                contact_phone: formData.value.contact_phone,
+                contact_email: formData.value.contact_email,
+                remark: formData.value.remark,
+            }
+            $axios.put(`/apaas/system/v5/user/create`,params)
+                .then((res) => {
+                if (res.data.code == 200) {
+                    successFlag.value = true;
+                    step.value = 3;
+                }else {
+                    $message.error(res.data.msg)
+                }
+            })
+        }
     }
 }
 //上一步
@@ -137,42 +197,54 @@ const continueCreate = () => {
     systemFormRef.value.clearForm();
     contactFormRef.value.clearForm();
     step.value = 1;
+    successFlag = false;
 }
 //取消
 const cancel = () => {
     router.go(-1);
 }
 
-onBeforeUnmount(()=>{
-    
-})
-onMounted(() => {
-    if(route.query.type === "1") {
-        setTimeout(()=> {
+const getDetail = () => {
+    $axios.get(`/apaas/system/v5/user/detail/${route.query.id}`)
+        .then((res) => {
+            if (res.data.code == 200) {
+                const form = res.data.data;
                 systemFormRef.value.setForm({
-                org: 'a',
-                code: 'b',
-                name: 'b',
-                desc: 'b',
-                logo: ['b'],
-                role: 'b',
-                account: 'b',
-                password: 'b',
-                confirm_password: 'b',
-                url: 'b',
-                firm_name: 'b',
-                is_use: 'b',
+                    organization_id: form.organization_id,
+                    system_role_id: form.system_role_id,
+                    logo: [{url:form.logo}],
+                    business_code: form.business_code,
+                    business_name: form.business_name,
+                    business_desc: form.business_desc,
+                    system_account: form.system_account,
+                    access_address: form.access_address,
+                    develop_id: form.develop_id,
+                    state: form.state,
+                    appid: form.app_id,
+                    appsecret: form.app_secret
                     
                 })
+
             contactFormRef.value.setForm({
-                contact_user: 'c',
-                phone: 'c',
-                email: 'c',
-                remark: 'c',
+                contact_name: form.contact_name,
+                contact_phone: form.contact_phone,
+                contact_email: form.contact_email,
+                remark: form.remark,
             })
-        },500)
+            }else {
+                $message.error(res.data.msg)
             }
-})
+        })
+    }
+
+    onBeforeUnmount(()=>{
+       
+    })
+    onMounted(() => {
+        if(route.query.id) {
+            getDetail()
+        }
+    })
 
 </script>
 

src/page/main/develop/account/add/system-form.vue

@@ -7,63 +7,94 @@
     ref="systemRef"
     style="max-width: 66%"
   >
-    <el-form-item label="所属机构" prop="org">
-      <el-input v-model="systemForm.org" />
+    <el-form-item label="所属机构" prop="organization_id">
+      <el-tree-select v-model="systemForm.organization_id" :data="orgData" :props="treeProps" :render-after-expand="false" :disabled="formType" style="width: 100%;"/>
     </el-form-item>
-    <el-form-item label="业务系统编码" prop="code">
-      <el-input v-model="systemForm.code" />
+    <el-form-item label="业务系统编码" prop="business_code">
+      <el-input v-model="systemForm.business_code" :disabled="formType"/>
     </el-form-item>
-    <el-form-item label="业务系统名称" prop="name">
-      <el-input v-model="systemForm.name" />
+    <el-form-item label="业务系统名称" prop="business_name">
+      <el-input v-model="systemForm.business_name" />
+    </el-form-item>
+    <el-form-item label="AppId" prop="appid" v-if="formType">
+      <el-input v-model="systemForm.appid" :disabled="formType" style="width: 80%;"/>
+      <span class="pl-1"><el-button type="primary" @click="copyText(systemForm.appid)">复制</el-button></span>
+    </el-form-item>
+    <el-form-item label="AppSecret" prop="appsecret" v-if="formType">
+      <el-input v-model="systemForm.appsecret" :disabled="formType" style="width: 80%;"/>
+      <span class="pl-1"><el-button type="primary" @click="copyText(systemForm.appsecret)">复制</el-button></span>
+      <span class="pl-1"><el-button type="primary">重置</el-button></span>
     </el-form-item>
     <el-form-item label="系统LOGO" prop="logo">
        <bg-upload-image v-model="systemForm.logo" :showTips="true" :limit="1" :fileSize="500" :fileSizeUnit="'KB'" listType="picture-card" :accept="['.jpg','.jpeg','.png']" customTips="请选择图片上传：大小120 * 120像素支持jpg、png等格式，图片需小于500KB"></bg-upload-image>
     </el-form-item>
-     <el-form-item label="业务系统概述" prop="desc">
-      <el-input type="textarea" :rows="3" v-model="systemForm.desc" />
+     <el-form-item label="业务系统概述" prop="business_desc">
+      <el-input type="textarea" :rows="3" v-model="systemForm.business_desc" />
     </el-form-item>
-     <el-form-item label="角色" prop="role">
-      <el-input v-model="systemForm.role" />
+     <el-form-item label="角色" prop="system_role_id" v-if="!formType">
+      <el-input v-model="systemForm.system_role_id" />
     </el-form-item>
-     <el-form-item label="账号" prop="account">
-      <el-input v-model="systemForm.account" />
+     <el-form-item label="账号" prop="system_account">
+      <el-input v-model="systemForm.system_account" />
     </el-form-item>
-     <el-form-item label="密码" prop="password">
-      <el-input type="password" v-model="systemForm.password" />
+     <el-form-item label="密码" prop="password" v-if="!formType">
+      <el-input :type="password_eye ? 'text' : 'password'" v-model="systemForm.password" >
+        <template #suffix>
+          <bg-icon @click="password_eye = !password_eye" class="icon_eye"  icon="#bg-ic-eye"></bg-icon>
+        </template>
+      </el-input>
     </el-form-item>
-     <el-form-item label="确认密码" prop="confirm_password">
-      <el-input type="password" v-model="systemForm.confirm_password" />
+     <el-form-item label="确认密码" prop="confirm_password" v-if="!formType">
+      <el-input :type="confirm_eye ? 'text' : 'password'" v-model="systemForm.confirm_password" >
+        <template #suffix>
+            <bg-icon @click="confirm_eye = !confirm_eye" class="icon_eye"  icon="#bg-ic-eye"></bg-icon>
+        </template>
+      </el-input>
     </el-form-item>
-     <el-form-item label="访问地址" prop="url">
-      <el-input v-model="systemForm.url" />
+     <el-form-item label="访问地址" prop="access_address">
+      <el-input v-model="systemForm.access_address" />
     </el-form-item>
-    <el-form-item label="开发厂商名称" prop="firm_name">
-      <el-input v-model="systemForm.firm_name" />
+    <el-form-item label="开发厂商名称" prop="develop_id">
+      <el-input v-model="systemForm.develop_id" />
     </el-form-item>
-    <el-form-item label="是否启用" prop="is_use">
-      <bg-switch :labels="['否','是']" :values="[0,1]" v-model="systemForm.is_use"></bg-switch>
+    <el-form-item label="是否启用" prop="state">
+      <bg-switch :labels="['否','是']" :values="[0,1]" v-model="systemForm.state"></bg-switch>
     </el-form-item>
   </el-form>
 </template>
 
 <script setup>
-import { reactive, ref, onMounted } from 'vue'
-
+import { reactive, ref, onBeforeMount, onMounted, getCurrentInstance, computed } from 'vue'
+const { proxy } = getCurrentInstance()
+const { $axios,$message } = proxy
+const props = defineProps({
+  formType: {
+    type: Boolean,
+    default: false, //false 新建 true 编辑
+  },
+  id: {
+    type: String,
+    default: '', 
+  }
+});
 const systemForm = reactive({
-  org: '',
-  code: '',
-  name: '',
-  desc: '',
-  logo: '',
-  role: '',
-  account: '',
+  organization_id: '',
+  business_code: '',
+  business_name: '',
+  business_desc: '',
+  logo: [],
+  system_role_id: '',
+  system_account: '',
   password: '',
   confirm_password: '',
-  url: '',
-  firm_name: '',
-  is_use: 1,
- 
+  access_address: '',
+  develop_id: '',
+  state: 1,
+  appid: '',
+  appsecret: ''
 })
+const password_eye = ref(false)
+const confirm_eye = ref(false);
 
 const validatePass = (rule, value, callback) => {
   if (value !== systemForm.password) {
@@ -72,22 +103,60 @@ const validatePass = (rule, value, callback) => {
     callback()
   }
 }
+const validateBusinessName = (rule, value, callback) => {
+  let params = null;
+   if (props.id){
+     params = {id: parseInt(props.id),business_name: value,organization_id: systemForm.organization_id}
+   }else {
+     params = {business_name: value,organization_id: systemForm.organization_id}
+   }
+
+  $axios.post(`/apaas/system/v5/user/check/business`,params)
+     .then((res) => {
+      if (res.data.code == 200) {
+            callback()
+      }else {
+          callback(new Error(res.data.data))
+      }
+     })
+}
+
+const validateSystemAccount = (rule, value, callback) => {
+  let params = null;
+   if (props.id){
+     params = {id: parseInt(props.id),system_account: value,}
+   }else {
+     params = {system_account: value}
+   }
+
+  $axios.post(`/apaas/system/v5/user/check/account`,params)
+     .then((res) => {
+      if (res.data.code == 200) {
+            callback()
+      }else {
+          callback(new Error(res.data.data))
+      }
+     })
+}
 
 const formRules = reactive({
-  org: [
+  organization_id: [
     { required: true, message: '请选择组织机构', trigger: 'blur' },
   ],
-  name: [
+  business_name: [
     { required: true, message: '请输入业务系统名称', trigger: 'blur' },
+    { validator: validateBusinessName, trigger: 'blur' },
   ],
-  role: [
+  system_role_id: [
     { required: true, message: '请选择角色', trigger: 'blur' },
   ],
-  account: [
+  system_account: [
     { required: true, message: '请输入账号', trigger: 'blur' },
+    { validator: validateSystemAccount, trigger: 'blur' },
   ],
   password: [
     { required: true, message: '请输入密码', trigger: 'blur' },
+    {min: 8,message: '密码长度不得低于8位',trigger: 'blur'}
   ],
   confirm_password: [
     { required: true, message: '请确认密码', trigger: 'blur' },
@@ -120,6 +189,38 @@ const setForm = (data) => {
   systemForm.value = Object.assign(systemForm, data);
 }
 
+const orgData = ref([])
+const treeProps = {
+  label: 'name',
+  children: 'Child',
+  value: 'organization_id'
+}
+const getOrgTree = () => {
+  $axios.get(`/apaas/system/v5/org/tree`)
+     .then((res) => {
+     if (res.data.code == 200) {
+         orgData.value = res.data.data || [];
+     }else {
+         $message.error(res.data.msg)
+     }
+     })
+}
+
+const copyText = (data) => {
+  navigator.clipboard.writeText(data).then(
+        function () {
+          
+        },
+        function () {
+          
+        }
+      );
+}
+
+onBeforeMount(() =>{
+  getOrgTree()
+})
+
 onMounted(() => {
 
 })

vite.config.js

@@ -35,6 +35,12 @@ export default {
         rewrite: path => path.replace(/^\/apaas\/system/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
         changeOrigin: true,  // true/false, Default: false - changes the origin of the host header to the target URL
         secure: false,//解决证书缺失问题
+      },
+      '/apaas/common':{
+        target: 'https://apaas5.wodcloud.com/apaas/common', // 所要代理的目标地址
+        rewrite: path => path.replace(/^\/apaas\/common/, ''), // 重写传过来的path路径，比如 `/api/index/1?id=10&name=zs`（注意:path路径最前面有斜杠（/），因此，正则匹配的时候不要忘了是斜杠（/）开头的；选项的 key 也是斜杠（/）开头的）
+        changeOrigin: true,  // true/false, Default: false - changes the origin of the host header to the target URL
+        secure: false,//解决证书缺失问题
       }
     }
   },