|
|
@@ -70,6 +70,20 @@
|
|
|
<switch-environment v-if="$nodeEnv === 'development'" />
|
|
|
</van-cell-group>
|
|
|
|
|
|
+ <!-- 扫一扫 -->
|
|
|
+ <van-cell-group>
|
|
|
+ <van-row
|
|
|
+ type="flex"
|
|
|
+ justify="center"
|
|
|
+ class="ibps-cell-wrapper scan-btn-wrapper"
|
|
|
+ >
|
|
|
+ <van-col span="24">
|
|
|
+ <van-button type="default" block :size="size" @click="scanCode">
|
|
|
+ 扫一扫
|
|
|
+ </van-button>
|
|
|
+ </van-col>
|
|
|
+ </van-row>
|
|
|
+ </van-cell-group>
|
|
|
<!-- 退出登录 -->
|
|
|
<van-cell-group>
|
|
|
<van-row type="flex" justify="center" class="ibps-cell-wrapper">
|
|
|
@@ -80,6 +94,27 @@
|
|
|
</van-col>
|
|
|
</van-row>
|
|
|
</van-cell-group>
|
|
|
+ <!-- 扫一扫 -->
|
|
|
+ <van-popup
|
|
|
+ v-model="showScanPopup"
|
|
|
+ class="scan-popup-wrapper"
|
|
|
+ :style="scanPopupStyle"
|
|
|
+ >
|
|
|
+ <div class="scan-popup">
|
|
|
+ <!-- <van-nav-bar title="扫一扫" @click-left="closeScanPopup">
|
|
|
+ <template #left>
|
|
|
+ <van-icon name="cross" class="ibps-nav-bar__close-icon" />
|
|
|
+ </template>
|
|
|
+ </van-nav-bar> -->
|
|
|
+ <div class="scan-popup__reader">
|
|
|
+ <qrcode-stream
|
|
|
+ v-if="showScanPopup"
|
|
|
+ @decode="onScanDecode"
|
|
|
+ @init="onScanInit"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </van-popup>
|
|
|
<!-- 更换主部门 -->
|
|
|
<van-action-sheet
|
|
|
v-model="show"
|
|
|
@@ -93,6 +128,7 @@
|
|
|
</template>
|
|
|
<script>
|
|
|
import { mapState } from 'vuex'
|
|
|
+import { QrcodeStream } from 'vue-qrcode-reader'
|
|
|
import defaultImage from '@/assets/images/logo/lc.png'
|
|
|
import { getFile } from '@/utils/image'
|
|
|
// import LcCard from '@/components/LcCard'
|
|
|
@@ -103,7 +139,8 @@ import navbar from '@/mixins/navbar'
|
|
|
export default {
|
|
|
components: {
|
|
|
LangSelect,
|
|
|
- SwitchEnvironment
|
|
|
+ SwitchEnvironment,
|
|
|
+ QrcodeStream
|
|
|
},
|
|
|
mixins: [navbar],
|
|
|
data() {
|
|
|
@@ -130,7 +167,13 @@ export default {
|
|
|
actions: [],
|
|
|
mainPositionName: '',
|
|
|
mainPosition:
|
|
|
- this.info && this.info.mainPosition ? this.info.mainPosition : null
|
|
|
+ this.info && this.info.mainPosition ? this.info.mainPosition : null,
|
|
|
+ showScanPopup: false,
|
|
|
+ scanProcessing: false,
|
|
|
+ scanPopupStyle: {
|
|
|
+ width: '100%',
|
|
|
+ height: '100%'
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
computed: {
|
|
|
@@ -171,17 +214,17 @@ export default {
|
|
|
this.mainPositionName = mid
|
|
|
? mid.name
|
|
|
: this.info && this.info.mainPosition
|
|
|
- ? this.info.mainPosition.name
|
|
|
- : positions.length > 0
|
|
|
- ? positions[0].name
|
|
|
- : null
|
|
|
+ ? this.info.mainPosition.name
|
|
|
+ : positions.length > 0
|
|
|
+ ? positions[0].name
|
|
|
+ : null
|
|
|
this.mainPosition =
|
|
|
mid ||
|
|
|
(this.info && this.info.mainPosition
|
|
|
? this.info.mainPosition
|
|
|
: positions.length > 0
|
|
|
- ? positions[0]
|
|
|
- : null)
|
|
|
+ ? positions[0]
|
|
|
+ : null)
|
|
|
|
|
|
return pos.join(',')
|
|
|
}
|
|
|
@@ -190,6 +233,110 @@ export default {
|
|
|
userInfo() {
|
|
|
this.$router.push({ name: 'userInfo' })
|
|
|
},
|
|
|
+ scanCode() {
|
|
|
+ this.scanProcessing = false
|
|
|
+ this.showScanPopup = true
|
|
|
+ },
|
|
|
+ closeScanPopup() {
|
|
|
+ this.showScanPopup = false
|
|
|
+ },
|
|
|
+ onScanInit(promise) {
|
|
|
+ promise.catch(() => {
|
|
|
+ this.$toast('无法访问摄像头，请检查权限')
|
|
|
+ this.showScanPopup = false
|
|
|
+ })
|
|
|
+ },
|
|
|
+ onScanDecode(content) {
|
|
|
+ if (this.scanProcessing || this.$utils.isEmpty(content)) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ this.scanProcessing = true
|
|
|
+ this.showScanPopup = false
|
|
|
+ this.navigateByScanContent(content.trim())
|
|
|
+ },
|
|
|
+ navigateByScanContent(content) {
|
|
|
+ const isFullUrl = /^https?:\/\//i.test(content)
|
|
|
+ const isInnerPath = content.indexOf('/') === 0
|
|
|
+
|
|
|
+ if (!isFullUrl && !isInnerPath) {
|
|
|
+ this.$toast('无法识别的二维码内容')
|
|
|
+ this.scanProcessing = false
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ if (isFullUrl) {
|
|
|
+ try {
|
|
|
+ const url = new URL(content)
|
|
|
+ if (url.origin === window.location.origin) {
|
|
|
+ const route = this.parseScanRoute(url)
|
|
|
+ if (route) {
|
|
|
+ this.$router.push(route)
|
|
|
+ } else {
|
|
|
+ window.location.href = content
|
|
|
+ }
|
|
|
+ return
|
|
|
+ }
|
|
|
+ window.location.href = content
|
|
|
+ } catch (error) {
|
|
|
+ this.$toast('二维码链接无效')
|
|
|
+ this.scanProcessing = false
|
|
|
+ }
|
|
|
+ return
|
|
|
+ }
|
|
|
+
|
|
|
+ this.$router.push(this.parsePathToRoute(content))
|
|
|
+ },
|
|
|
+ parseScanRoute(url) {
|
|
|
+ let pathWithQuery = ''
|
|
|
+
|
|
|
+ // hash 路由模式：http://domain.com/#/bpmn/siginin/index?codeId=xxx
|
|
|
+ if (url.hash && url.hash.indexOf('#/') === 0) {
|
|
|
+ pathWithQuery = url.hash.slice(1)
|
|
|
+ } else {
|
|
|
+ const publicPath = process.env.VUE_APP_PUBLIC_PATH || '/'
|
|
|
+ let path = url.pathname
|
|
|
+ if (publicPath !== '/' && path.indexOf(publicPath) === 0) {
|
|
|
+ path = '/' + path.slice(publicPath.length).replace(/^\//, '')
|
|
|
+ }
|
|
|
+ pathWithQuery = path + url.search
|
|
|
+ }
|
|
|
+
|
|
|
+ if (!pathWithQuery || pathWithQuery === '/') {
|
|
|
+ return null
|
|
|
+ }
|
|
|
+
|
|
|
+ return this.parsePathToRoute(pathWithQuery)
|
|
|
+ },
|
|
|
+ parsePathToRoute(pathContent) {
|
|
|
+ const queryIndex = pathContent.indexOf('?')
|
|
|
+ if (queryIndex > -1) {
|
|
|
+ return {
|
|
|
+ path: pathContent.slice(0, queryIndex),
|
|
|
+ query: this.parseQueryString(pathContent.slice(queryIndex))
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return { path: pathContent }
|
|
|
+ },
|
|
|
+ parseQueryString(search) {
|
|
|
+ const query = {}
|
|
|
+ const str = search.charAt(0) === '?' ? search.slice(1) : search
|
|
|
+ if (!str) {
|
|
|
+ return query
|
|
|
+ }
|
|
|
+ str.split('&').forEach((item) => {
|
|
|
+ if (!item) {
|
|
|
+ return
|
|
|
+ }
|
|
|
+ const eqIndex = item.indexOf('=')
|
|
|
+ if (eqIndex > -1) {
|
|
|
+ query[decodeURIComponent(item.slice(0, eqIndex))] =
|
|
|
+ decodeURIComponent(item.slice(eqIndex + 1))
|
|
|
+ } else {
|
|
|
+ query[decodeURIComponent(item)] = ''
|
|
|
+ }
|
|
|
+ })
|
|
|
+ return query
|
|
|
+ },
|
|
|
logout() {
|
|
|
this.$dialog
|
|
|
.confirm({
|
|
|
@@ -280,4 +427,25 @@ export default {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
}
|
|
|
+
|
|
|
+.scan-btn-wrapper {
|
|
|
+ padding-bottom: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.scan-popup-wrapper {
|
|
|
+ background: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.scan-popup {
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ background: #000;
|
|
|
+}
|
|
|
+
|
|
|
+.scan-popup__reader {
|
|
|
+ flex: 1;
|
|
|
+ overflow: hidden;
|
|
|
+}
|
|
|
</style>
|
cyy