new-cashier/jeepay-ui-uapp-merchant/pageDevice/autoPos/view.vue

93 lines
2.8 KiB
Vue

<template>
<JeepayBackground :bgColorStyle="{}">
<JeepayCustomNavbar textColor="#fff" bgDefaultColor="linear-gradient(270deg, rgba(72, 192, 255, 1) 0%, rgba(51, 157, 255, 1) 100%)" title="智能POS详情" backCtrl="back" />
<JeepayTableListItem viewClass="list-item-by-detail"
logo="/pageDevice/static/detailsLislImg/pos-white.svg"
:title="vdata.record.deviceName" :subtitle="vdata.record.deviceNo" :moreBtnList="list" />
<JeepayCard editText="编辑信息" @editTap="go.to('PAGES_APP_POS_BIND', {deviceId: vdata.record.deviceId})">
<JeepayDescview>
<JeepayDescviewItem title="设备名称" :desc="vdata.record.deviceName" />
<JeepayDescviewItem title="绑定应用" :desc="vdata.record.appId" />
<JeepayDescviewItem title="绑定门店" :desc="vdata.record.storeName" />
</JeepayDescview>
</JeepayCard>
<JeepayCard title="其他设置" viewStyle="margin-top: 30rpx;">
<JeepayTableListItem title="终端状态" subtitle="状态禁用后,当前终端将无法使用">
<template #titleRight>
<JeepayStateSwitch v-model:state="vdata.record.state" :showSwitchType="true" :updateStateFunc="updateState" />
</template>
</JeepayTableListItem>
</JeepayCard>
</JeepayBackground>
<JeepayPopupConfirm ref="jeepayPopupConfirmRef" />
</template>
<script setup>
import { reactive, ref } from 'vue'
import { onLoad, onUnload } from '@dcloudio/uni-app'
import { reqLoad, API_URL_SYS_DEVICE_LIST, $deviceUnbind } from '@/http/apiManager.js'
import go from '@/commons/utils/go.js'
import emit from '@/commons/utils/emit.js'
import infoBox from '@/commons/utils/infoBox.js'
const jeepayPopupConfirmRef = ref()
onLoad((options) => {
refData(options.deviceId)
})
const vdata = reactive({
record: {},
})
// 监听 更新事件
onUnload(() => uni.$off(emit.ENAME_REF_AUTOPOS_DETAIL))
uni.$on(emit.ENAME_REF_AUTOPOS_DETAIL, function(data){
refData(vdata.record.deviceId)
})
function refData(id){
reqLoad.getById(API_URL_SYS_DEVICE_LIST, id).then(({ bizData }) => {
vdata.record = bizData
})
}
function deleteFunc () {
jeepayPopupConfirmRef.value.open('您确认解绑设备吗?',{ confirmColor: '#FF5B4C' }).then(() => {
$deviceUnbind(vdata.record.deviceId).then(() => {
infoBox.showSuccessToast('解绑成功')
return go.back(1, emit.ENAME_REF_AUTOPOS_LIST)
})
})
}
const list = reactive([
{ label: '解绑设备', value: 'delete', color: 'red', fun: deleteFunc },
])
// 更新状态
function updateState(state) {
return reqLoad.updateById(API_URL_SYS_DEVICE_LIST, vdata.record.deviceId, { state: state }).then(() => {
emit.refPageAndSearchEmit(emit.ENAME_REF_AUTOPOS_LIST) // 修改列表页面。
infoBox.showSuccessToast('修改成功')
})
}
</script>
<style lang="scss" scoped>
.default-image {
width: 50rpx;
height: 50rpx;
}
</style>