From b5acea8ed42d534cefa34d90f9eb1cd637dfe6d7 Mon Sep 17 00:00:00 2001 From: zhangshuaibao <15731629597@163.com> Date: 星期三, 31 三月 2021 09:11:49 +0800 Subject: [PATCH] Merge branch 'develop' of http://xearth.cn:6600/r/wuyushui/SewerAndRainNetwork into develop --- src/router/map.js | 4 src/store/modules/user.js | 149 ++++++++++++++ src/utils/navigation.js | 167 ++++++++++++++++ src/api/host.js | 6 src/store/index.js | 4 src/api/mapApi.js | 9 .env | 2 src/assets/images/login-page/page1.jpg | 0 .env.test | 2 src/api/mapUrl.js | 8 src/utils/tools.js | 11 + src/router/index.js | 29 ++ src/views/Login.vue | 124 ++++++++++++ src/api/index.js | 5 src/main.js | 3 src/utils/axios.js | 19 - .env.production | 2 src/app.config.js | 2 18 files changed, 509 insertions(+), 37 deletions(-) diff --git a/.env b/.env index 7b05847..d4d1f4c 100644 --- a/.env +++ b/.env @@ -2,7 +2,7 @@ NODE_ENV=development #vue椤圭洰 灞炴�у悕蹇呴』浠UE_APP_寮�澶达紝姣斿VUE_APP_XXX VUE_APP_MOCK=true -VUE_APP_API_HOST=http://localhost:8080/ +VUE_APP_API_HOST=http://xearth.cn:3000 VUE_APP_API_TOKEN_URL=https://auth.uat.siam.sinopec.com/ VUE_APP_API_BASE_URL=/api VUE_APP_CLIENT_ID=no_apply diff --git a/.env.production b/.env.production index eccd272..75961f6 100644 --- a/.env.production +++ b/.env.production @@ -1,7 +1,7 @@ # .env NODE_ENV=production VUE_APP_MOCK=false -VUE_APP_API_HOST=http://localhost:8080/ +VUE_APP_API_HOST=http://localhost:3000/ VUE_APP_API_BASE_URL=/api VUE_APP_API_TOKEN_URL=https://oauth.siam.sinopec.com/ VUE_APP_CLIENT_ID=no_apply diff --git a/.env.test b/.env.test index dc697e7..f5a8555 100644 --- a/.env.test +++ b/.env.test @@ -1,7 +1,7 @@ # .env NODE_ENV=test VUE_APP_MOCK=false -VUE_APP_API_HOST=http://localhost:8080/ +VUE_APP_API_HOST=http://localhost:3000/ VUE_APP_API_TOKEN_URL=https://auth.uat.siam.sinopec.com/ VUE_APP_API_BASE_URL=/api VUE_APP_CLIENT_ID=no_apply diff --git a/src/api/host.js b/src/api/host.js new file mode 100644 index 0000000..d2b8228 --- /dev/null +++ b/src/api/host.js @@ -0,0 +1,6 @@ +/** + * 鏈嶅姟HOST瀹氫箟 + */ +import { getSchemeHost } from '../utils/tools' + +export const $HOST = getSchemeHost() diff --git a/src/api/index.js b/src/api/index.js index 1df9919..62f9063 100644 --- a/src/api/index.js +++ b/src/api/index.js @@ -1,7 +1,4 @@ import * as mapApi from './mapApi' import * as mapUrl from './mapUrl' -export default { - mapApi, - mapUrl -} +export default Object.assign({}, mapApi, mapUrl) diff --git a/src/api/mapApi.js b/src/api/mapApi.js index 3cde8cb..7376708 100644 --- a/src/api/mapApi.js +++ b/src/api/mapApi.js @@ -3,13 +3,12 @@ // const $HOST = 'http://10.238.221.113' // 娴嬭瘯鐜IP锛歨ttp://10.238.221.113 import axios from '@utils/axios' +import * as mapUrl from './mapUrl' /** * 璇ユ柟娉曢厤缃� */ -class MapAPI { - getToken (param) { - axios.get(param.url, param.option) +export default { + getUser (data) { + return axios.get(mapUrl.GetUser, data) } } - -export default new MapAPI() diff --git a/src/api/mapUrl.js b/src/api/mapUrl.js index bc905e4..f5f7815 100644 --- a/src/api/mapUrl.js +++ b/src/api/mapUrl.js @@ -1,10 +1,6 @@ /** * 璇ユ枃浠堕厤缃帴鍙g殑URL鍦板潃 */ -class ApiURLs { - constructor () { - this.APIURL_HELLOWORLD = 'http://www.baidu.com' - } -} +import { $HOST } from './host' -export default new ApiURLs() +export const GetUser = $HOST + '/user/getUser' diff --git a/src/app.config.js b/src/app.config.js index cf2a95f..295d938 100644 --- a/src/app.config.js +++ b/src/app.config.js @@ -11,7 +11,7 @@ developmentOff: true // 璁句负true鍚庡湪寮�鍙戠幆澧冧笉浼氭敹闆嗛敊璇俊鎭� } }, - homeRouterName: 'Home', + homeRouterName: 'mapTemplate', loginRouteName: 'Login', routeMode: 'history', tagNavCache: false, diff --git a/src/assets/images/login-page/page1.jpg b/src/assets/images/login-page/page1.jpg new file mode 100644 index 0000000..96be519 --- /dev/null +++ b/src/assets/images/login-page/page1.jpg Binary files differ diff --git a/src/main.js b/src/main.js index e4615a1..653b668 100644 --- a/src/main.js +++ b/src/main.js @@ -15,12 +15,13 @@ import '@/utils/dialogDrag.js' import '@components/plugin/leaflet-measure-path/leaflet-measure-path.css' import '@components/plugin/leaflet-measure-path/leaflet-measure-path' - +const appConfig = require('@/app.config') Vue.config.productionTip = false Vue.use(ElementUI) Vue.prototype.$cancels = [] Vue.prototype.L = L +Vue.prototype.$config = appConfig Vue.prototype.$echarts = echarts // 鎸傝浇echarts // 娉ㄥ唽鎸囦护7 // registerDirectives(Vue) diff --git a/src/router/index.js b/src/router/index.js index 32dae04..6bc1550 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -1,10 +1,11 @@ import Vue from 'vue' import Router from 'vue-router' import { routes } from './routes' +import { getToken } from '@/utils/navigation' import 'nprogress/nprogress.css' const appConfig = require('@/app.config') -const { routeMode } = appConfig - +const { homeRouterName, loginRouteName, routeMode } = appConfig +const LOGIN_PAGE_ROUTE_NAME = loginRouteName Vue.use(Router) const baseName = process.env.NODE_ENV === 'production' ? `/${appConfig.projectName}/` : '/' const router = new Router({ @@ -17,12 +18,32 @@ cancel() }) Vue.prototype.$cancels = [] + const token = getToken() + if (!token && to.name !== LOGIN_PAGE_ROUTE_NAME) { + // 鏈櫥褰曚笖瑕佽烦杞殑椤甸潰涓嶆槸鐧诲綍椤� + next({ + name: LOGIN_PAGE_ROUTE_NAME // 璺宠浆鍒扮櫥褰曢〉 + }) + } else if (!token && to.name === LOGIN_PAGE_ROUTE_NAME) { + // 鏈櫥闄嗕笖瑕佽烦杞殑椤甸潰鏄櫥褰曢〉 + next() // 璺宠浆 + } else if (token && to.name === LOGIN_PAGE_ROUTE_NAME) { + // 宸茬櫥褰曚笖瑕佽烦杞殑椤甸潰鏄櫥褰曢〉 + next({ + name: homeRouterName // 璺宠浆鍒癶omeName椤� + }) + } else if (!token) { + next({ + name: LOGIN_PAGE_ROUTE_NAME // 璺宠浆鍒扮櫥褰曢〉 + }) + } else { + next() + } // 涓嶉渶瑕佺櫥褰曡璇佺殑璺敱 if (Object.hasOwnProperty.call(to.meta, 'noLoginIdentify') && to.meta.noLoginIdentify) { next() - return } - next() + // next() }) router.beforeResolve((to, from, next) => { next() diff --git a/src/router/map.js b/src/router/map.js index 9372783..328884b 100644 --- a/src/router/map.js +++ b/src/router/map.js @@ -9,8 +9,10 @@ * } */ const MapTemplate = (r) => require.ensure([], () => r(require('../views/MapTemplate')), 'frame') +const Login = (r) => require.ensure([], () => r(require('../views/Login')), 'frame') const routes = [ - { path: '/mapTemplate', name: 'MapTemplate', meta: { statusBgc: 0 }, component: MapTemplate } + { path: '/mapTemplate', name: 'MapTemplate', meta: { statusBgc: 0 }, component: MapTemplate }, + { path: '/Login', name: 'Login', meta: { statusBgc: 0 }, component: Login } ] // 鎵�鏈変笂闈㈠畾涔夌殑璺敱閮借鍐欏湪涓嬮潰鐨剅outes閲� diff --git a/src/store/index.js b/src/store/index.js index 1b3e167..2d18c38 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -1,6 +1,7 @@ import Vue from 'vue' import Vuex from 'vuex' import map from './modules/map' +import user from './modules/user' // import app from './modules/app' Vue.use(Vuex) @@ -13,6 +14,7 @@ }, modules: { // app, - map + map, + user } }) diff --git a/src/store/modules/user.js b/src/store/modules/user.js new file mode 100644 index 0000000..57ed576 --- /dev/null +++ b/src/store/modules/user.js @@ -0,0 +1,149 @@ +import $API from '../../api' +import $http from '@/utils/axios' +import { setToken, getToken, setAccount, getAccount } from '@/utils/navigation' +// import { replaceUrlParams } from '@/utils/tools' + +const state = { + account: '', + userName: '', + userId: '', + avator: '', + orgUnitName: '', + orgUnitCode: '', + orgUnitLevel: '', + orgSectorName: '', + orgSectorCode: '', + isAdmin: null, + token: getToken(), + access: 0, + hasGetInfo: false +} + +const mutations = { + setAvator (state, avator) { + state.avator = avator + }, + setUserId (state, id) { + state.userId = id + }, + setAccount (state, account) { + state.account = account + setAccount(account) + }, + setUserName (state, name) { + state.userName = name + }, + setOrgUnitName (state, orgUnitName) { + state.orgUnitName = orgUnitName + }, + setOrgUnitCode (state, orgUnitCode) { + state.orgUnitCode = orgUnitCode + }, + setOrgSectorName (state, orgSectorName) { + state.orgSectorName = orgSectorName + }, + setOrgSectorCode (state, orgSectorCode) { + state.orgSectorCode = orgSectorCode + }, + setOrgUnitLevel (state, orgUnitLevel) { + state.orgUnitLevel = orgUnitLevel + }, + setAdmin (state, isAdmin) { + state.isAdmin = isAdmin + }, + setAccess (state, access) { + state.access = access + }, + setToken (state, token) { + state.token = token + setToken(token) + }, + setHasGetInfo (state, status) { + state.hasGetInfo = status + } +} + +const actions = { + // 鐧诲綍 + handleLogin ({ commit }, { account, password }) { + return new Promise((resolve, reject) => { + $http.post($API.GetUser, { + userName: account, + passWord: password + }).then(data => { + console.log(data) + commit('setToken', '12345668') + commit('setAccount', account) + resolve() + }).catch(err => { + reject(err) + }) + }) + }, + // 閫�鍑虹櫥褰� + handleLogOut ({ state, commit }) { + return new Promise((resolve, reject) => { + commit('setToken', '') + commit('setAccount', '') + commit('setAccess', 0) + resolve() + }) + }, + // 鑾峰彇鐢ㄦ埛淇℃伅 + getUserInfo ({ state, commit, dispatch }) { + const account = getAccount() || 'admin' + return new Promise((resolve, reject) => { + try { + $http.get($API.AAA_GET_USER_INFO, { + token: state.token + }).then(response => { + const data = response.data + commit('setAvator', data.avator) + // commit('setOrgUnitName', data.orgUnitName) + // commit('setOrgUnitCode', data.orgUnitCode) + commit('setUserId', data.userId) + commit('setAccess', data.access) + commit('setHasGetInfo', true) + if (account === 'tianjun') { + // admin鐨勫満鏅蛋mock + commit('setAccount', data.account) + commit('setUserName', data.userName) + resolve(data) + } else { + $http.get($API.MDM_GET_USER_ACCOUNT_DETAIL, { + account: account + }).then(response => { + const d = response.data + if (d) { + commit('setAccount', d.unifiedIdentityAcc) + commit('setUserName', d.userName) + // 鑾峰彇鐢ㄦ埛鍚庯紝鑾峰彇缁勭粐鏈烘瀯 + dispatch('getUserOrgInfo').then(() => { + resolve(d) + }).catch(err => { + alert('涓嶈兘鑾峰彇鐢ㄦ埛缁勭粐鏈烘瀯') + reject(err) + }) + } else { + commit('setToken', '') + commit('setAccount', '') + commit('setAccess', 0) + resolve(false) + } + }) + } + }).catch(err => { + reject(err) + }) + } catch (error) { + reject(error) + } + }) + } +} + +export default { + state, + mutations, + actions +} diff --git a/src/utils/axios.js b/src/utils/axios.js index 7f944e8..d42baf4 100644 --- a/src/utils/axios.js +++ b/src/utils/axios.js @@ -83,8 +83,7 @@ // 鍒涘缓axios瀹炰緥 const Service = axios.create({ - timeout: 5000, - baseURL: 'http://10.246.162.140:8080/' + timeout: 1000 }) const CancelToken = axios.CancelToken @@ -140,14 +139,14 @@ // respone鎷︽埅鍣� Service.interceptors.response.use( response => { - // const res = response.data - // if (Number(res.code) !== 200 && Number(res.code) !== 0) { - // $T.warning(res.message) - // return Promise.reject(res.message) - // } else { - // return res - // } - return response.data + const res = response.data + /* if (Number(res.code) !== 200 && Number(res.code) !== 0) { + $T.warning(res.message) + return Promise.reject(res.message) + } else { + return res + } */ + return res }, error => { if (error.message && error.message.includes('timeout')) { diff --git a/src/utils/navigation.js b/src/utils/navigation.js new file mode 100644 index 0000000..1c09633 --- /dev/null +++ b/src/utils/navigation.js @@ -0,0 +1,167 @@ +import Cookies from 'js-cookie' +const appConfig = require('@/app.config') +const { cookieExpires } = appConfig + +export const TOKEN_KEY = 'token' +export const ACCOUNT_KEY = 'account' +export const setToken = (token) => { + Cookies.set(TOKEN_KEY, token, { expires: cookieExpires || 1 }) +} + +export const getToken = () => { + const token = Cookies.get(TOKEN_KEY) + if (token !== 'undefined') return token + else return false +} + +export const setAccount = (account) => { + Cookies.set(ACCOUNT_KEY, account, { expires: cookieExpires || 1 }) +} + +export const getAccount = () => { + const account = Cookies.get(ACCOUNT_KEY) + if (account) return account + else return false +} + +export const hasChild = (item) => { + return item.children && item.children.length !== 0 +} + +/** + * @description 鏈湴瀛樺偍鍜岃幏鍙栨爣绛惧鑸垪琛� + */ +export const setTagNavListToLocalstorage = list => { + localStorage.tagNaveList = JSON.stringify(list) +} + +/** + * @returns {Array} 鍏朵腑鐨勬瘡涓厓绱犲彧鍖呭惈璺敱鍘熶俊鎭腑鐨刵ame, path, meta涓夐」 + */ +export const getTagNavListFromLocalstorage = () => { + const list = localStorage.tagNaveList + return list ? JSON.parse(list) : [] +} + +/** + * @param {Array} routers 璺敱鍒楄〃鏁扮粍 + * @description 鐢ㄤ簬鎵惧埌璺敱鍒楄〃涓璶ame涓篽ome鐨勫璞� + */ +export const getHomeRouter = (routers, homeName = 'Home') => { + let i = -1 + const len = routers.length + let homeRoute = {} + while (++i < len) { + const item = routers[i] + if (item.children && item.children.length) { + const res = getHomeRouter(item.children, homeName) + if (res.name) return res + } else { + if (item.name === homeName) homeRoute = item + } + } + return homeRoute +} + +/** + * @param {*} list 鐜版湁鏍囩瀵艰埅鍒楄〃 + * @param {*} newRoute 鏂版坊鍔犵殑璺敱鍘熶俊鎭璞� + * @description 濡傛灉璇ewRoute宸茬粡瀛樺湪鍒欎笉鍐嶆坊鍔� + */ +export const getNewTagList = (list, newRoute) => { + const { name, path, meta } = newRoute + const newList = [...list] + if (newList.findIndex(item => item.name === name) >= 0) return newList + else newList.push({ name, path, meta }) + return newList +} + +/** + * @param {Number} times 鍥炶皟鍑芥暟闇�瑕佹墽琛岀殑娆℃暟 + * @param {Function} callback 鍥炶皟鍑芥暟 + */ +export const doCustomTimes = (times, callback) => { + let i = -1 + while (++i < times) { + callback(i) + } +} + +export const findNodeUpper = (ele, tag) => { + if (ele.parentNode) { + if (ele.parentNode.tagName === tag.toUpperCase()) { + return ele.parentNode + } else { + return findNodeUpper(ele.parentNode, tag) + } + } +} + +export const findNodeUpperByClasses = (ele, classes) => { + const parentNode = ele.parentNode + if (parentNode) { + const classList = parentNode.classList + if (classList && classes.every(className => classList.contains(className))) { + return parentNode + } else { + return findNodeUpperByClasses(parentNode, classes) + } + } +} + +export const findNodeDownward = (ele, tag) => { + const tagName = tag.toUpperCase() + if (ele.childNodes.length) { + let i = -1 + const len = ele.childNodes.length + while (++i < len) { + const child = ele.childNodes[i] + if (child.tagName === tagName) return child + else return findNodeDownward(child, tag) + } + } +} + +export const localSave = (key, value) => { + localStorage.setItem(key, value) +} + +export const localRead = (key) => { + return localStorage.getItem(key) || '' +} + +// scrollTop animation +export const scrollTop = (el, from = 0, to, duration = 500, endCallback) => { + if (!window.requestAnimationFrame) { + window.requestAnimationFrame = ( + window.webkitRequestAnimationFrame || + window.mozRequestAnimationFrame || + window.msRequestAnimationFrame || + function (callback) { + return window.setTimeout(callback, 1000 / 60) + } + ) + } + const difference = Math.abs(from - to) + const step = Math.ceil(difference / duration * 50) + + const scroll = (start, end, step) => { + if (start === end) { + endCallback && endCallback() + return + } + + let d = (start + step > end) ? end : start + step + if (start > end) { + d = (start - step < end) ? end : start - step + } + + if (el === window) { + window.scrollTo(d, d) + } else { + el.scrollTop = d + } + window.requestAnimationFrame(() => scroll(d, end, step)) + } + scroll(from, to, step) +} diff --git a/src/utils/tools.js b/src/utils/tools.js index 0838a7f..f47703e 100644 --- a/src/utils/tools.js +++ b/src/utils/tools.js @@ -25,7 +25,16 @@ }) return arr } - +/** + * 鏍规嵁涓嶅悓鐨勫崗璁紝鏇挎崲env閰嶇疆鏂囦欢涓殑URL鍗忚 + * + * @return {String} + */ +export function getSchemeHost () { + const protocol = window.location.protocol + const host = process.env.VUE_APP_API_HOST + return host.replace(/scheme/g, protocol) +} /** * collection鏁版嵁杞崲涓烘爣鍑咼SON * @param obj collection鏁版嵁 diff --git a/src/views/Login.vue b/src/views/Login.vue new file mode 100644 index 0000000..6d8a076 --- /dev/null +++ b/src/views/Login.vue @@ -0,0 +1,124 @@ +<template> + <div class="login-wrap" @keydown.enter="handleSubmit"> + <div class="content"> + <el-card class="box-card"> + <div slot="header" class="login-title clearfix"> + <el-icon name="star-on"></el-icon> + <span>娆㈣繋鐧诲綍</span> + </div> + + <div class="form-content"> + <el-form :model="form" :rules="formRules" ref="loginForm" class="demo-ruleForm"> + <el-form-item prop="account"> + <el-input size="small" v-model="form.account" placeholder="璇疯緭鍏ョ敤鎴峰悕"> + <el-button slot="prepend" icon="el-icon-search" style="padding: 12px 10px;"></el-button> + </el-input> + </el-form-item> + <el-form-item prop="password"> + <el-input size="small" type="password" v-model="form.password" auto-complete="off" + placeholder="璇疯緭鍏ュ瘑鐮�"> + <el-button slot="prepend" icon="el-icon-search" style="padding: 12px 10px;"></el-button> + </el-input> + </el-form-item> + <el-form-item> + <el-button size="small" type="primary" @click="handleSubmit" style="width: 100%">鐧诲綍 + </el-button> + </el-form-item> + </el-form> + </div> + <p class="login-tip">杈撳叆浠绘剰鐢ㄦ埛鍚嶅拰瀵嗙爜鍗冲彲</p> + </el-card> + </div> + </div> +</template> + +<script> +import { mapActions } from 'vuex' + +export default { + name: 'Login', + components: {}, + data () { + return { + form: { + account: 'admin', + password: 'admin' + }, + formRules: { + account: [ + { required: true, message: '璐﹀彿涓嶈兘涓虹┖', trigger: 'blur' } + ], + password: [ + { required: true, message: '瀵嗙爜涓嶈兘涓虹┖', trigger: 'blur' } + ] + } + } + }, + methods: { + ...mapActions([ + 'handleLogin', + 'getUserInfo' + ]), + handleSubmit () { + this.$refs.loginForm.validate((valid) => { + if (valid) { + this.handleLogin({ + account: this.form.account, + password: this.form.password + }).then(response => { + this.$router.push({ + name: this.$config.homeRouterName + }) + }) + } + }) + } + } +} +</script> + +<style lang="less"> + .login-wrap { + position: relative; + background-image: url('../assets/images/login-page/page1.jpg'); + background-size: cover; + background-position: center; + width: 100%; + height: 100%; + overflow: hidden; + + .content { + position: absolute; + right: 160px; + top: 25%; + } + .box-card { + width: 300px; + } + .clearfix:before, + .clearfix:after { + display: table; + content: ""; + } + .clearfix:after { + clear: both + } + .form-content { + padding: 10px 0 0; + } + .login-title { + width: 100%; + font-size: 14px; + color: #1c2438; + font-weight: 700; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; + } + .login-tip { + font-size: 10px; + text-align: center; + color: #c3c3c3; + } + } +</style> -- Gitblit v1.8.0