请求服务器域名调整&增减管理界面

src/App.vue

@@ -1,21 +1,30 @@
 <template>
   <div id="app">
-    <router-view v-if="$store.state.user.baseUrl" />
+    <router-view />
     <deomon-topic ref="deomonTopic" />
     <img v-show="loading" :src="loadingImg" class="AppAll">
+    <div
+      v-if="!$store.state.user.baseUrl"
+      v-loading="!$store.state.user.baseUrl"
+      element-loading-text="拼命加载中"
+      element-loading-background="rgba(0, 0, 0, 0)"
+      element-loading-spinner="el-icon-loading"
+      style="width: 100%;height: 100%;"
+    >
+      <img :src="appLoading" class="centerImg">
+    </div>
   </div>
 </template>
 
 <script>
 import { getToken } from '@/utils/auth';
 import { getSessionStorage } from '@/utils/auth';
-import { loginInfo, ProjectIcon, ProjectCode } from '@/scripts/ProjectConfig';
+import { loginInfo, ProjectIcon } from '@/scripts/ProjectConfig';
 import DeomonTopic from '@/views/demonstration/deomonTopic';
 import WindowResizeHandler from '@/mixin/WindowResizeHandler';
 import LoadingImg from '@/assets/loading.gif';
+import AppLoading from '@/assets/appLoading.png';
 import { openIndexedDB } from '@/utils/indexedDb';
