mainStatistics.vue 27 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976
  1. <template>
  2. <view>
  3. <view class="head">
  4. <view class="">
  5. <image class="userFlagimg" src="../../static/img/userFlag.png" mode=""></image>
  6. </view>
  7. <view class="pname">
  8. <font class="wenzi" style="color: #BDD6F3;font-size:28upx"> {{$t('mainStatistics.name')}}: {{pnameData}}</font>
  9. </view>
  10. <view class="company">
  11. <font style="color: #BDD6F3;font-size:28upx">{{$t('mainStatistics.company')}}</font>
  12. </view>
  13. </view>
  14. <view class="ri">
  15. <view class="riShell">
  16. <view class="riImg">
  17. <image style="width: 64upx;height: 64upx;padding-top: 20upx;" :src="$t('mainStatistics.dayImg')"></image>
  18. </view>
  19. <view class="riTitle">
  20. <view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
  21. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.dayTotalMoney')}}:</font>
  22. <font style="color: #ED341F;">{{dayRandomTimes}}</font>
  23. </view>
  24. <view style="text-align:left;font-size:28upx;font-family:PingFang-SC-Medium">
  25. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.dayTotalNum')}}:</font>
  26. <font style="color: #ED341F;">{{dayRegularTimes}}</font>
  27. </view>
  28. </view>
  29. </view>
  30. <view class="riqi">
  31. <view style="text-align:right" class="tody">
  32. <font style="color: #596D83;">{{today}}</font>
  33. </view>
  34. <view style="text-align:right" class="xingqi">
  35. <font style="color: #596D83;">{{week}}</font>
  36. </view>
  37. </view>
  38. </view>
  39. <view class="fourTitle">
  40. <view class="four">
  41. <view class="fourImg">
  42. <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.weekImg')" mode=""></image>
  43. </view>
  44. <view class="fourShell">
  45. <view class="one">
  46. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.weekTotalMoney')}}:</font>
  47. <font style="color: #ED341F;">{{weekRandomTimes}}</font>
  48. </view>
  49. <view class="two">
  50. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.weekTotalNum')}}:</font>
  51. <font style="color: #ED341F;">{{weekRegularTimes}}</font>
  52. </view>
  53. </view>
  54. </view>
  55. <view class="four">
  56. <view class="fourImg">
  57. <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.monthImg')" mode=""></image>
  58. </view>
  59. <view class="fourShell">
  60. <view class="one">
  61. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.monthTotalMoney')}}:</font>
  62. <font style="color: #ED341F;">{{monthRandomTimes}}</font>
  63. </view>
  64. <view class="two">
  65. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.monthTotalNum')}}:</font>
  66. <font style="color: #ED341F;">{{monthRegularTimes}}</font>
  67. </view>
  68. </view>
  69. </view>
  70. <view class="four">
  71. <view class="fourImg">
  72. <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.yearImg')" mode=""></image>
  73. </view>
  74. <view class="fourShell">
  75. <view class="one">
  76. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.yearTotalMoney')}}:</font>
  77. <font style="color: #ED341F;">{{yearRandomTimes}}</font>
  78. </view>
  79. <view class="two">
  80. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.yearTotalNum')}}:</font>
  81. <font style="color: #ED341F;">{{yearRegularTimes}}</font>
  82. </view>
  83. </view>
  84. </view>
  85. <view class="four">
  86. <view class="fourImg">
  87. <image style="width: 54upx;height: 54upx;padding-top: 20upx;" :src="$t('mainStatistics.allImg')" mode=""></image>
  88. </view>
  89. <view class="fourShell">
  90. <view class="one">
  91. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.machineTotalNum')}}:</font>
  92. <font style="color: #ED341F;">{{machineTotalNum}}</font>
  93. </view>
  94. <view class="two">
  95. <font class="fontLeft" style="color: #596D83;">{{$t('mainStatistics.machineUseNum')}}:</font>
  96. <font style="color: #ED341F;">{{machineUseNum}}</font>
  97. </view>
  98. </view>
  99. </view>
  100. </view>
  101. <!-- 机器详情表 -->
  102. <view class="">
  103. <view v-if="merchantList.length>1">
  104. <uni-collapse :accordion="true">
  105. <view class="titleFlag">
  106. <image class="img" src="../../static/img/red.png"></image>
  107. <font class="wenziT">红色代表机器报警</font>
  108. <image class="img" src="../../static/img/green.png"></image>
  109. <font class="wenziT">绿色代表机器正常</font>
  110. </view>
  111. <view class="titlelist" v-for="(merchant,index) in merchantList" :key="merchant.id">
  112. <uni-collapse-item :title="getMerchantTitle(merchant)" :open="index===0">
  113. <view style="padding: 20upx;background-color: aliceblue;">
  114. <view v-if="merchant.equipmentList.length==0" style="text-align: center;">暂无数据</view>
  115. <view v-if="merchant.equipmentList.length>0">
  116. <uni-collapse :show-animation="true">
  117. <view style="position: relative;" v-for="equipment in merchant.equipmentList" :key="equipment.id">
  118. <span class="status-css" :class="equipment.hasTodayAlarm===true?statusError : statusNormal"></span>
  119. <uni-collapse-item :title="getEquipmentTitle(equipment)">
  120. <view style="padding: 20upx;background-color: antiquewhite;">
  121. <view class="swithBox" v-if="equipment.isSleep">
  122. <view class="swichFont">睡眠状态:机器已睡眠</view>
  123. <view class="switch">
  124. <switch style="transform:scale(0.65)" checked @change="change(equipment.id,0)" />
  125. </view>
  126. </view>
  127. <view class="swithBox" v-else>
  128. <view class="swichFont">睡眠状态:未睡眠</view>
  129. <view class="switch">
  130. <switch style="transform:scale(0.65)" :checked="sleepChecked" @change="change(equipment.id,1)" />
  131. </view>
  132. </view>
  133. <view class="line1"></view>
  134. <view class="swithBox" v-if="equipment.eqeStatus==0">
  135. <view class="swichFont">关机:已关机</view>
  136. <view class="switch">
  137. <switch style="transform:scale(0.65)" checked @change="OnOff(equipment.id,1)" />
  138. </view>
  139. </view>
  140. <view class="swithBox" v-else>
  141. <view class="swichFont">关机:未关机</view>
  142. <view class="switch">
  143. <switch style="transform:scale(0.65)" :checked="onffChecked" @change="OnOff(equipment.id,0)" />
  144. </view>
  145. </view>
  146. <view class="line1"></view>
  147. <view><span>机器唯一码:</span><span>{{equipment.clientId}}</span></view>
  148. <view><span>所在地:</span><span>{{equipment.fullName?equipment.fullName:''}}</span></view>
  149. <view><span>炉头温度:</span><span>{{equipment.furnaceTm?equipment.furnaceTm:''}}</span></view>
  150. <view><span>柜内湿度:</span><span>{{equipment.cabinetHd?equipment.cabinetHd:''}}</span></view>
  151. <view><span>柜内温度:</span><span>{{equipment.cabinetTm?equipment.cabinetTm:''}}</span></view>
  152. <view v-if="equipment.hasTodayAlarm">
  153. <view><span>报警内容:</span></view>
  154. <view v-for="(alarm,index) in equipment.alarmList" :key="index">
  155. <view><span class="baojing">{{alarm.occurrenceTime?alarm.occurrenceTime:''}} {{alarm.alarmContent}}</span></view>
  156. </view>
  157. </view>
  158. <view v-else>
  159. <view><span>报警内容:</span><span>{{equipment.occurrenceTime?equipment.occurrenceTime:''}}
  160. {{equipment.alarmContent}}</span></view>
  161. </view>
  162. </view>
  163. </uni-collapse-item>
  164. </view>
  165. </uni-collapse>
  166. </view>
  167. </view>
  168. </uni-collapse-item>
  169. </view>
  170. </uni-collapse>
  171. </view>
  172. <view v-else>
  173. <uni-collapse :show-animation="true">
  174. <view class="titleFlag">
  175. <image class="img" src="../../static/img/red.png"></image>
  176. <font class="wenziT">{{$t('equipmentStatusList.red')}}</font>
  177. <image class="img" src="../../static/img/green.png"></image>
  178. <font class="wenziT">{{$t('equipmentStatusList.green')}}</font>
  179. </view>
  180. <view class="titlelist" style="position: relative;" v-for="equipment in merchantList[0].equipmentList" :key="equipment.id">
  181. <span class="status-css" :class="equipment.hasTodayAlarm===true?statusError : statusNormal"></span>
  182. <uni-collapse-item :title="getEquipmentTitle(equipment)">
  183. <!-- 睡眠 -->
  184. <view style="padding: 20upx;background-color: antiquewhite;">
  185. <view class="swithBox" v-if="equipment.isSleep">
  186. <view class="swichFont">{{$t('equipmentStatusList.sleep')}}</view>
  187. <view class="switch">
  188. <switch style="transform:scale(0.65)" checked @change="change(equipment.id,0)" />
  189. </view>
  190. </view>
  191. <view class="swithBox" v-else>
  192. <view class="swichFont">{{$t('equipmentStatusList.unsleep')}}</view>
  193. <view class="switch">
  194. <switch style="transform:scale(0.65)" :checked="sleepChecked" @change="change(equipment.id,1)" />
  195. </view>
  196. </view>
  197. <view class="line1"></view>
  198. <!-- 关机 -->
  199. <view class="" v-if="globalUser.open==0">
  200. <view class="swithBox" v-if="equipment.eqeStatus==0">
  201. <view class="swichFont">{{$t('equipmentStatusList.off')}}</view>
  202. <view class="switch">
  203. <switch style="transform:scale(0.65)" checked @change="OnOff(equipment.id,1)" />
  204. </view>
  205. </view>
  206. <view class="swithBox" v-else>
  207. <view class="swichFont">{{$t('equipmentStatusList.on')}}</view>
  208. <view class="switch">
  209. <switch style="transform:scale(0.65)" :checked="onffChecked" @change="OnOff(equipment.id,0)" />
  210. </view>
  211. </view>
  212. </view>
  213. <view class="line1"></view>
  214. <!-- 远程开门 -->
  215. <view class="opendoor"><span>{{$t('equipmentStatusList.door')}}:</span>
  216. <view class="">
  217. <button type="primary" @click="openDoor(equipment.id)" class="button">
  218. <p class="p">{{$t('equipmentStatusList.open')}}</p>
  219. </button>
  220. </view>
  221. </view>
  222. <view><span>{{$t('equipmentStatusList.equipmentNo')}}:</span><span>{{equipment.clientId}}</span></view>
  223. <view><span>{{$t('equipmentStatusList.area')}}:</span><span>{{equipment.fullName?equipment.fullName:''}}</span></view>
  224. <view><span>{{$t('equipmentStatusList.temperature')}}:</span><span>{{equipment.furnaceTm?equipment.furnaceTm:''}}</span></view>
  225. <view><span>{{$t('equipmentStatusList.humidity')}}:</span><span>{{equipment.cabinetHd?equipment.cabinetHd:''}}</span></view>
  226. <view><span>{{$t('equipmentStatusList.equipmentTemperature')}}:</span><span>{{equipment.cabinetTm?equipment.cabinetTm:''}}</span></view>
  227. <view class="" v-if="equipment.hasTodayAlarm">
  228. <view><span>{{$t('equipmentStatusList.alarm')}}:</span></view>
  229. <view v-for="(alarm,index) in equipment.alarmList" :key="index">
  230. <view><span class="baojing">{{alarm.occurrenceTime?alarm.occurrenceTime:''}} {{alarm.alarmContent}}</span></view>
  231. </view>
  232. </view>
  233. <view class="" v-else>
  234. <view><span>{{$t('equipmentStatusList.alarm')}}:</span><span>{{equipment.occurrenceTime?equipment.occurrenceTime:''}}
  235. {{equipment.alarmContent}}</span></view>
  236. </view>
  237. </view>
  238. </uni-collapse-item>
  239. </view>
  240. </uni-collapse>
  241. </view>
  242. </view>
  243. </view>
  244. </template>
  245. <script>
  246. import {
  247. mapState,
  248. mapActions,
  249. mapMutations
  250. } from 'vuex';
  251. // import uCharts from '@/components/u-charts/u-charts.js';
  252. import uniCollapse from '@/components/uni-collapse/uni-collapse.vue'
  253. import uniCollapseItem from '@/components/uni-collapse-item/uni-collapse-item.vue'
  254. import uniList from '@/components/uni-list/uni-list.vue'
  255. import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
  256. import {
  257. dateUtils
  258. } from '@/common/util.js';
  259. var _self;
  260. export default {
  261. name: 'mainStatistics',
  262. props: {
  263. equipmentId: '',
  264. adminId: '',
  265. pname: '',
  266. },
  267. components: {
  268. uniCollapse,
  269. uniCollapseItem,
  270. uniList,
  271. uniListItem,
  272. },
  273. data() {
  274. return {
  275. machineTotalNum: 0,
  276. machineUseNum: 0,
  277. dayRandomTimes: 0,
  278. dayRegularTimes: 0,
  279. weekRandomTimes: 0,
  280. weekRegularTimes: 0,
  281. monthRandomTimes: 0,
  282. monthRegularTimes: 0,
  283. yearRandomTimes: 0,
  284. yearRegularTimes: 0,
  285. today: '',
  286. week: '',
  287. globalUser: {},
  288. merchantList: [{
  289. equipmentList: []
  290. }],
  291. extraIcon: {
  292. color: '#4cd964',
  293. size: '22',
  294. type: 'spinner'
  295. },
  296. statusNormal: 'status-normal',
  297. statusError: 'status-error',
  298. sleepChecked: null,
  299. onffChecked: null,
  300. time: null,
  301. timeAll: {
  302. },
  303. // input: 0
  304. }
  305. },
  306. computed: {
  307. ...mapState(['loginUser']),
  308. pnameData: {
  309. get() {
  310. return this.pname;
  311. }
  312. },
  313. },
  314. onShow() {
  315. uni.setNavigationBarTitle({
  316. title: this.$t('mainStatistics.title')
  317. });
  318. uni.setTabBarItem({
  319. index: 0,
  320. text: this.$t('tabs.tab1')
  321. });
  322. var token = uni.getStorageSync("token");
  323. if (token.toString().length > 1) {
  324. this.init();
  325. } else {
  326. uni.reLaunch({
  327. url: '../Login/Login',
  328. });
  329. }
  330. // this.input = this.input + 1;
  331. var test = uni.getStorageSync('test');
  332. var globalUser = uni.getStorageSync("globalUser");
  333. this.globalUser = globalUser;
  334. if (globalUser.toString().length > 1) {
  335. //判断是不是初次登陆
  336. if (test == 2) {
  337. this.init();
  338. }
  339. }
  340. var id = this.adminId;
  341. this.day();
  342. // this.equipmentStatus();
  343. },
  344. mounted() {
  345. var token = uni.getStorageSync("token");
  346. if (token.toString().length > 1) {
  347. this.init();
  348. } else {
  349. uni.reLaunch({
  350. url: '../Login/Login',
  351. });
  352. }
  353. // this.day();
  354. this.equipmentStatus();
  355. },
  356. methods: {
  357. ...mapActions('chart', ['getStatistics', 'getMainStatistics', 'getMachineNum','getEquipmentListByUser']),
  358. async init() {
  359. if (!this.pname) {
  360. this.pname = this.loginUser.name;
  361. }
  362. _self = this;
  363. await this.getMainStatisticsData();
  364. await this.getEquipmentListData();
  365. //初次登陆跳转后,把test变成2
  366. uni.setStorageSync('test', '2');
  367. },
  368. day() {
  369. var date = new Date();
  370. // var daystr = dateUtils.formateDate(date, 'yyyy年MM月dd日');
  371. var daystr = dateUtils.formateDate(date, 'yyyy-MM-dd');
  372. this.today = daystr;
  373. // var str= '星期'+'日一二三四五六'.charAt(date.getDay());
  374. this.week = this.$t('mainStatistics.week' + date.getDay());
  375. },
  376. equipmentStatus() {
  377. var id = uni.getStorageSync("globalUser").id;
  378. var token = uni.getStorageSync("token");
  379. uni.request({
  380. url: this.serverurl + '/TEquipment/equipmentStatus',
  381. data: {
  382. "adminId": id
  383. },
  384. header: {
  385. 'token': token
  386. },
  387. method: "POST",
  388. success: (res) => {
  389. },
  390. });
  391. },
  392. getMainStatisticsData() {
  393. const param = {};
  394. if (this.adminId) { // 子组件,则拿传过来的参
  395. param['adminId'] = this.adminId;
  396. } else if ('admin' !== this.loginUser['username']) { //否则为主页,拿登录用户
  397. param['adminId'] = this.loginUser['id'];
  398. }
  399. var globalUser = uni.getStorageSync("globalUser");
  400. if (globalUser.id != 1) {
  401. if (param.adminId == null || param.adminId == undefined) {
  402. param['adminId'] = globalUser.id;
  403. }
  404. }
  405. if (this.equipmentId) {
  406. param['equipmentId'] = this.equipmentId;
  407. }
  408. // console.log('getMainStatisticsData:{}', param);
  409. var adminId = param.adminId;
  410. var equipmentId = this.equipmentId;
  411. var serverurl = this.serverurl;
  412. var token = uni.getStorageSync("token");
  413. uni.request({
  414. url: serverurl + '/TEquipment/getMachineNum',
  415. data: {
  416. "adminId": adminId,
  417. "equipmentId": equipmentId
  418. },
  419. method: "POST",
  420. header: {
  421. 'token': token
  422. },
  423. success: (res) => {
  424. var list = res.data.data;
  425. this.machineTotalNum = list[0];
  426. this.machineUseNum = list[1];
  427. }
  428. });
  429. return this.getMainStatistics(param)
  430. .then(data => {
  431. for (let bean of data) {
  432. if (bean['categorie'] === 'day') {
  433. if(bean['randomTimes']!=null){
  434. this.dayRandomTimes = bean['randomTimes'];
  435. }
  436. if(bean['regularTimes']!=null){
  437. this.dayRegularTimes = bean['regularTimes'];
  438. }
  439. }
  440. if (bean['categorie'] === 'week') {
  441. if(bean['randomTimes']!=null){
  442. this.weekRandomTimes = bean['randomTimes'];
  443. }
  444. if(bean['regularTimes']!=null){
  445. this.weekRegularTimes = bean['regularTimes'];
  446. }
  447. }
  448. if (bean['categorie'] === 'month') {
  449. if(bean['randomTimes']!=null){
  450. this.monthRandomTimes = bean['randomTimes'];
  451. }
  452. if(bean['regularTimes']!=null){
  453. this.monthRegularTimes = bean['regularTimes'];
  454. }
  455. }
  456. if (bean['categorie'] === 'year') {
  457. if(bean['randomTimes']!=null){
  458. this.yearRandomTimes = bean['randomTimes'];
  459. }
  460. if(bean['regularTimes']!=null){
  461. this.yearRegularTimes = bean['regularTimes'];
  462. }
  463. }
  464. }
  465. uni.stopPullDownRefresh();
  466. }, _ => void uni.stopPullDownRefresh());
  467. },
  468. // 属性方法
  469. getMerchantTitle(merchant) {
  470. return merchant.name ? merchant.name : merchant.username;
  471. },
  472. getEquipmentTitle(equipment) {
  473. return equipment.name ? equipment.name : '暂无名称';
  474. },
  475. getEquipmentListData() {
  476. this.getEquipmentListByUser(this.globalUser)
  477. .then(data => {
  478. this.merchantList = data;
  479. var listName = data[0].equipmentList;
  480. var times = new Map;
  481. // if (this.input == 1) {
  482. // for (var i = 0; i < listName.length; i++) {
  483. // var k = listName[i].id;
  484. // times.set(k, null);
  485. // }
  486. // this.timeAll = times;
  487. // }
  488. var listId = data[0].id;
  489. if (listId != null && listId != '1') {
  490. uni.setStorageSync("listName", listName);
  491. }
  492. uni.stopPullDownRefresh();
  493. }, _ => void uni.stopPullDownRefresh());
  494. },
  495. OnOff(id, code) {
  496. var that = this;
  497. var ddd = this.timeAll.get(id);
  498. if (that.timeAll.get(id) != null) {
  499. var stamp = Date.parse(new Date());
  500. var t = (stamp - that.timeAll.get(id)) / 1000;
  501. if (t < 30) {
  502. var s = 30 - t;
  503. uni.showModal({
  504. title: that.$t('equipmentStatusList.onoff'),
  505. content: that.$t('equipmentStatusList.remainingtime') + s + "s",
  506. success: function(res) {
  507. that.getEquipmentListData();
  508. }
  509. });
  510. return;
  511. }
  512. }
  513. var code1 = code;
  514. if (code1 == 0) {
  515. uni.showModal({
  516. title: that.$t('equipmentStatusList.tip'),
  517. content: that.$t('equipmentStatusList.onoffTip'),
  518. success: function(res) {
  519. if (res.confirm) {
  520. var serverurl = that.serverurl;
  521. var code2 = code1;
  522. var equipmentId = id;
  523. var token = uni.getStorageSync("token");
  524. uni.request({
  525. url: serverurl + '/TEquipment/onOff',
  526. data: {
  527. "adminId": code2,
  528. "equipmentId": equipmentId
  529. },
  530. method: "POST",
  531. header:{
  532. 'token':token
  533. },
  534. success: (res) => {
  535. var list = res.data.data;
  536. // that.input = 2;
  537. var timestamp = Date.parse(new Date());
  538. that.timeAll.set(id, timestamp);
  539. var oo = that.timeAll;
  540. // that.time = timestamp;
  541. that.getEquipmentListData();
  542. if (list == 'SUCCESS') {
  543. uni.showModal({
  544. title: that.$t('equipmentStatusList.guanji'),
  545. content: that.$t('equipmentStatusList.tishi'),
  546. success: function(res) {
  547. that.getEquipmentListData();
  548. setTimeout(function () {
  549. that.network(id);
  550. }, 7000);
  551. }
  552. })
  553. } else {
  554. uni.showModal({
  555. title: that.$t('equipmentStatusList.error'),
  556. content: that.$t('equipmentStatusList.guanjierror'),
  557. success: function(res) {
  558. that.onffChecked = true;
  559. that.getEquipmentListData();
  560. }
  561. })
  562. }
  563. }
  564. });
  565. } else if (res.cancel) {
  566. that.onffChecked = false;
  567. that.getEquipmentListData();
  568. }
  569. }
  570. });
  571. } else {
  572. var serverurl = that.serverurl;
  573. var code = code;
  574. var equipmentId = id;
  575. var token = uni.getStorageSync("token");
  576. uni.request({
  577. url: serverurl + '/TEquipment/onOff',
  578. data: {
  579. "adminId": code,
  580. "equipmentId": equipmentId
  581. },
  582. method: "POST",
  583. header:{
  584. 'token':token
  585. },
  586. success: (res) => {
  587. // that.input = 2;
  588. var list = res.data.data;
  589. that.getEquipmentListData();
  590. var timestamp = Date.parse(new Date());
  591. that.timeAll.set(id, timestamp);
  592. var oo = that.timeAll;
  593. // that.time = timestamp;
  594. if (list == "SUCCESS") {
  595. uni.showModal({
  596. title: that.$t('equipmentStatusList.kaiji'),
  597. content: that.$t('equipmentStatusList.tishi'),
  598. success: function(res) {
  599. that.getEquipmentListData();
  600. setTimeout(function () {
  601. that.network(id);
  602. }, 7000);
  603. }
  604. })
  605. } else {
  606. uni.showModal({
  607. title: that.$t('equipmentStatusList.error'),
  608. content: that.$t('equipmentStatusList.kaijierror'),
  609. success: function(res) {
  610. that.onffChecked = false;
  611. that.getEquipmentListData();
  612. }
  613. })
  614. }
  615. }
  616. });
  617. }
  618. },
  619. network(id){
  620. var token = uni.getStorageSync("token");
  621. var equipmentId = id;
  622. uni.request({
  623. url: this.serverurl + '/TEquipment/checkStatus',
  624. data: {
  625. "equipmentId": id
  626. },
  627. method: "POST",
  628. header:{
  629. 'token':token
  630. },
  631. success: (res) => {
  632. var data = res.data.data;
  633. if(data=='fail'){
  634. uni.showToast({
  635. title: this.$t('equipmentStatusList.network'),
  636. icon:'none',
  637. duration: 3000
  638. });
  639. this.getEquipmentListData();
  640. }
  641. }
  642. });
  643. },
  644. openDoor(id) {
  645. var token = uni.getStorageSync("token");
  646. uni.request({
  647. url: this.serverurl + '/TEquipment/openDoor',
  648. data: {
  649. "equipmentId": id
  650. },
  651. method: "POST",
  652. header:{
  653. 'token':token
  654. },
  655. success: (res) => {
  656. uni.showModal({
  657. title: this.$t('equipmentStatusList.open'),
  658. content: this.$t('equipmentStatusList.opensuccess'),
  659. success: function(res) {
  660. }
  661. })
  662. }
  663. });
  664. },
  665. change(id, code) {
  666. var that = this;
  667. var code1 = code;
  668. if (code1 == 1) {
  669. uni.showModal({
  670. title: that.$t('equipmentStatusList.tip'),
  671. content: that.$t('equipmentStatusList.sleepTip'),
  672. success: function(res) {
  673. if (res.confirm) {
  674. var serverurl = that.serverurl;
  675. var code2 = code1;
  676. var equipmentId = id;
  677. var token = uni.getStorageSync("token");
  678. uni.request({
  679. url: serverurl + '/TEquipment/sleep',
  680. data: {
  681. "adminId": code2,
  682. "equipmentId": equipmentId
  683. },
  684. method: "POST",
  685. header:{
  686. 'token':token
  687. },
  688. success: (res) => {
  689. var list = res.data.data;
  690. that.getEquipmentListData();
  691. }
  692. });
  693. } else if (res.cancel) {
  694. that.sleepChecked = false;
  695. that.getEquipmentListData();
  696. }
  697. }
  698. });
  699. } else {
  700. var serverurl = that.serverurl;
  701. var code = code;
  702. var equipmentId = id;
  703. var token = uni.getStorageSync("token");
  704. uni.request({
  705. url: serverurl + '/TEquipment/sleep',
  706. data: {
  707. "adminId": code,
  708. "equipmentId": equipmentId
  709. },
  710. method: "POST",
  711. header:{
  712. 'token':token
  713. },
  714. success: (res) => {
  715. var list = res.data.data;
  716. that.getEquipmentListData();
  717. }
  718. });
  719. }
  720. },
  721. }
  722. }
  723. </script>
  724. <style>
  725. page {
  726. /* background: #F2F2F2; */
  727. background: #FFFFFF;
  728. width: 750upx;
  729. overflow-x: hidden;
  730. }
  731. .head {
  732. display: flex;
  733. flex-direction: row;
  734. background: #206DC3;
  735. width: 750upx;
  736. height: 180upx;
  737. }
  738. .company {
  739. width: 48%;
  740. text-align: right;
  741. }
  742. .pname {
  743. display: flex;
  744. flex-direction: row;
  745. width: 40%;
  746. }
  747. .userFlagimg {
  748. padding-left: 30upx;
  749. padding-top: 10upx;
  750. width: 26upx;
  751. height: 28upx;
  752. }
  753. .wenzi {
  754. padding-left: 5upx;
  755. /* text-align:right; */
  756. white-space: nowrap;
  757. overflow: hidden;
  758. /* text-overflow: ellipsis; */
  759. }
  760. .ri {
  761. width: 690upx;
  762. height: 180upx;
  763. background: #FFFFFF;
  764. border-radius: 15upx;
  765. /* 上移 */
  766. transform: translateY(-90upx);
  767. text-align: center;
  768. margin: auto;
  769. display: flex;
  770. flex-direction: row;
  771. /* 阴影 */
  772. box-shadow: 0upx -1upx 20upx #D3D3D3;
  773. /* box-shadow:0px 0px 10px 5px #aaa; */
  774. }
  775. .riShell {
  776. display: flex;
  777. flex-direction: row;
  778. margin: auto;
  779. }
  780. .riTitle {
  781. display: flex;
  782. flex-direction: column;
  783. margin: auto;
  784. }
  785. .riqi {
  786. display: flex;
  787. flex-direction: column;
  788. margin: auto;
  789. }
  790. .fourTitle {
  791. width: 690upx;
  792. height: 294upx;
  793. display: flex;
  794. flex-direction: row;
  795. flex-wrap: wrap;
  796. background: #FFFFFF;
  797. box-shadow: 0upx 0upx 20upx #D3D3D3;
  798. margin: auto;
  799. border-radius: 15upx;
  800. transform: translateY(-60upx);
  801. }
  802. .four {
  803. display: flex;
  804. flex-direction: row;
  805. margin: auto;
  806. width: 48%;
  807. }
  808. .fourImg {
  809. width: 54upx;
  810. height: 54upx;
  811. }
  812. .qiun-padding {
  813. padding: 2%;
  814. width: 96%;
  815. }
  816. .qiun-wrap {
  817. display: flex;
  818. flex-wrap: wrap;
  819. }
  820. .qiun-rows {
  821. display: flex;
  822. flex-direction: row !important;
  823. }
  824. .fontLeft {
  825. margin-right: 6upx;
  826. }
  827. /* 参数表 */
  828. .status-css {
  829. position: absolute;
  830. width: 30upx;
  831. height: 30upx;
  832. right: 86upx;
  833. top: 30upx;
  834. border-radius: 30upx;
  835. color: "#596D83";
  836. font-size: 12upx;
  837. }
  838. .status-error {
  839. background-color: #dd524d
  840. }
  841. .status-normal {
  842. background-color: #4cd964
  843. }
  844. .baojing {
  845. padding-left: 120upx;
  846. }
  847. .titleFlag {
  848. height: 56upx;
  849. background-color: #F8F8F8;
  850. color: #8C959F;
  851. font-size: 22upx;
  852. display: flex;
  853. flex-direction: row;
  854. }
  855. .opendoor {
  856. /* #ifdef H5 */
  857. /* #endif */
  858. padding-top: 10upx;
  859. padding-bottom: 10upx;
  860. /* text-align: center; */
  861. display: flex;
  862. flex-direction: row;
  863. }
  864. .button {
  865. /* #ifdef H5 */
  866. text-align: center;
  867. height: 50upx;
  868. weight:20upx ;
  869. /* #endif */
  870. padding-left: 15upx;
  871. /* padding-top: 2upx; */
  872. }
  873. .p {
  874. /* #ifdef H5 */
  875. font-size: 28upx;
  876. height: 50upx;
  877. weight:20upx ;
  878. transform: translateY(-14upx);
  879. /* text-align: center; */
  880. /* #endif */
  881. /* padding-bottom: 50upx; */
  882. text-align: center;
  883. padding-left: 13upx;
  884. }
  885. .img {
  886. padding-top: 20upx;
  887. padding-left: 30upx;
  888. width: 15upx;
  889. height: 15upx;
  890. }
  891. .wenziT {
  892. padding-top: 10upx;
  893. padding-left: 10upx;
  894. }
  895. .titlelist {
  896. color: #363D44;
  897. font-size: 16upx;
  898. font-family: "PingFang-SC-Medium";
  899. }
  900. .swithBox {
  901. display: flex;
  902. flex-direction: row;
  903. padding-bottom: 15upx;
  904. padding-top: 5upx;
  905. }
  906. .switch {
  907. width: 44upx;
  908. height: 22upx;
  909. }
  910. .swichFont {
  911. width: 85%;
  912. padding-top: 12upx;
  913. }
  914. .line1 {
  915. width: 100%;
  916. height: 3upx;
  917. background: #000000;
  918. }
  919. </style>