You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
147 lines
3.2 KiB
147 lines
3.2 KiB
<template> |
|
<view class="container"> |
|
<u-navbar title="系统设置" bgColor='#D3832A' leftIconColor='#ffffff' titleStyle='color:#ffffff' placeholder |
|
:autoBack="true" leftIconSize='35'></u-navbar> |
|
<view class="list"> |
|
<!-- 设置后台监听状态 --> |
|
<view class="list_item" style="display: flex;"> |
|
<view class="uni-list-cell-left"> |
|
<u-icon class="margin-right-10" name="moments" color="#47beff"></u-icon> |
|
<view> |
|
扫描后台监听状态： |
|
</view> |
|
</view> |
|
<view class="uni-list-cell-db"> |
|
<picker @change="bindPickerChange" :value="details.scanStateChooseIndex" |
|
:range="details.scanStateList.map(val => val.title)"> |
|
<view class="uni-input">{{details.scanStateList.map(val => val.title)[details.scanStateChooseIndex]}} |
|
</view> |
|
</picker> |
|
</view> |
|
</view> |
|
</view> |
|
</view> |
|
|
|
</template> |
|
|
|
<script lang="ts" setup> |
|
import { |
|
onShow, |
|
onLoad, |
|
onHide, |
|
onPullDownRefresh |
|
} from '@dcloudio/uni-app' |
|
import { reactive, ref, toRefs } from 'vue'; |
|
import useSystemSettingsStore from '@/store/useSystemSettingsStore.js'; |
|
import { storeToRefs } from 'pinia'; |
|
|
|
// 获取系统设置存储仓库 |
|
const systemSettingsStore = useSystemSettingsStore() |
|
const { scanStateList, scanState } = storeToRefs(systemSettingsStore) |
|
const { HANDLE_SCANSTATE } = systemSettingsStore |
|
|
|
|
|
onPullDownRefresh(() => { |
|
const timer = setTimeout(() => { |
|
// 关闭下拉刷新 |
|
uni.stopPullDownRefresh() |
|
clearTimeout(timer) |
|
}, 500) |
|
}) |
|
|
|
const details = reactive({ |
|
// |
|
scanStateList: [], |
|
// 选中的索引 -- 默认为关闭 |
|
scanStateChooseIndex: 0 |
|
}) |
|
|
|
// 组件实例 |
|
|
|
// 初始化后台监听扫描数组的值 |
|
details.scanStateList = scanStateList.value |
|
|
|
// 获取用户选择的监听状态 |
|
details.scanStateChooseIndex = scanStateList.value.findIndex(val => Number(val.value) === Number(scanState.value)) |
|
|
|
/** |
|
* 处理扫描后台监听状态 |
|
*/ |
|
function bindPickerChange(e) { |
|
console.log('picker发送选择改变，携带值为', e.detail.value) |
|
details.scanStateChooseIndex = e.detail.value |
|
// 传入索引, 修改仓库中存储的状态 |
|
HANDLE_SCANSTATE(details.scanStateChooseIndex) |
|
} |
|
|
|
const { } = toRefs(details) |
|
</script> |
|
|
|
<style lang="scss" scoped> |
|
.container { |
|
width: 100vw; |
|
height: 100vh; |
|
// background: #fff; |
|
} |
|
|
|
.list {} |
|
|
|
.list_item { |
|
display: flex; |
|
justify-content: space-between; |
|
padding: 20upx; |
|
border-bottom: 2upx solid #eee; |
|
background: #fff; |
|
position: relative; |
|
|
|
.uni-list-cell-db { |
|
position: absolute; |
|
top: 0; |
|
left: 0; |
|
padding: 20upx; |
|
width: 100%; |
|
height: 100%; |
|
text-align: right; |
|
box-sizing: border-box; |
|
} |
|
|
|
&:last-child { |
|
border-bottom: 0px; |
|
} |
|
|
|
.uni-list-cell-left { |
|
display: inline-flex; |
|
} |
|
} |
|
|
|
.margin-right-10 { |
|
margin-right: 10upx; |
|
} |
|
|
|
// 修改密码弹窗 |
|
.EditPwdPop-title { |
|
position: relative; |
|
width: 200upx; |
|
flex: none; |
|
|
|
&::after { |
|
right: 20upx; |
|
top: 50%; |
|
transform: translateY(-50%); |
|
position: absolute; |
|
content: ''; |
|
display: block; |
|
width: 2upx; |
|
height: 40upx; |
|
background: #000; |
|
} |
|
} |
|
|
|
.flex-c-sb { |
|
display: flex; |
|
align-items: center; |
|
margin: 20upx 0 10upx; |
|
border-bottom: 1upx solid #aaa; |
|
padding: 20upx 0 10upx; |
|
} |
|
</style> |