724 lines
20 KiB
Vue
724 lines
20 KiB
Vue
<template>
|
||
<view>
|
||
<page-head :title="title"></page-head>
|
||
<view class="uni-padding-wrap uni-common-mt">
|
||
<view>
|
||
本蓝牙协议只支持低功耗蓝牙协议ble。如果想连接非ble蓝牙设备，请在社区搜索 Native.js 蓝牙。
|
||
</view>
|
||
<view class="uni-btn-v">
|
||
<button type="primary" :disabled="disabled[0]" @click="openBluetoothAdapter">
|
||
初始化蓝牙模块
|
||
</button>
|
||
<view v-if="!adapterState.available">
|
||
{{ '蓝牙适配器不可用,请初始化蓝牙模块' }}
|
||
</view>
|
||
<button
|
||
type="primary"
|
||
:loading="searchLoad"
|
||
:disabled="disabled[1]"
|
||
@click="startBluetoothDevicesDiscovery"
|
||
>
|
||
开始搜索蓝牙设备
|
||
</button>
|
||
<button
|
||
type="primary"
|
||
:disabled="disabled[2]"
|
||
@click="stopBluetoothDevicesDiscovery(false)"
|
||
>
|
||
停止搜索蓝牙设备
|
||
</button>
|
||
<button
|
||
type="primary"
|
||
:loading="newDeviceLoad"
|
||
:disabled="disabled[3]"
|
||
@click="queryDevices"
|
||
>
|
||
选择设备
|
||
</button>
|
||
<view v-if="equipment.length > 0">
|
||
{{
|
||
(connected ? '已连接设备' : '已选择设备') +
|
||
' : ' +
|
||
equipment[0].name +
|
||
' (' +
|
||
equipment[0].deviceId +
|
||
')'
|
||
}}
|
||
</view>
|
||
<button type="primary" :disabled="disabled[4]" @click="createBLEConnection">
|
||
连接蓝牙设备
|
||
</button>
|
||
<button type="primary" :disabled="disabled[5]" @click="getBLEDeviceServices">
|
||
选择设备服务
|
||
</button>
|
||
<view v-if="servicesData.length > 0">已选服务uuid：{{ servicesData[0].uuid }}</view>
|
||
<button type="primary" :disabled="disabled[6]" @click="getBLEDeviceCharacteristics">
|
||
获取服务的特征值
|
||
</button>
|
||
<view v-if="characteristicsData.length > 0">
|
||
<view class="uni-list_name">uuid:{{ characteristicsData[0].uuid }}</view>
|
||
<view class="uni-list_item">
|
||
是否支持 read 操作:{{ characteristicsData[0].properties.read }}
|
||
</view>
|
||
<view class="uni-list_item">
|
||
是否支持 write 操作:{{ characteristicsData[0].properties.write }}
|
||
</view>
|
||
<view class="uni-list_item">
|
||
是否支持 notify 操作:{{ characteristicsData[0].properties.notify }}
|
||
</view>
|
||
<view class="uni-list_item">
|
||
是否支持 indicate 操作:{{ characteristicsData[0].properties.indicate }}
|
||
</view>
|
||
</view>
|
||
<!-- <button type="primary" :disabled="disabled[7]" @click="readBLECharacteristicValue">
|
||
读取特征值数据
|
||
</button>
|
||
<view v-if="valueChangeData.serviceId">
|
||
<view class="list-name">
|
||
特征值最新的值:{{ valueChangeData.value || '还没有最新值' }}
|
||
</view>
|
||
</view> -->
|
||
<!-- <button type="primary" :disabled="disabled[8]" @click="w">写入特征值数据</button> -->
|
||
<button type="primary" :disabled="disabled[9]" @click="closeBLEConnection">
|
||
断开蓝牙设备
|
||
</button>
|
||
<button type="primary" :disabled="disabled[10]" @click="closeBluetoothAdapter">
|
||
关闭蓝牙模块
|
||
</button>
|
||
</view>
|
||
</view>
|
||
<!-- 遮罩 -->
|
||
<view v-if="maskShow" class="uni-mask" @touchmove.stop.prevent="moveHandle" @click="maskclose">
|
||
<scroll-view class="uni-scroll_box" scroll-y @touchmove.stop.prevent="moveHandle" @click.stop="moveHandle">
|
||
<view class="uni-title">
|
||
已经发现{{ list.length }}{{ showMaskType === 'device' ? '台设备' : '个服务' }}:
|
||
</view>
|
||
<view
|
||
class="uni-list-box"
|
||
v-for="(item, index) in list"
|
||
:key="index"
|
||
@click="tapQuery(item)"
|
||
>
|
||
<view v-if="showMaskType === 'device'">
|
||
<view class="uni-list_name">{{ item.name || item.localName }}</view>
|
||
<view class="uni-list_item">信号强度:{{ item.RSSI }}dBm</view>
|
||
<view class="uni-list_item">UUID:{{ item.deviceId }}</view>
|
||
<!-- <view class="list-item" v-if="showMaskType === 'device'">
|
||
Service数量:{{ item.advertisServiceUUIDs.length }}
|
||
</view> -->
|
||
</view>
|
||
<view v-if="showMaskType === 'service'">
|
||
<view class="uni-list_item" style="line-height:2.2;">
|
||
UUID: {{ item.uuid }}
|
||
<text v-if="showMaskType === 'service'">
|
||
{{ item.isPrimary ? '（主服务）' : '' }}
|
||
</text>
|
||
</view>
|
||
</view>
|
||
<view v-if="showMaskType === 'characteristics'">
|
||
<view class="uni-list_name">uuid:{{ item.uuid }}</view>
|
||
<view class="uni-list_item">是否支持 read 操作:{{ item.properties.read }}</view>
|
||
<view class="uni-list_item">
|
||
是否支持 write 操作:{{ item.properties.write }}
|
||
</view>
|
||
<view class="uni-list_item">
|
||
是否支持 notify 操作:{{ item.properties.notify }}
|
||
</view>
|
||
<view class="uni-list_item">
|
||
是否支持 indicate 操作:{{ item.properties.indicate }}
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
title: 'bluetooth',
|
||
disabled: [false, true, true, true, true, true, true, true, true, true, true],
|
||
newDeviceLoad: false,
|
||
searchLoad: false,
|
||
maskShow: false,
|
||
equipment: [],
|
||
adapterState: {
|
||
discovering: false,
|
||
available: false
|
||
},
|
||
connected: false,
|
||
showMaskType: 'device',
|
||
servicesData: [],
|
||
characteristicsData: [],
|
||
valueChangeData: {},
|
||
isStop:true ,
|
||
list: []
|
||
};
|
||
},
|
||
onLoad() {
|
||
this.onBLEConnectionStateChange();
|
||
},
|
||
methods: {
|
||
moveHandle() {},
|
||
/**
|
||
* 关闭遮罩
|
||
*/
|
||
maskclose(){
|
||
this.maskShow = false;
|
||
},
|
||
/**
|
||
* 选择设备
|
||
*/
|
||
queryDevices() {
|
||
// this.newDeviceLoad = true;
|
||
this.showMaskType = 'device';
|
||
this.maskShow = true;
|
||
},
|
||
tapQuery(item) {
|
||
if (this.showMaskType === 'device') {
|
||
this.$set(this.disabled, 4, false);
|
||
if (this.equipment.length > 0) {
|
||
this.equipment[0] = item;
|
||
} else {
|
||
this.equipment.push(item);
|
||
}
|
||
this.newDeviceLoad = false;
|
||
}
|
||
if (this.showMaskType === 'service') {
|
||
this.$set(this.disabled, 6, false);
|
||
if (this.servicesData.length > 0) {
|
||
this.servicesData[0] = item;
|
||
} else {
|
||
this.servicesData.push(item);
|
||
}
|
||
}
|
||
if (this.showMaskType === 'characteristics') {
|
||
this.$set(this.disabled, 7, false);
|
||
if (this.characteristicsData.length > 0) {
|
||
this.characteristicsData[0] = item;
|
||
} else {
|
||
this.characteristicsData.push(item);
|
||
}
|
||
}
|
||
this.maskShow = false;
|
||
},
|
||
/**
|
||
* 初始化蓝牙设备
|
||
*/
|
||
openBluetoothAdapter() {
|
||
uni.openBluetoothAdapter({
|
||
success: e => {
|
||
console.log('初始化蓝牙成功:' + e.errMsg);
|
||
console.log(JSON.stringify(e));
|
||
this.isStop = false ;
|
||
this.$set(this.disabled, 0, true);
|
||
this.$set(this.disabled, 1, false);
|
||
this.$set(this.disabled, 10, false);
|
||
this.getBluetoothAdapterState();
|
||
},
|
||
fail: e => {
|
||
console.log(e)
|
||
console.log('初始化蓝牙失败，错误码：' + (e.errCode || e.errMsg));
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode,e.errMsg);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 开始搜索蓝牙设备
|
||
*/
|
||
startBluetoothDevicesDiscovery() {
|
||
uni.startBluetoothDevicesDiscovery({
|
||
success: e => {
|
||
console.log('开始搜索蓝牙设备:' + e.errMsg);
|
||
this.searchLoad = true;
|
||
this.$set(this.disabled, 1, true);
|
||
this.$set(this.disabled, 2, false);
|
||
this.$set(this.disabled, 3, false);
|
||
this.onBluetoothDeviceFound();
|
||
},
|
||
fail: e => {
|
||
console.log('搜索蓝牙设备失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 停止搜索蓝牙设备
|
||
*/
|
||
stopBluetoothDevicesDiscovery(types) {
|
||
uni.stopBluetoothDevicesDiscovery({
|
||
success: e => {
|
||
console.log('停止搜索蓝牙设备:' + e.errMsg);
|
||
if (types) {
|
||
this.$set(this.disabled, 1, true);
|
||
} else {
|
||
this.$set(this.disabled, 1, false);
|
||
}
|
||
this.$set(this.disabled, 2, true);
|
||
// this.$set(this.disabled, 3, true);
|
||
this.searchLoad = false;
|
||
},
|
||
fail: e => {
|
||
console.log('停止搜索蓝牙设备失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 发现外围设备
|
||
*/
|
||
onBluetoothDeviceFound() {
|
||
uni.onBluetoothDeviceFound(devices => {
|
||
console.log('开始监听寻找到新设备的事件');
|
||
// this.$set(this.disabled, 3, false);
|
||
this.getBluetoothDevices();
|
||
});
|
||
},
|
||
/**
|
||
* 获取在蓝牙模块生效期间所有已发现的蓝牙设备。包括已经和本机处于连接状态的设备。
|
||
*/
|
||
getBluetoothDevices() {
|
||
uni.getBluetoothDevices({
|
||
success: res => {
|
||
this.newDeviceLoad = false;
|
||
console.log('获取蓝牙设备成功:' + res.errMsg);
|
||
// console.log(JSON.stringify(res))
|
||
this.list = res.devices;
|
||
},
|
||
fail: e => {
|
||
console.log('获取蓝牙设备错误，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 获取本机蓝牙适配器状态
|
||
*/
|
||
getBluetoothAdapterState() {
|
||
console.log('--->');
|
||
uni.getBluetoothAdapterState({
|
||
success: res => {
|
||
console.log(JSON.stringify(res));
|
||
this.adapterState = res;
|
||
},
|
||
fail: e => {
|
||
console.log('获取本机蓝牙适配器状态失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 连接低功耗蓝牙
|
||
*/
|
||
createBLEConnection() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
uni.showToast({
|
||
title: '连接蓝牙...',
|
||
icon: 'loading',
|
||
duration: 99999
|
||
});
|
||
uni.createBLEConnection({
|
||
// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
|
||
deviceId,
|
||
success: res => {
|
||
console.log(res);
|
||
console.log('连接蓝牙成功:' + res.errMsg);
|
||
// 连接设备后断开搜索 并且不能搜索设备
|
||
this.stopBluetoothDevicesDiscovery(true);
|
||
uni.hideToast();
|
||
uni.showToast({
|
||
title: '连接成功',
|
||
icon: 'success',
|
||
duration: 2000
|
||
});
|
||
this.$set(this.disabled, 3, true);
|
||
this.$set(this.disabled, 4, true);
|
||
this.$set(this.disabled, 5, false);
|
||
this.$set(this.disabled, 9, false);
|
||
this.connected = true;
|
||
},
|
||
fail: e => {
|
||
console.log('连接低功耗蓝牙失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 断开与低功耗蓝牙设备的连接
|
||
*/
|
||
closeBLEConnection() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
uni.closeBLEConnection({
|
||
deviceId,
|
||
success: res => {
|
||
console.log(res);
|
||
console.log('断开低功耗蓝牙成功:' + res.errMsg);
|
||
this.$set(this.disabled, 1, false);
|
||
this.$set(this.disabled, 3, true);
|
||
this.$set(this.disabled, 4, true);
|
||
this.$set(this.disabled, 5, true);
|
||
this.$set(this.disabled, 6, true);
|
||
this.$set(this.disabled, 7, true);
|
||
this.$set(this.disabled, 8, true);
|
||
this.$set(this.disabled, 9, true);
|
||
this.equipment = [];
|
||
this.servicesData = [];
|
||
this.characteristicsData = [];
|
||
},
|
||
fail: e => {
|
||
console.log('断开低功耗蓝牙成功，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 获取所有服务
|
||
*/
|
||
getBLEDeviceServices() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
console.log('获取所有服务的 uuid:' + deviceId);
|
||
|
||
uni.getBLEDeviceServices({
|
||
// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
|
||
deviceId,
|
||
success: res => {
|
||
console.log(JSON.stringify(res.services));
|
||
console.log('获取设备服务成功:' + res.errMsg);
|
||
this.$set(this.disabled, 7, true);
|
||
this.$set(this.disabled, 8, true);
|
||
this.showMaskType = 'service';
|
||
this.list = res.services;
|
||
|
||
this.characteristicsData = [];
|
||
if (this.list.length <= 0) {
|
||
toast('获取服务失败，请重试!');
|
||
return;
|
||
}
|
||
this.maskShow = true;
|
||
},
|
||
fail: e => {
|
||
console.log('获取设备服务失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 获取某个服务下的所有特征值
|
||
*/
|
||
getBLEDeviceCharacteristics() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
let serviceId = this.servicesData[0].uuid;
|
||
console.log(deviceId);
|
||
console.log(serviceId);
|
||
uni.getBLEDeviceCharacteristics({
|
||
// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
|
||
deviceId,
|
||
// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
|
||
serviceId,
|
||
success: res => {
|
||
console.log(JSON.stringify(res));
|
||
console.log('获取特征值成功:' + res.errMsg);
|
||
this.$set(this.disabled, 7, true);
|
||
this.valueChangeData = {};
|
||
this.showMaskType = 'characteristics';
|
||
this.list = res.characteristics;
|
||
if (this.list.length <= 0) {
|
||
toast('获取特征值失败，请重试!');
|
||
return;
|
||
}
|
||
this.maskShow = true;
|
||
},
|
||
fail: e => {
|
||
console.log('获取特征值失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 监听低功耗蓝牙连接状态的改变事件。包括开发者主动连接或断开连接，设备丢失，连接异常断开等等
|
||
*/
|
||
onBLEConnectionStateChange() {
|
||
uni.onBLEConnectionStateChange(res => {
|
||
// 该方法回调中可以用于处理连接意外断开等异常情况
|
||
console.log(`蓝牙连接状态 -------------------------->`);
|
||
console.log(JSON.stringify(res));
|
||
if (!res.connected) {
|
||
if(this.isStop) return ;
|
||
console.log('断开低功耗蓝牙成功:');
|
||
this.$set(this.disabled, 1, false);
|
||
this.$set(this.disabled, 3, true);
|
||
this.$set(this.disabled, 4, true);
|
||
this.$set(this.disabled, 5, true);
|
||
this.$set(this.disabled, 6, true);
|
||
this.$set(this.disabled, 7, true);
|
||
this.$set(this.disabled, 8, true);
|
||
this.$set(this.disabled, 9, true);
|
||
this.searchLoad = false;
|
||
this.equipment = [];
|
||
this.servicesData = [];
|
||
this.characteristicsData = [];
|
||
this.valueChangeData = {};
|
||
toast('已经断开当前蓝牙连接');
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 读取低功耗蓝牙设备的特征值的二进制数据值。注意：必须设备的特征值支持 read 才可以成功调用
|
||
*/
|
||
readBLECharacteristicValue() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
let serviceId = this.servicesData[0].uuid;
|
||
let characteristicId = this.characteristicsData[0].uuid;
|
||
console.log(deviceId);
|
||
console.log(serviceId);
|
||
console.log(characteristicId);
|
||
uni.readBLECharacteristicValue({
|
||
// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
|
||
deviceId,
|
||
// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
|
||
serviceId,
|
||
// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
|
||
characteristicId,
|
||
success: res => {
|
||
console.log('读取设备数据值成功');
|
||
console.log(JSON.stringify(res));
|
||
this.notifyBLECharacteristicValueChange();
|
||
},
|
||
fail(e) {
|
||
console.log('读取设备数据值失败，错误码：' + e.errCode);
|
||
if (e.errCode !== 0) {
|
||
initTypes(e.errCode);
|
||
}
|
||
}
|
||
});
|
||
this.onBLECharacteristicValueChange();
|
||
},
|
||
/**
|
||
* 监听低功耗蓝牙设备的特征值变化事件。必须先启用 notifyBLECharacteristicValueChange 接口才能接收到设备推送的 notification。
|
||
*/
|
||
onBLECharacteristicValueChange() {
|
||
// 必须在这里的回调才能获取
|
||
uni.onBLECharacteristicValueChange(characteristic => {
|
||
console.log('监听低功耗蓝牙设备的特征值变化事件成功');
|
||
console.log(JSON.stringify(characteristic));
|
||
this.valueChangeData = characteristic;
|
||
});
|
||
},
|
||
/**
|
||
* 订阅操作成功后需要设备主动更新特征值的 value，才会触发 uni.onBLECharacteristicValueChange 回调。
|
||
*/
|
||
notifyBLECharacteristicValueChange() {
|
||
let deviceId = this.equipment[0].deviceId;
|
||
let serviceId = this.servicesData[0].uuid;
|
||
let characteristicId = this.characteristicsData[0].uuid;
|
||
let notify = this.characteristicsData[0].properties.notify;
|
||
console.log(deviceId);
|
||
console.log(serviceId);
|
||
console.log(characteristicId);
|
||
console.log(notify);
|
||
uni.notifyBLECharacteristicValueChange({
|
||
state: true, // 启用 notify 功能
|
||
// 这里的 deviceId 需要已经通过 createBLEConnection 与对应设备建立链接
|
||
deviceId,
|
||
// 这里的 serviceId 需要在 getBLEDeviceServices 接口中获取
|
||
serviceId,
|
||
// 这里的 characteristicId 需要在 getBLEDeviceCharacteristics 接口中获取
|
||
characteristicId,
|
||
success(res) {
|
||
console.log('notifyBLECharacteristicValueChange success:' + res.errMsg);
|
||
console.log(JSON.stringify(res));
|
||
}
|
||
});
|
||
},
|
||
/**
|
||
* 断开蓝牙模块
|
||
*/
|
||
closeBluetoothAdapter(OBJECT) {
|
||
uni.closeBluetoothAdapter({
|
||
success: res => {
|
||
console.log('断开蓝牙模块成功');
|
||
this.isStop = true ;
|
||
this.$set(this.disabled, 0, false);
|
||
this.$set(this.disabled, 1, true);
|
||
this.$set(this.disabled, 2, true);
|
||
this.$set(this.disabled, 3, true);
|
||
this.$set(this.disabled, 4, true);
|
||
this.$set(this.disabled, 5, true);
|
||
this.$set(this.disabled, 6, true);
|
||
this.$set(this.disabled, 7, true);
|
||
this.$set(this.disabled, 8, true);
|
||
this.$set(this.disabled, 9, true);
|
||
this.$set(this.disabled, 10, true);
|
||
this.equipment = [];
|
||
this.servicesData = [];
|
||
this.characteristicsData = [];
|
||
this.valueChangeData = {};
|
||
this.adapterState = [];
|
||
this.searchLoad =false;
|
||
toast('断开蓝牙模块');
|
||
}
|
||
});
|
||
}
|
||
}
|
||
};
|
||
|
||
/**
|
||
* 判断初始化蓝牙状态
|
||
*/
|
||
function initTypes(code, errMsg) {
|
||
switch (code) {
|
||
case 10000:
|
||
toast('未初始化蓝牙适配器');
|
||
break;
|
||
case 10001:
|
||
toast('未检测到蓝牙，请打开蓝牙重试！');
|
||
break;
|
||
case 10002:
|
||
toast('没有找到指定设备');
|
||
break;
|
||
case 10003:
|
||
toast('连接失败');
|
||
break;
|
||
case 10004:
|
||
toast('没有找到指定服务');
|
||
break;
|
||
case 10005:
|
||
toast('没有找到指定特征值');
|
||
break;
|
||
case 10006:
|
||
toast('当前连接已断开');
|
||
break;
|
||
case 10007:
|
||
toast('当前特征值不支持此操作');
|
||
break;
|
||
case 10008:
|
||
toast('其余所有系统上报的异常');
|
||
break;
|
||
case 10009:
|
||
toast('Android 系统特有，系统版本低于 4.3 不支持 BLE');
|
||
break;
|
||
default:
|
||
toast(errMsg);
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 弹出框封装
|
||
*/
|
||
function toast(content, showCancel = false) {
|
||
uni.showModal({
|
||
title: '提示',
|
||
content,
|
||
showCancel
|
||
});
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
|
||
.uni-title {
|
||
/* width: 100%; */
|
||
/* height: 80rpx; */
|
||
text-align: center;
|
||
}
|
||
|
||
.uni-mask {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
bottom: 0;
|
||
display: flex;
|
||
align-items: center;
|
||
width: 100%;
|
||
background: rgba(0, 0, 0, 0.6);
|
||
padding: 0 30rpx;
|
||
box-sizing: border-box;
|
||
}
|
||
|
||
.uni-scroll_box {
|
||
height: 70%;
|
||
background: #fff;
|
||
border-radius: 20rpx;
|
||
}
|
||
.uni-list-box {
|
||
margin: 0 20rpx;
|
||
padding: 15rpx 0;
|
||
border-bottom: 1px #f5f5f5 solid;
|
||
box-sizing: border-box;
|
||
}
|
||
.uni-list:last-child {
|
||
border: none;
|
||
}
|
||
.uni-list_name {
|
||
font-size: 30rpx;
|
||
color: #333;
|
||
}
|
||
.uni-list_item {
|
||
font-size: 24rpx;
|
||
color: #555;
|
||
line-height: 1.5;
|
||
}
|
||
|
||
.uni-success_box {
|
||
position: absolute;
|
||
left: 0;
|
||
bottom: 0;
|
||
min-height: 100rpx;
|
||
width: 100%;
|
||
background: #fff;
|
||
box-sizing: border-box;
|
||
border-top: 1px #eee solid;
|
||
}
|
||
.uni-success_sub {
|
||
/* width: 100%%; */
|
||
height: 100rpx;
|
||
display: flex;
|
||
justify-content: space-between;
|
||
align-items: center;
|
||
padding: 0 30rpx;
|
||
}
|
||
.uni-close_button {
|
||
padding: 0 20rpx;
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
background: #ce3c39;
|
||
color: #ffffff;
|
||
border-radius: 10rpx;
|
||
}
|
||
.uni-success_content {
|
||
height: 600rpx;
|
||
margin: 30rpx;
|
||
margin-top: 0;
|
||
border: 1px #eee solid;
|
||
padding: 30rpx;
|
||
}
|
||
.uni-content_list {
|
||
padding-bottom: 10rpx;
|
||
border-bottom: 1px #f5f5f5 solid;
|
||
}
|
||
.uni-tips {
|
||
text-align: center;
|
||
font-size: 24rpx;
|
||
color: #666;
|
||
}
|
||
</style>
|