Nevar pievienot vairāk kā 25 tēmas Tēmai ir jāsākas ar burtu vai ciparu, tā var saturēt domu zīmes ('-') un var būt līdz 35 simboliem gara.

pirms 2 gadiem
pirms 2 gadiem
pirms 1 gada
pirms 2 gadiem
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 2 gadiem
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 1 gada
pirms 2 gadiem
pirms 2 gadiem
pirms 2 gadiem
pirms 1 gada
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764
  1. <!--设备选择 -->
  2. <template>
  3. <view class="devices">
  4. <view class="device" v-for="(item, index) in deviceList" :key="index" @click="connectDevice(item)">
  5. <image :src="`${$imgUrl}bluetooth/card1.png`" class="head" mode="aspectFill"></image>
  6. <view class="center">
  7. <view class="name">{{ item._name }}</view>
  8. <view class="desc">编号 {{ item.name }}</view>
  9. </view>
  10. <image :src="item.selected ? selectedUrl : unSelectedUrl" class="icon" mode="aspectFill"></image>
  11. </view>
  12. <view class="hint">
  13. <view class="orange-txt as-layout-horizontal as-gravity-center-start">
  14. <image :src="`${$imgUrl}common/icon-hint.png`" mode="aspectFill"></image>
  15. <view>温馨提示:</view>
  16. </view>
  17. <view class="grey-txt">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  18. 指令执行过程中,请勿关闭蓝牙,勿将手机远离电子标签,以免导致写卡、写签失败。</view>
  19. </view>
  20. <view class="btn">
  21. <submit-button title="点击重新搜索蓝牙" @submit="load"></submit-button>
  22. </view>
  23. </view>
  24. </template>
  25. <script setup lang="ts">
  26. import { ref, reactive } from "vue";
  27. import { onLoad, onReady } from "@dcloudio/uni-app";
  28. import { fileURL } from "@/datas/fileURL.js";
  29. const imgURL = `${fileURL}image/`;
  30. const selectedUrl = "common/selected.png`";
  31. const unSelectedUrl = "common/unselected.png`";
  32. const jyApi = require("../../static/etc/JYAPI/GenvictBleUtil.js");
  33. const jlQZApi = require("../../static/etc/JLQZAPI/JLObuSDK.js");
  34. const atApi = require("../../static/etc/ATAPI/ArtcBleUtil.js");
  35. const wqApi = require("../../static/etc/WQAPI/WCDObuSdk.js");
  36. const cgApi = require("../../static/etc/CGAPI/cguBle.js");
  37. const tools = require("../../static/etcUtil/tools.js");
  38. const datas = require("../../static/etcUtil/datas.js");
  39. const bluetoothUtil = require("../../static/etcUtil/index.js");
  40. let jlApi = require("../../static/etc/JLAPI/JLObuSDK.js"); //聚力SDK
  41. let wjApi = require("../../static/etc/WJAPI/wjBleAPI");
  42. let tdApi = require("../../static/etc/TDAPI/TDRObuSDK.js");
  43. let zzApi = require("../../static/etc/WJAPI/wjBleAPI.js");
  44. let jtApi = require("../../static/etc/JTAPI/BleUtil.js");
  45. // #ifdef MP-ALIPAY
  46. // 这部分代码将仅在支付宝小程序平台下执行
  47. jlApi = require("../../static/etc/JLObuSDK/JLObuSDK.js");
  48. wjApi = require("../../static/etc/wjBle/WJBleAPI");
  49. zzApi = require("../../static/etc/wjBle/WJBleAPI");
  50. tdApi = require("../../static/etc/TDRAPI/TDRObuSDK.js");
  51. jtApi = require("../../static/etc/JTAPIS/BleUtil.js");
  52. // 执行支付宝小程序的特定功能
  53. // #endif
  54. const state = reactive({
  55. fee: "",
  56. id: "",
  57. cardId: "",
  58. showPopup: false, //显示激活成功提示
  59. curDeviceId: "", //当前选中的设备ID
  60. deviceList: [
  61. //设备列表
  62. {
  63. id: "1",
  64. image: imgURL + "bluetooth/card1.png`",
  65. name: "聚力",
  66. number: "235564444558855",
  67. },
  68. ],
  69. connectSuccess: 1,
  70. transfer: 0,
  71. rechargeMoney: "",//消费明细圈存传过来的金额
  72. orderNum: 0,//消费明细 传orderNum说明去支付
  73. payMoney: 0,//0 修复 1 支付
  74. accountId: "",//对公账户名称
  75. difference: "",//区分routeType5 1二次激活
  76. });
  77. const deviceList = ref([]);
  78. const connectPrefixName = ref(null);
  79. const routeType = ref(null); //来源 1激活 2圈存 3信息重写 4信息读取
  80. interface DeviceType {
  81. name : string; //设备名称
  82. deviceId : string; //uuid
  83. prefixName : string; //前缀名称
  84. selected : boolean; //判断点击次数
  85. _name : string; //中文名称
  86. }
  87. let device : DeviceType = reactive({
  88. name: "", //设备名称
  89. deviceId: "", //uuid
  90. prefixName: "", //前缀名称
  91. selected: false, //判断点击次数
  92. _name: "", //中文名称
  93. });
  94. onReady(() => {
  95. load();
  96. });
  97. onLoad((option) => {
  98. routeType.value = option.routeType ? option.routeType : "1";
  99. state.cardId = option.cardId;
  100. if (option.fee) {
  101. state.fee = option.fee;
  102. }
  103. if (option.id) {
  104. state.id = option.id;
  105. }
  106. if (option.transfer) {
  107. state.transfer = option.transfer;
  108. }
  109. if (option.rechargeMoney) {
  110. state.rechargeMoney = option.rechargeMoney
  111. }
  112. if (option.orderNum) {
  113. state.orderNum = option.orderNum
  114. }
  115. if (option.payMoney) {
  116. state.payMoney = option.payMoney
  117. }
  118. if (option.accountId) {
  119. state.accountId = option.accountId
  120. }
  121. if (option.difference) {
  122. state.difference = option.difference;
  123. }
  124. console.log("传过来的参数", option)
  125. });
  126. /*
  127. * 蓝牙初始化
  128. */
  129. const load = () => {
  130. deviceList.value = [];
  131. console.log("****************蓝牙getsetting******************");
  132. uni.getSetting({
  133. success(res) {
  134. console.log("****************成功******************");
  135. console.log("scopebluetooth:" + res.authSetting["scope.bluetooth"]);
  136. console.log("成功结果:" + JSON.stringify(res));
  137. if (res.authSetting["scope.bluetooth"] == undefined) {
  138. //没有授权使用蓝牙功能,提示用户授权使用
  139. // #ifdef MP-WEIXIN
  140. uni.authorize({
  141. scope: "scope.bluetooth",
  142. success() {
  143. openBluetooth();
  144. },
  145. fail(err) {
  146. console.log('蓝牙授权失败', err)
  147. uni.showToast({
  148. title: "蓝牙授权失败",
  149. icon: "error",
  150. duration: 1500,
  151. });
  152. }
  153. });
  154. // #endif
  155. // #ifdef MP-ALIPAY
  156. openBluetooth();
  157. // #endif
  158. } else if (!res.authSetting["scope.bluetooth"]) {
  159. //false
  160. uni.showModal({
  161. title: "是否授权读取蓝牙",
  162. content: "需要获取你的蓝牙,请确认授权,否则无法获取蓝牙",
  163. success: function (mres) {
  164. if (mres.confirm) {
  165. uni.openSetting({
  166. success(authData) {
  167. if (authData.authSetting["scope.bluetooth"] == true) {
  168. tools.showLoadingAlert("扫描蓝牙中");
  169. openBluetooth();
  170. } else {
  171. uni.closeBluetoothAdapter();
  172. uni.showToast({
  173. title: "蓝牙授权失败",
  174. icon: "error",
  175. duration: 1500,
  176. });
  177. }
  178. },
  179. });
  180. } else if (mres.cancel) {
  181. uni.showToast({
  182. title: "蓝牙授权失败",
  183. icon: "error",
  184. duration: 1000,
  185. });
  186. }
  187. },
  188. });
  189. } else {
  190. tools.showLoadingAlert("扫描蓝牙中");
  191. openBluetooth();
  192. }
  193. },
  194. fail(res) {
  195. console.log("****************失败******************");
  196. console.log("失败结果:" + JSON.stringify(res));
  197. },
  198. });
  199. };
  200. /*
  201. * 打开蓝牙
  202. */
  203. const openBluetooth = () => {
  204. tools.hideLoadingAlert();
  205. let foundDevices = []; //扫描到的蓝牙列表
  206. uni.closeBluetoothAdapter(); //先关闭蓝牙
  207. console.log('执行断开蓝牙方法')
  208. //打开蓝牙
  209. uni.openBluetoothAdapter({
  210. success: function (item : any) {
  211. console.log('初始化蓝牙模块', item)
  212. tools.showLoadingAlert("扫描蓝牙中...");
  213. //开始搜索附近的蓝牙设备
  214. uni.startBluetoothDevicesDiscovery({
  215. success: function (res) {
  216. console.log('开始搜寻附近的蓝牙外围设备', res);
  217. //监听搜索到新设备的事件
  218. uni.onBluetoothDeviceFound(function (res) {
  219. console.log('监听寻找到新设备的事件', res, res.devices);
  220. for (let i = 0; i < res.devices.length; i++) {
  221. let name = res.devices[i]["name"];
  222. let prefixName = "";
  223. let deviceId = res.devices[i]["deviceId"];
  224. console.log("res.devices[i]", res.devices[i]["name"]);
  225. if (name != "" && name != undefined && name != "undefined") {
  226. if (name.indexOf("G-WJ") != -1 || name.indexOf("ETC") != -1 || name.indexOf("G-JL") != -1) {
  227. //前装设备
  228. prefixName = "ETC";
  229. } else {
  230. //聚力临时设备
  231. if (name.indexOf("5201121") != -1) {
  232. prefixName = "JL";
  233. } else {
  234. prefixName = name.substring(0, 2);
  235. }
  236. }
  237. prefixName = prefixName.toUpperCase();
  238. if (
  239. prefixName == "WJ" ||
  240. prefixName == "JL" ||
  241. prefixName == "JY" ||
  242. prefixName == "AT" ||
  243. prefixName == "JT" ||
  244. prefixName == "WQ" ||
  245. prefixName == "CG" ||
  246. prefixName == "TD" ||
  247. prefixName == "ZZ" ||
  248. prefixName == "ETC"
  249. ) {
  250. // //隐藏加载框
  251. tools.hideLoadingAlert();
  252. device.name = name;
  253. device.deviceId = deviceId;
  254. device.prefixName = prefixName;
  255. device.selected = false; //防止重复点击
  256. let _name = "";
  257. switch (prefixName) {
  258. case "WJ":
  259. _name = "万集";
  260. break;
  261. case "JL":
  262. _name = "聚利";
  263. break;
  264. case "JY":
  265. _name = "金溢";
  266. break;
  267. case "AT":
  268. _name = "埃特斯";
  269. break;
  270. case "JT":
  271. _name = "建投";
  272. break;
  273. case "WQ":
  274. _name = "握奇";
  275. break;
  276. case "CG":
  277. _name = "成谷";
  278. break;
  279. case "TD":
  280. _name = "天地融";
  281. break;
  282. case "ZZ":
  283. _name = "智载";
  284. break;
  285. case "ETC":
  286. _name = "前装";
  287. break;
  288. default:
  289. _name = "未知";
  290. break;
  291. }
  292. device._name = _name;
  293. if (deviceList.value.length == 0) {
  294. // #ifdef MP-ALIPAY
  295. if (device._name == '聚利' || device._name == '万集' || device._name == '天地融' || device._name == '建投') {
  296. foundDevices.push(device);
  297. }
  298. // #endif
  299. // #ifdef MP-WEIXIN
  300. foundDevices.push(device);
  301. // #endif
  302. } else {
  303. let isHave = false;
  304. for (let j = 0; j < foundDevices.length; j++) {
  305. if (name == foundDevices[j].deviceId) {
  306. isHave = true;
  307. break;
  308. }
  309. }
  310. if (!isHave) {
  311. foundDevices.push(device);
  312. }
  313. }
  314. deviceList.value = foundDevices;
  315. foundDevices = [];
  316. // console.log(foundDevices);
  317. }
  318. }
  319. }
  320. });
  321. },
  322. fail: function (res) {
  323. console.log(res);
  324. tools.hideLoadingAlert();
  325. },
  326. });
  327. },
  328. fail: function (res) {
  329. console.log(res);
  330. alertF("手机蓝牙未打开或不支持蓝牙");
  331. },
  332. });
  333. };
  334. /**
  335. * 连接蓝牙
  336. */
  337. const connectDevice = (e) => {
  338. console.log(e);
  339. let item = e;
  340. //停止扫描蓝牙
  341. console.info("停止搜寻附近的蓝牙外围设备");
  342. uni.stopBluetoothDevicesDiscovery({
  343. success: function (res) {
  344. console.log(device);
  345. if (item.selected == false) {
  346. console.log("第一次点击了");
  347. item.selected = true;
  348. setTimeout(function () {
  349. if (device.selected == undefined) {
  350. console.info("selected is undefined");
  351. linkFail(); //未找到设备, 请重新搜索
  352. return;
  353. }
  354. item.selected = false;
  355. }, 4000);
  356. } else {
  357. console.log("第二次点击了");
  358. return;
  359. }
  360. if (
  361. item.prefixName == undefined ||
  362. item.prefixName == "undefined" ||
  363. item.prefixName == ""
  364. ) {
  365. console.info("device.prefixName is undefined");
  366. linkFail(); //未找到设备, 请重新搜索
  367. return;
  368. }
  369. let prefixName = item.prefixName;
  370. connectPrefixName.value = item.prefixName;
  371. console.log(item);
  372. // datas.setData("connectPrefixName", connectPrefixName.value);
  373. // //断开蓝牙
  374. // bluetoothUtil.disconnectDevice();
  375. tools.showLoadingAlert("蓝牙连接中");
  376. console.info("连接的是" + prefixName, device);
  377. switch (prefixName) {
  378. case "WJ":
  379. wjApi.connectDevice(
  380. device,
  381. function (res) {
  382. connectSuccess(res);
  383. },
  384. function (res) {
  385. listenStatus(res);
  386. }
  387. );
  388. break;
  389. case "JL":
  390. jlApi.connectDevice(
  391. device,
  392. function (res) {
  393. console.log('设备链接1', res)
  394. connectSuccess(res);
  395. },
  396. function (res) {
  397. console.log('设备链接2', res)
  398. listenStatus(res);
  399. }
  400. );
  401. break;
  402. case "ETC":
  403. jlQZApi.connectDevice(
  404. device,
  405. function (res) {
  406. preDevice(res);
  407. },
  408. function (res) {
  409. listenStatus(res);
  410. }
  411. );
  412. break;
  413. case "JY":
  414. jyApi.connectDevice(
  415. device,
  416. function (res) {
  417. connectSuccess(res);
  418. },
  419. function (res) {
  420. listenStatus(res);
  421. }
  422. );
  423. break;
  424. case "AT":
  425. atApi.connectDevice(
  426. device,
  427. function (res) {
  428. connectSuccess(res);
  429. },
  430. function (res) {
  431. listenStatus(res);
  432. }
  433. );
  434. break;
  435. case "JT":
  436. console.info("连接的是=====123" + prefixName, device);
  437. jtApi.connectDevice(
  438. device,
  439. function (res) {
  440. console.log('设备链接1', res)
  441. connectSuccess(res);
  442. },
  443. function (res) {
  444. console.log('设备链接2', res)
  445. listenStatus(res);
  446. }
  447. );
  448. break;
  449. case "WQ":
  450. wqApi.connectDevice(
  451. device,
  452. function (res) {
  453. connectSuccess(res);
  454. },
  455. function (res) {
  456. listenStatus(res);
  457. }
  458. );
  459. break;
  460. case "CG":
  461. cgApi.connectDevice(
  462. device,
  463. function (res) {
  464. connectSuccess(res);
  465. },
  466. function (res) {
  467. listenStatus(res);
  468. }
  469. );
  470. break;
  471. case "TD":
  472. tdApi.connectDevice(
  473. device,
  474. function (res) {
  475. connectSuccess(res)
  476. }, function (res) {
  477. listenStatus(res);
  478. }
  479. );
  480. break;
  481. case "ZZ":
  482. zzApi.connectDevice(
  483. device,
  484. function (res) {
  485. connectSuccess(res);
  486. },
  487. function (res) {
  488. listenStatus(res);
  489. }
  490. );
  491. break;
  492. default: //未找到设备, 请重新搜索
  493. linkFail();
  494. break;
  495. }
  496. },
  497. fail: function (res) {
  498. console.log(res);
  499. linkFail(); //未找到设备, 请重新搜索
  500. },
  501. });
  502. };
  503. /**
  504. * 未找到设备, 请重新搜索
  505. */
  506. const linkFail = () => {
  507. datas.setData("bluLinkStatus", false);
  508. datas.setData("connectPrefixName", "");
  509. tools.showModalAlert("未找到设备, 请重新搜索", function successFunc() {
  510. load();
  511. });
  512. };
  513. /**
  514. * 连接成功
  515. */
  516. const connectSuccess = (res) => {
  517. console.log("连接回调函数func1");
  518. console.log(res);
  519. if (res.code == 0) {
  520. console.log("连接成功");
  521. tools.hideLoadingAlert(); //关闭加载框
  522. datas.setData("bluLinkStatus", true);
  523. datas.setData("connectPrefixName", connectPrefixName.value);
  524. oks();
  525. } else {
  526. alertF(res.msg);
  527. }
  528. };
  529. function oks() {
  530. //routeType 1.激活(订单来) 2.圈存 (/pages/recharge/recharge来)3.ping码解锁 4.信息读取 5从哪里来回哪里去监听bluetoothLink 7消费明细去圈存 8单位账户圈存 9对公账户修复
  531. if (routeType.value == "1") {
  532. uni.navigateTo({
  533. url: `/subpackage/after-sale/activation/activate?transfer=${state.transfer}`,
  534. });
  535. } else if (routeType.value == "2") {
  536. uni.navigateTo({
  537. url: `/pages/recharge/recharge-weixin?connectSuccess=${state.connectSuccess}`,
  538. });
  539. } else if (routeType.value == "3") {
  540. uni.navigateTo({
  541. url: "/subpackage/after-sale/pin-code-deblocking/pin-code-confirm?state=true&id=" + state.id,
  542. });
  543. } else if (routeType.value == "4") {
  544. uni.navigateTo({
  545. url: "/subpackage/after-sale/deviceInfo/deviceInfo",
  546. });
  547. } else if (routeType.value == "5") {
  548. // #ifdef MP-ALIPAY
  549. uni.navigateTo({
  550. url: "/subpackage/after-sale/activation-once-again/activation-once-again-ali?state=true&id=" + state.id,
  551. });
  552. // #endif
  553. // #ifdef MP-WEIXIN
  554. if (state.difference == "1") {
  555. uni.navigateTo({
  556. url: "/subpackage/after-sale/activation-once-again/activation-once-again?status=true&state=true&id=" + state.id,
  557. });
  558. } else {
  559. uni.$emit('bluetoothLink', { status: true })
  560. uni.navigateBack({
  561. delta: 1
  562. })
  563. }
  564. // #endif
  565. } else if (routeType.value == "6") {
  566. uni.navigateTo({
  567. url: "/subpackage/after-sale/activation-once-again/activation-once-again?state=true&id=" + state.id
  568. });
  569. } else if (routeType.value == "7") {
  570. uni.navigateTo({
  571. url: `/subpackage/personal-center/trapping-and-repairing/recharge-two?rechargeMoney=${state.rechargeMoney}&&orderNum=${state.orderNum}&&payMoney=${state.payMoney}`,
  572. });
  573. } else if (routeType.value == "8") {
  574. uni.navigateTo({
  575. url: `/subpackage/after-sale/account-recharge/recharge-weixin?accountId=${state.accountId}`,
  576. });
  577. } else if (routeType.value == "9") {
  578. uni.navigateTo({
  579. url: `/subpackage/personal-center/trapping-and-repairing-account/recharge-two?rechargeMoney=${state.rechargeMoney}&&orderNum=${state.orderNum}&&payMoney=${state.payMoney}&&accountId=${state.accountId}`,
  580. });
  581. } else {
  582. return;
  583. }
  584. }
  585. /**
  586. * 前装设备
  587. */
  588. const preDevice = (res) => {
  589. if (res.code == 0) {
  590. console.log("连接成功");
  591. datas.setData("bluLinkStatus", true);
  592. datas.setData("connectPrefixName", connectPrefixName.value);
  593. // tools.toUrl(route.preActivateInfo);//跳转 前装设备
  594. } else {
  595. alertF(res.msg);
  596. console.log(res.msg);
  597. }
  598. };
  599. /**
  600. * 监听蓝牙状态
  601. */
  602. const listenStatus = (res) => {
  603. console.log("时时监听蓝牙状态func2", connectPrefixName.value, res.code);
  604. console.log(res);
  605. if (res.code == 0) {
  606. datas.setData("bluLinkStatus", true);
  607. datas.setData("connectPrefixName", connectPrefixName.value);
  608. // oks();
  609. } else {
  610. //断开蓝牙
  611. bluetoothUtil.disconnectDevice();
  612. datas.setData("bluLinkStatus", false);
  613. datas.setData("connectPrefixName", "");
  614. tools.showToastAlert("蓝牙已断开");
  615. // #ifdef MP-ALIPAY
  616. my.closeBluetoothAdapter({
  617. success(res) {
  618. // 关闭蓝牙适配器成功
  619. },
  620. fail(err) {
  621. // 处理关闭蓝牙适配器失败的情况
  622. }
  623. })
  624. // #endif
  625. }
  626. };
  627. /**
  628. * 提示加关蓝牙
  629. */
  630. const alertF = (msg : string) => {
  631. //隐藏加载框
  632. tools.hideLoadingAlert();
  633. //断开蓝牙
  634. bluetoothUtil.disconnectDevice();
  635. //提示对话框
  636. tools.showModalAlert(msg);
  637. };
  638. </script>
  639. <style>
  640. page {
  641. background-color: #f3f3f3;
  642. }
  643. :deep(.u-mode-center-box) {
  644. border-radius: 20rpx;
  645. }
  646. </style>
  647. <style lang="scss" scoped>
  648. .devices {
  649. .device {
  650. width: calc(100% - 30rpx);
  651. margin-left: 30rpx;
  652. display: flex;
  653. flex-direction: row;
  654. align-items: center;
  655. margin-top: 30rpx;
  656. background: white;
  657. padding: 25rpx 20rpx;
  658. border-top-left-radius: 20rpx;
  659. border-bottom-left-radius: 20rpx;
  660. box-shadow: 0px 10px 10rpx 10rpx rgba(223, 223, 223, 0.3);
  661. .head {
  662. width: 120rpx;
  663. height: 120rpx;
  664. border-radius: 10rpx;
  665. background-color: #f3f3f3;
  666. }
  667. .center {
  668. flex: 1;
  669. margin-left: 30rpx;
  670. margin-right: 30rpx;
  671. .name {
  672. font-size: 30rpx;
  673. color: #333333;
  674. }
  675. .desc {
  676. font-size: 26rpx;
  677. color: #666666;
  678. margin-top: 25rpx;
  679. }
  680. }
  681. .icon {
  682. width: 43rpx;
  683. height: 43rpx;
  684. margin-right: 10rpx;
  685. }
  686. }
  687. .hint {
  688. margin: 60rpx 30rpx 0px;
  689. .orange-txt {
  690. font-size: 26rpx;
  691. color: #ff8000;
  692. image {
  693. width: 30rpx;
  694. height: 30rpx;
  695. margin-right: 10rpx;
  696. }
  697. }
  698. .grey-txt {
  699. font-size: 26rpx;
  700. color: #666666;
  701. line-height: 40rpx;
  702. margin-top: 16rpx;
  703. }
  704. }
  705. .btn {
  706. margin: 70rpx 40rpx;
  707. }
  708. }
  709. .red {
  710. display: inline-block;
  711. color: red;
  712. background-color: red;
  713. width: 26rpx;
  714. height: 26rpx;
  715. border-radius: 100%;
  716. }
  717. </style>