mainStatistics.vue 28 KB

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