-import { getBaseUrlByProject } from '@/api/projectServer';
-import { localPackageProject } from '@/scripts/ProjectConfig';
 
 export default {
     name: 'App',
@@ -28,6 +37,7 @@ export default {
     data() {
         return {
             loadingImg: LoadingImg,
+            appLoading: AppLoading,
             loading: false
         };
     },
@@ -64,25 +74,8 @@ export default {
             this.loading = false;
         }
     },
-    async created() {
+    created() {
-        let project = '';
+        const project = getSessionStorage('project');
-        if (this.$route.query.project && this.$route.path.includes('login')) {
-            project = this.$route.query.project;
-            const split = this.$route.path.split('/')[1];
-            if (process.env.VUE_APP_PRO) {
-                project = localPackageProject[process.env.VUE_APP_PRO + split];
-            } else if (split == 'design') {
-                project = project ? split + project : split;
-            } else if (split == 'login') {
-                project = project || 'login';
-            } else {
-                project = split;
-            }
-        } else {
-            project = getSessionStorage('project');
-        }
-        const resp = await getBaseUrlByProject(ProjectCode[project]);
-        resp && resp.data && this.$store.dispatch('setBaseUrl', resp.data.domainName);
         if (project) {
             document.querySelector("link[rel*='icon']").href = loginInfo[project].linkIcon || ProjectIcon[project];
         }
@@ -132,4 +125,13 @@ export default {
 </script>
 <style lang="scss" scoped>
 .AppAll{position: absolute;top: 0;left: 0;width: 100%;height: 100%;z-index: 2003}
+	.centerImg {
+		position: absolute;
+		left:50%;
+		top: 50%;
+		width: 480px;
+		height: 456px;
+		margin-left: -240px;
+		margin-top: -228px;
+	}
 </style>

src/api/projectServer.js

@@ -7,3 +7,34 @@ export function getBaseUrlByProject(project) {
         method: 'get'
     });
 }
+/** 分页查询项目服务器 */
+export function projectServerPaging(params) {
+    return request({
+        url: `/api/projectServer/paging`,
+        method: 'get',
+        params
+    });
+}
+/** 创建项目服务器数据 */
+export function createProjectServer(data) {
+    return request({
+        url: `/api/projectServer`,
+        method: 'post',
+        data
+    });
+}
+/** 修改项目服务器数据 */
+export function updateProjectServer(id, data) {
+    return request({
+        url: `/api/projectServer/${id}`,
+        method: 'put',
+        data
+    });
+}
+/** 删除项目服务器数据 */
+export function deleteProjectServer(id) {
+    return request({
+        url: `/api/projectServer/${id}`,
+        method: 'delete'
+    });
+}

src/i18n/langs/en/router.js

@@ -99,5 +99,6 @@ export default {
     publishISCSManage:'publish ISCS Manage',
     voiceTraining: 'Voice Training',
     mapGroup: 'Map Group',
-    drawingMange:'Drawing Mange'
+    drawingMange:'Drawing Mange',
+    projectServer: 'Project Server'
 };

src/i18n/langs/zh/router.js

@@ -103,5 +103,6 @@ export default {
     publishISCSManage:'发布ISCS管理',
     voiceTraining: '语音训练',
     mapGroup: '地图分组',
-    drawingMange:'图纸管理'
+    drawingMange:'图纸管理',
+    projectServer: '项目域名'
 };

src/permission.js

@@ -1,11 +1,13 @@
 import Vue from 'vue';
 import store from '@/store/index';
 import router from './router/index';
-import {loginInfo} from '@/scripts/ProjectConfig';
+import {loginInfo, ProjectCode, localPackageProject} from '@/scripts/ProjectConfig';
 import NProgress from 'nprogress';
 import 'nprogress/nprogress.css';
 import { setToken, getToken, removeToken, getSessionStorage } from '@/utils/auth';
+import { getBaseUrlByProject } from '@/api/projectServer';
 import localStore from 'storejs';
+import { getBaseUrl } from '@/utils/baseUrl';
 
 const whiteList = ['/login', '/design/login', '/gzzbxy/relay', '/authorization', '/AUSline', '/AUStool', '/demo', '/thirdLogin']; // 不重定向白名单
 
@@ -66,8 +68,31 @@ function handleRoute(to, next, loginPath) {
     }
 }
 
-router.beforeEach((to, from, next) => {
+router.beforeEach( async (to, from, next) => {
-    const project = getSessionStorage('project');
+    let project = '';
+    if (to.path.includes('login')) {
+        project = to.query.project;
+        const split = to.path.split('/')[1];
+        if (process.env.VUE_APP_PRO) {
+            project = localPackageProject[process.env.VUE_APP_PRO + split];
+        } else if (split == 'design') {
+            project = project ? split + project : split;
+        } else if (split == 'login') {
+            project = project || 'login';
+        } else {
+            project = split;
+        }
+    } else {
+        project = getSessionStorage('project');
+    }
+    if (!store.state.user.baseUrl) {
+        const resp = await getBaseUrlByProject(ProjectCode[project]);
+        if (resp && resp.data && resp.data.domainName) {
+            store.dispatch('setBaseUrl', resp.data.domainName);
+        } else {
+            store.dispatch('setBaseUrl', getBaseUrl());
+        }
+    }
     document.title = loginInfo[project || 'login'].browserTitle || loginInfo[project || 'login'].title;
     NProgress.start();
     const loginPath = getRouteInfo(to);

src/router/index.js

@@ -21,8 +21,6 @@ const Jlmap3dZzwwTest = () => import('@/views/jlmap3d/otherproject/zzww/zzwwtest
 const XzExam = () => import('@/views/jlmap3d/otherproject/xzexam/xzexam');
 const LcJy = () => import('@/views/jlmap3d/otherproject/xzexam/lcjy');
 
-
-
 const Jlmap3d = () => import('@/views/jlmap3d/drive/jl3ddrive');
 const Jlmap3dSandbox = () => import('@/views/jlmap3d/simulation/jl3dsimulation');
 const Jlmap3dPassFlow = () => import('@/views/jlmap3d/passflow/jl3dpassflow');
@@ -193,6 +191,7 @@ const UeditorDraftList = () => import('@/views/editor/listDraft');
 const UploadPdfList = () => import('@/views/uploadPdf/list');
 
 const ThirdLogin = () => import('@/views/thirdLogin');
+const ProjectServer = () => import('@/views/system/serverManage');
 
 // import { GenerateRouteProjectList } from '@/scripts/ProjectConfig';
 // import { getSessionStorage } from '@/utils/auth';
@@ -1203,6 +1202,13 @@ export const asyncRouter = [
                 meta: {
                     i18n: 'router.voiceTraining'
                 }
+            },
+            {
+                path: 'projectServer',
+                component: ProjectServer,
+                meta: {
+                    i18n: 'router.projectServer'
+                }
             }
             // {
             //     path: 'deviceManage',

src/views/login/index.vue

@@ -593,7 +593,7 @@ export default {
                 });
             } else if (this.project === 'zzwwtest') {
                 this.$router.push({ path: '/jlmap3d/zzwwtest', query: {lessonId:'35'} });
-            }else if (this.project === 'xzexam') {
+            } else if (this.project === 'xzexam') {
                 this.$router.push({ path: '/jlmap3d/xzexam', query: {} });
             } else if (this.project === 'richorlesson3d') {
                 this.$router.push({ path: '/jlmap3d/lesson3dselect', query: {} });

src/views/system/serverManage/add.vue

@@ -0,0 +1,110 @@
+<template>
+  <el-dialog v-dialogDrag :title="title" :visible.sync="dialogVisible" width="30%" :before-close="handleClose" center :close-on-click-modal="false">
+    <data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
+    <span slot="footer" class="dialog-footer">
+      <el-button v-loading="loading" type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
+      <el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
+    </span>
+  </el-dialog>
+</template>
+
+<script>
+import { createProjectServer, updateProjectServer } from '@/api/projectServer';
+export default {
+    name: 'DeviceAdd',
+    props: {
+        projectList: {
+            type: Array,
+            required: true
+        }
+    },
+    data() {
+        return {
+            dialogVisible: false,
+            formModel: {
+                id: '',
+                domainName: '',
+                project: ''
+            },
+            loading: false
+        };
+    },
+    computed: {
+        form() {
+            const form = {
+                labelWidth: '120px',
+                items: [
+                    { prop: 'domainName', label: '域名', type: 'text', required: true, placeholder: '请输入域名' },
+                    { prop: 'project', label: '项目', type: 'select', required: true, options: this.projectList, placeholder: '请选择项目' }
+                ]
+            };
+            return form;
+        },
+        rules() {
+            const crules = {
+                domainName: [
+                    { required: true, message: '请输入域名', trigger: 'blur' }
+                ],
+                project: [
+                    { required: true, message: '请选择项目', trigger: 'change' }
+                ]
+            };
+            return crules;
+        },
+        title() {
+            return this.formModel.id ? '修改项目域名' : '创建项目域名';
+        }
+    },
+    mounted() {
+    },
+    methods: {
+        show(data) {
+            if (data) {
+                this.formModel.id = data.id;
+                this.formModel.domainName = data.domainName;
+                this.formModel.project = data.project;
+            }
+            this.dialogVisible = true;
+        },
+        doSave() {
+            this.$refs.dataform.validateForm(() => {
+                this.loading = true;
+                const data = {
+                    id: this.formModel.id,
+                    domainName: this.formModel.domainName,
+                    project: this.formModel.project.toUpperCase()
+                };
+                if (data.id) {
+                    updateProjectServer(data.id, data).then(resp => {
+                        this.$message.success('修改项目域名数据成功！');
+                        this.handleClose();
+                        this.$emit('reloadTable');
+                    }).catch(error => {
+                        this.$message.error(error.message);
+                        this.loading = false;
+                    });
+                } else {
+                    createProjectServer(data).then(resp => {
+                        this.$message.success('创建项目域名数据成功！');
+                        this.handleClose();
+                        this.$emit('reloadTable');
+                    }).catch(error => {
+                        this.$message.error(error.message);
+                        this.loading = false;
+                    });
+                }
+            });
+        },
+        handleClose() {
+            this.formModel = {
+                id: '',
+                domainName: '',
+                project: ''
+            };
+            this.$refs.dataform.resetForm();
+            this.dialogVisible = false;
+            this.loading = false;
+        }
+    }
+};
+</script>

src/views/system/serverManage/index.vue

@@ -0,0 +1,163 @@
+<template>
+  <div>
+    <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
+    <add-server ref="addServer" :project-list="projectList" @reloadTable="reloadTable" />
+  </div>
+</template>
+
+<script>
+import { projectServerPaging, deleteProjectServer } from '@/api/projectServer';
+import { getSessionStorage } from '@/utils/auth';
+import { ProjectList } from '@/scripts/ProjectConfig';
+import AddServer from './add';
+export default {
+    name: 'DeviceManage',
+    components: {
+        AddServer
+    },
+    data() {
+        return {
+            examResultList: [],
+            url: '',
+            pagerConfig: {
+                pageSize: 'pageSize',
+                pageIndex: 'pageNum'
+            },
+            queryForm: {
+                labelWidth: '120px',
+                beforeQuery: this.beforeQuery,
+                reset: true,
+                queryObject: {
+                    project: {
+                        type: 'select',
+                        label: '项目:',
+                        config: {
+                            data: []
+                        }
+                    }
+                }
+
+            },
+            queryList: {
+                query: projectServerPaging,
+                selectCheckShow: false,
+                indexShow: true,
+                columns: [
+                    {
+                        title: '域名',
+                        prop: 'domainName'
+                    },
+                    {
+                        title: '项目名称',
+                        prop: 'projectCode',
+                        type: 'tag',
+                        columnValue: (row) => { return this.handleProjectName(row.project, this.projectList); },
+                        tagType: (row) => { return 'success'; }
+                    },
+                    {
+                        title: '创建时间',
+                        prop: 'createTime',
+                        type: 'tag',
+                        columnValue: (row) => { return this.handleTime(row.createTime); },
+                        tagType: (row) => { return 'success'; }
+                    },
+                    {
+                        type: 'button',
+                        title: this.$t('global.operate'),
+                        width: '300',
+                        buttons: [
+                            {
+                                name: '编辑',
+                                handleClick: this.editConfig
+                            },
+                            {
+                                name: this.$t('global.delete'),
+                                handleClick: this.handleDelete,
+                                type: 'danger'
+                            }
+                        ]
+                    }
+                ],
+                actions: [
+                    { text: this.$t('global.add'), handler: this.createProjectServer}
+                ]
+            },
+            currentModel: {}
+        };
+    },
+    computed: {
+        projectCode() {
+            return this.projectMap[getSessionStorage('project')];
+        },
+        projectList() {
+            return [{value: 'default', label: '默认'}, ...ProjectList];
+        }
+    },
+    mounted() {
+        this.queryForm.queryObject.project.config.data = this.projectList;
+    },
+    methods: {
+        createProjectDevice() {
+            this.$refs.add.show();
+        },
+        beforeQuery(params) {
+            params.project = params.project.toUpperCase();
+            return params;
+        },
+        computation(fieldValue, type) {
+            let list = [];
+            if (type === 'projectType') {
+                list = this.projectList;
+            } else if ( type === 'deviceType' ) {
+                list = this.deviceTypeList;
+            }
+            let value = '';
+            list.forEach((elem) => {
+                elem.label = fieldValue;
+                value = elem.value;
+            });
+            console.log(value, fieldValue, type);
+            return value;
+        },
+        handleTime(time) {
+            const timeList = time.split('T');
+            let newTime = '';
+            if (timeList.length > 1) {
+                newTime = timeList[0] + ' ' + timeList[1];
+            } else {
+                newTime = time;
+            }
+            return newTime;
+        },
+        // 删除
+        handleDelete(index, row) {
+            this.$confirm('此操作将删除该域名数据！', this.$t('global.tips'), {
+                confirmButtonText: this.$t('global.confirm'),
+                cancelButtonText: this.$t('global.cancel'),
+                type: 'warning'
+            }).then(() => {
+                deleteProjectServer(row.id).then(response => {
+                    this.$message.success(this.$t('system.deleteSuccess'));
+                    this.reloadTable();
+                }).catch(() => {
+                    this.reloadTable();
+                    this.$messageBox(this.$t('error.deleteFailed'));
+                });
+            });
+        },
+        handleProjectName(projectCode, projectList) {
+            const project = projectList.find(elem => elem.value.toUpperCase() === projectCode);
+            return project ? project.label : '无效项目';
+        },
+        createProjectServer() {
+            this.$refs.addServer.show();
+        },
+        editConfig(index, row) {
+            this.$refs.addServer.show(row);
+        },
+        reloadTable() {
+            this.queryList.reload();
+        }
+    }
+};
+</script>