A Vue.js project use bootstrap4、 bootstrap-vue、 element-ui
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
For a detailed explanation on how things work, check out the guide and docs for vue-loader.
1、 vue-cli 项目基础构建
2、 Appwork © 构建的bootstrap4 项目 为方便引入 element ui 组件
3、 引入axios(已经封装, 直接this.$httpAxios调用)目前禁用
4、 引入fetch (已经封装)
import {
httpGET,
httpPOST,
httpPUT,
httpDEL,
refreshToken
} from '@/server/common/httpFetch'
5、 components/common/util 通用工具函数目录
6、 vendor/styles/common.scss 通用样式目录
说明:
1、 函数必须接收将要跳转的B系统具体路径 http://localhost:8091/#/workSignIn/workSignInManagement
2、 刷新当前token后 ——> 拼接loginedInfo, expires_in, basicUserInfo————>window.open 跳转
// 引入:
import {
mapActions
} from 'vuex'
// 声明
methods: { ...mapActions(['openNewWindowtab'])
}
// 调用:
< Button @click = "openNewWindowtab('http://localhost:8091/#/workSignIn/workSignInManagement')" > Button < /Button>
说明:
1、 函数必须接收将要跳转的B系统具体路径 http://localhost:8091/#/workSignIn/workSignInManagement
2、 刷新当前token后 ——> 拼接loginedInfo, expires_in, basicUserInfo————>window.open 跳转
// 引入:
import {
mapActions
} from 'vuex'
// 声明
methods: { ...mapActions(['openNewWindowtab'])
}
// 调用:
< Button @click = "openNewWindowtab('http://localhost:8091/#/workSignIn/workSignInManagement')" > Button < /Button>
说明:
created() {
console.log(this.$store.state.projectName, 'projectName', this.$route.query)
// 初始化数据
let urlLoginInfo = this.$route.query
let token = JSON.parse(sessionStorage.getItem('loginedInfo')) && JSON.parse(sessionStorage.getItem('loginedInfo')).access_token
if (urlLoginInfo && urlLoginInfo.expires_in && urlLoginInfo.expires_in !== '' && urlLoginInfo.loginedInfo && urlLoginInfo.loginedInfo !== '' && urlLoginInfo.basicUserInfo && urlLoginInfo.basicUserInfo !== '') {
sessionStorage.setItem('expires_in', urlLoginInfo.expires_in)
sessionStorage.setItem('loginedInfo', urlLoginInfo.loginedInfo)
sessionStorage.setItem('basicUserInfo', urlLoginInfo.basicUserInfo)
/* 获取菜单 */
this.getMenuList()
} else if (token && token !== '') {
this.getMenuList()
} else {
router.push({
path: '/login'
})
}
}
说明:
默认获取当前sessionStorage.getItem('userInfo') 如果没有再去获取地址栏中的参数
// 引入:
import {
mapGetters
} from 'vuex'
// 声明
computed: { ...mapGetters(['basicUserInfo'])
}
// 调用:
created() {
console.log(this.basicUserInfo, '获取基础信息')
}