# fschool_common-attendance > A Vue.js project use bootstrap4、 bootstrap-vue、element-ui ## Build Setup ``` bash # 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](http://vuejs-templates.github.io/webpack/) and [docs for vue-loader](http://vuejs.github.io/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 通用样式目录 ### 关于跳过验证相关问题: ###### openNewWindowtab 跳转函数(用于跳转到B系统函数,写在VueX中action中) > 说明: > 1、函数必须接收将要跳转的B系统具体路径 http://localhost:8091/#/workSignIn/workSignInManagement > 2、刷新当前token后 ——> 拼接loginedInfo,expires_in,basicUserInfo————>window.open 跳转 ``` 引入: import {mapActions} from 'vuex' 声明 methods: { ...mapActions(['openNewWindowtab']) } 调用: ``` ### 关于跳过验证相关问题: ###### openNewWindowtab 跳转函数(用于跳转到B系统函数,写在VueX中action中) > 说明: > 1、函数必须接收将要跳转的B系统具体路径 http://localhost:8091/#/workSignIn/workSignInManagement > 2、刷新当前token后 ——> 拼接loginedInfo,expires_in,basicUserInfo————>window.open 跳转 ``` 引入: import {mapActions} from 'vuex' 声明 methods: { ...mapActions(['openNewWindowtab']) } 调用: ``` ###### B系统得到地址栏参数后 ,进行初始化及菜单渲染(此处已实现不要调用) > 说明: ``` 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' }) } } ``` ###### basicUserInfo 获得登录人通用参数(用于跳转到B系统取值,写在VueX中getters中) > 说明: > 默认获取当前sessionStorage.getItem('userInfo') 如果没有再去获取地址栏中的参数 ``` 引入: import { mapGetters } from 'vuex' 声明 computed: { ...mapGetters(['basicUserInfo']) } 调用: created() { console.log(this.basicUserInfo, '获取基础信息') } ```