147 lines
4.5 KiB
Vue
147 lines
4.5 KiB
Vue
<template>
|
|
<JeepayBackground :bgColorStyle="{ height: '706rpx' }">
|
|
<JeepayCustomNavbar textColor="#fff" bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="刷脸设备详情" backCtrl="back" />
|
|
|
|
<JeepayTableListItem
|
|
viewClass="list-item-by-detail"
|
|
logo="/pageDevice/static/devIconImg/icon-face-white.svg"
|
|
:title="vdata.deviceName"
|
|
:subtitle="vdata.deviceNo"
|
|
:moreBtnList="list"
|
|
/>
|
|
|
|
<view class="create-time">
|
|
<view class="time-title">设备厂商</view>
|
|
<view class="dev-info">{{ vdata.provider == 'wxpayQWPro' ? '青蛙刷脸Pro' : '蜻蜓F4' }}</view>
|
|
</view>
|
|
<view class="create-time" style="border: none; padding-top: 0">
|
|
<view class="time-title">创建时间</view>
|
|
<view class="time-info">{{ vdata.createdAt }}</view>
|
|
</view>
|
|
<JeepayCard editText="编辑信息" @editTap="toEdit">
|
|
<JeepayDescview>
|
|
<JeepayDescviewItem title="设备编号" :desc="vdata.deviceParams?.deviceNo" />
|
|
<JeepayDescviewItem title="设备名称" :desc="vdata.deviceName" />
|
|
<JeepayDescviewItem title="绑定门店" :desc="vdata.storeName" />
|
|
<JeepayDescviewItem title="绑定应用" :desc="vdata.appName" />
|
|
</JeepayDescview>
|
|
</JeepayCard>
|
|
<JDetailsSwitch title="设备状态" subTitle="状态禁用后，该设备将无法使用">
|
|
<template #titleRight>
|
|
<JeepayStateSwitch v-model:state="vdata.state" :showSwitchType="true" :updateStateFunc="confirmSwitch" />
|
|
</template>
|
|
</JDetailsSwitch>
|
|
<JSinglePopup ref="more" :list="list" activeColor="#FF5B4C" />
|
|
<JeepayPopupConfirm ref="tips" />
|
|
</JeepayBackground>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { nextTick, reactive, ref } from 'vue'
|
|
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
|
import infoBox from '@/commons/utils/infoBox.js'
|
|
import { reqLoad, API_URL_SYS_DEVICE_LIST, API_URL_SYS_CODE_LIST, $speakTest, $deviceUnbind } from '@/http/apiManager.js'
|
|
import datamap from '@/commons/utils/datamap.js'
|
|
import emit from '@/commons/utils/emit.js'
|
|
import go from '@/commons/utils/go.js'
|
|
// 监听 更新事件
|
|
onUnload(() => uni.$off(emit.ENAME_REF_FACE_DETAIL))
|
|
uni.$on(emit.ENAME_REF_FACE_DETAIL, function (data) {
|
|
getDetails(vdata.deviceId)
|
|
})
|
|
|
|
onLoad((options) => {
|
|
getDetails(options.deviceId)
|
|
})
|
|
const more = ref(null)
|
|
const tips = ref(null)
|
|
const popupDialog = ref(null)
|
|
|
|
const vdata = reactive({
|
|
|
|
})
|
|
|
|
const list = reactive([
|
|
{ label: '解除绑定', value: 'remove', color: '#FF5B4C', fun: confirm },
|
|
])
|
|
function confirm() {
|
|
more.value.close()
|
|
tips.value
|
|
.open('确认解除绑定吗？', { confirmColor: '#FF5B4C' })
|
|
.then((res) => {
|
|
$deviceUnbind(vdata.deviceId).then((res) => {
|
|
infoBox.showSuccessToast('解绑成功').then(() => {
|
|
go.back(1, emit.ENAME_REF_QRC_LIST)
|
|
})
|
|
})
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
more.value.open('remove')
|
|
})
|
|
}
|
|
const typeList = [
|
|
{ label: '门店所有订单', value: 0 },
|
|
{ label: '来自受支持码牌的订单', value: 1 },
|
|
]
|
|
const getDetails = (params) => {
|
|
reqLoad.getById(API_URL_SYS_DEVICE_LIST, params).then(({ bizData }) => {
|
|
Object.assign(vdata, bizData)
|
|
|
|
vdata.deviceParams = JSON.parse(vdata.deviceParams || '{}')
|
|
})
|
|
}
|
|
// 修改设备状态
|
|
const confirmSwitch = (bol) => {
|
|
return reqLoad.addOrUpdate(vdata.deviceId, API_URL_SYS_DEVICE_LIST, { state: bol }).then((res) => {
|
|
emit.refPageAndSearchEmit(emit.ENAME_REF_SPEAKER_LIST)
|
|
})
|
|
}
|
|
|
|
// 去编辑页面
|
|
const toEdit = () => {
|
|
go.to('PAGES_APP_FACE_EDIT', { devId: vdata.deviceId })
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.create-time {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
margin: 0 75rpx;
|
|
padding: 50rpx 0;
|
|
font-size: 30rpx;
|
|
border-top: 1rpx solid rgba(255, 255, 255, 0.2);
|
|
.time-title {
|
|
color: rgba(255, 255, 255, 0.7);
|
|
}
|
|
.time-info {
|
|
color: #fff;
|
|
}
|
|
}
|
|
.store-info {
|
|
padding: 0.1rpx;
|
|
margin: 0 35rpx;
|
|
background-color: #fff;
|
|
border-radius: $J-b-r32;
|
|
overflow: hidden;
|
|
}
|
|
.default-img {
|
|
width: 50rpx;
|
|
height: 50rpx;
|
|
}
|
|
|
|
.dev-info {
|
|
padding: 3rpx 15rpx;
|
|
border-radius: 6rpx;
|
|
background: rgba(255, 255, 255, 0.15);
|
|
font-size: 26rpx;
|
|
color: #fff;
|
|
}
|
|
.selected-qrcId {
|
|
width: 40rpx;
|
|
height: 40rpx;
|
|
transform: rotate(90deg);
|
|
}
|
|
</style>
|
|
|