Immediateinspection.vue 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404
  1. <template>
  2. <view class="pad16">
  3. <view class="getuserInfo">
  4. <view class="getuserInfoimg">
  5. <u--image :src="src" width="96rpx" height="96rpx" style="border-radius: 4px;"></u--image>
  6. </view>
  7. <view class="getuserInfoname">
  8. <h3>{{getuserInfo.realName}}</h3>
  9. <view>安保组</view>
  10. </view>
  11. <view class="getuserInfophone">
  12. <view class="getuserInfophone1">
  13. <u-icon name="phone" color="#2979ff" size="36"></u-icon>
  14. </view>
  15. <view class="getuserInfophone2">{{getuserInfo.mobile}}</view>
  16. </view>
  17. </view>
  18. <!--打卡-->
  19. <view class="Punchin">
  20. <view class="dakaweizhi">
  21. <view class="dakaweizhi1">
  22. <u-icon name="map" color="#6DD400" size="36"></u-icon>
  23. </view>
  24. <view class="dakaweizhi2">当前打卡位置:{{Punchposition}}</view>
  25. </view>
  26. <view class="shexiangji" @click="Punchindata">
  27. <view class="shexiangji1">扫码打卡</view>
  28. <view class="shexiangji2">
  29. <u-icon name="camera" color="#ffffff" size="90"></u-icon>
  30. </view>
  31. </view>
  32. </view>
  33. <view class="dakajilv">今日打卡记录</view>
  34. <view class="u-listdata">
  35. <view style="padding:16rpx 0 16rpx 32rpx">
  36. 共有 <span style="color: red">{{totalnumber}}</span>条记录
  37. </view>
  38. <u-list @scrolltolower="scrolltolower" :pagingEnabled='true' style="height: 100px;flex:1;">
  39. <u-list-item v-for="(item, index) in indexList" :key="index">
  40. <view class="companylist">
  41. <h3>{{item.position}}</h3>
  42. <view class="Currentamount">
  43. 巡检时间:{{item.circuitTime}}
  44. </view>
  45. </view>
  46. </u-list-item>
  47. </u-list>
  48. </view>
  49. <u-notify ref="uNotify" message=""></u-notify>
  50. </view>
  51. </template>
  52. <script>
  53. import {
  54. getCurrentTime
  55. } from "@/utils/index";
  56. export default {
  57. data() {
  58. return {
  59. Punchposition: '',
  60. getuserInfo: {},
  61. pd: true,
  62. totalnumber: 0,
  63. indexList: [],
  64. src: 'https://cdn.uviewui.com/uview/album/1.jpg',
  65. dataForm: {
  66. page: 1,
  67. limit: 99999,
  68. circuitType: "",
  69. startDate: "",
  70. endDate: "",
  71. buildingId: "",
  72. storeyId: "",
  73. circuitPersonId: "",
  74. },
  75. }
  76. },
  77. //监听页面加载,其参数为上个页面传递的数据,参数类型为 Object(用于页面传参
  78. onLoad() {
  79. this.getuserInfo = uni.getStorageSync('getuserInfo');
  80. var date = new Date();
  81. var year = date.getFullYear();
  82. var month = date.getMonth() + 1;
  83. var day = date.getDate();
  84. // this.circuitPosition = this.$route.query.circuitPosition;
  85. this.dataForm.startDate = `${year}-${month}-${day}` + " 00:00:00";
  86. this.dataForm.endDate = `${year}-${month}-${day}` + " 23:59:59";
  87. this.dataForm.circuitPersonId = this.getuserInfo.id;
  88. // this.dataForm.circuitType = this.userInfo.circuitType;
  89. this.getDataList();
  90. },
  91. //监听页面初次渲染完成。注意如果渲染速度快,会在页面进入动画完成前触发
  92. onReady() {},
  93. //监听页面隐藏
  94. onHide() {},
  95. //监听窗口尺寸变化
  96. onResize() {},
  97. //监听页面卸载
  98. onUnload() {},
  99. //监听用户下拉动作,一般用于下拉刷新
  100. onPullDownRefresh() {},
  101. methods: {
  102. goback() {
  103. uni.navigateTo({
  104. url: '/pages/index/index'
  105. })
  106. },
  107. Punchindata() {
  108. uni.scanCode({
  109. //是否只能从相机扫码,不能从相册扫码
  110. onlyFromCamera: false,
  111. //规定扫码类型 字节跳动小程序不支持此参数
  112. // barcode就是一维码(条形码) qrcode就是(er)维码
  113. // datamatrix就是Data Matrix码 pdf417就是PDF417条码
  114. scanType: ['barCode', 'qrCode', ],
  115. // 是否启动自动识别字符编码功能
  116. autoDecodeCharset: false,
  117. // 是否开启自动放大功能 仅 App-Android (3.5.4+) 支持
  118. autoZoom: false,
  119. // 是否支持手动输入条形码 仅飞书小程序(V3.14.0)支持
  120. barCodeInput: false,
  121. success: (res) => {
  122. let lsdata =res.result;
  123. if(lsdata.indexOf('houseId')=='-1'){
  124. //没有房间号
  125. this.Punchposition = lsdata.substr(lsdata.indexOf('position')+11,lsdata.indexOf('projectId')-(lsdata.indexOf('position')+14));
  126. let postdata = {
  127. "buildingId":lsdata.substr(lsdata.indexOf('buildingId')+12,19), //楼宇id
  128. "storeyId":lsdata.substr(lsdata.indexOf('storeyId')+10,19), //楼层id
  129. "houseId":'', //房间id
  130. "position": this.Punchposition, //位置信息
  131. "circuitPersonId": this.getuserInfo.id, //巡检人员id
  132. "circuitTime": getCurrentTime(), //巡检时间
  133. // "circuitType": this.getuserInfo.circuitType,//巡检类型
  134. "circuitType": '', //巡检类型
  135. "remark": lsdata.substr(lsdata.indexOf('remark')+8,lsdata.indexOf('buildingId')-(lsdata.indexOf('remark')+10)), //备注
  136. }
  137. this.$api.post('/circuitrecord', postdata)
  138. .then(res => {
  139. if (res.data.code == 0) {
  140. this.$refs.uNotify.success('打卡成功')
  141. this.getDataListtwo();
  142. } else {
  143. this.$refs.uNotify.error('打卡失败')
  144. }
  145. })
  146. }else{
  147. this.Punchposition = lsdata.substr(lsdata.indexOf('position')+11,lsdata.indexOf('projectId')-(lsdata.indexOf('position')+14));
  148. let postdata = {
  149. "buildingId":lsdata.substr(lsdata.indexOf('buildingId')+12,19), //楼宇id
  150. "storeyId":lsdata.substr(lsdata.indexOf('storeyId')+10,19), //楼层id
  151. "houseId":lsdata.substr(lsdata.indexOf('houseId')+9,19), //房间id
  152. "position": this.Punchposition, //位置信息
  153. "circuitPersonId": this.getuserInfo.id, //巡检人员id
  154. "circuitTime": getCurrentTime(), //巡检时间
  155. // "circuitType": this.getuserInfo.circuitType,//巡检类型
  156. "circuitType": '', //巡检类型
  157. "remark": lsdata.substr(lsdata.indexOf('remark')+8,lsdata.indexOf('buildingId')-(lsdata.indexOf('remark')+10)), //备注
  158. }
  159. this.$api.post('/circuitrecord', postdata)
  160. .then(res => {
  161. if (res.data.code == 0) {
  162. this.$refs.uNotify.success('打卡成功')
  163. this.getDataListtwo();
  164. } else {
  165. this.$refs.uNotify.error('打卡失败')
  166. }
  167. })
  168. }
  169. },
  170. fail: (error) => {
  171. this.$refs.uNotify.error(error)
  172. }
  173. })
  174. },
  175. getDataListtwo() {
  176. this.dataForm.page = 1;
  177. this.$api.get('/circuitrecord/page', this.dataForm)
  178. .then(res => {
  179. this.totalnumber = res.data.data.total;
  180. this.indexList = res.data.data.list;
  181. })
  182. },
  183. scrolltolower() {
  184. if (this.pd) {
  185. this.getalldata();
  186. } else {
  187. return
  188. }
  189. },
  190. getDataList() {
  191. this.$api.get('/circuitrecord/page', this.dataForm)
  192. .then(res => {
  193. //console.log('111111111111111111',res.data.data)
  194. this.totalnumber = res.data.data.total;
  195. if (res.data.data.list.length != 0) {
  196. this.indexList.push(...res.data.data.list);
  197. this.dataForm.page = this.dataForm.page + 1;
  198. this.pd = true;
  199. } else {
  200. uni.showToast({
  201. title: '暂无更多数据了',
  202. icon: 'none',
  203. duration: 1500
  204. })
  205. this.pd = false;
  206. }
  207. })
  208. },
  209. }
  210. }
  211. </script>
  212. <style lang="scss">
  213. page{height:100%}
  214. .pad16{
  215. height:100%;
  216. padding: 32rpx;
  217. display: flex;
  218. flex-direction: column;
  219. }
  220. .u-listdata{height:100px;flex:1;display:flex;flex-direction: column;}
  221. .dakajilv {
  222. color: #666;
  223. font-size: 32rpx;
  224. padding-left: 30rpx;
  225. }
  226. .Currentamount {
  227. padding-left: 30rpx;
  228. height: 50rpx;
  229. line-height: 50rpx;
  230. color: #BCB3A7;
  231. span {
  232. color: #FA5555;
  233. padding-left: 9rpx;
  234. }
  235. }
  236. .topname {
  237. height: 44px;
  238. width: 750rpx;
  239. display: flex;
  240. align-items: center;
  241. }
  242. .companylist {
  243. margin: 20rpx 30rpx;
  244. background: #fff;
  245. height: 140rpx;
  246. border-radius: 10px;
  247. position: relative;
  248. h3 {
  249. height: 70rpx;
  250. line-height: 70rpx;
  251. padding-left: 30rpx;
  252. }
  253. }
  254. .settled {
  255. background-color: #09C700;
  256. width: 100rpx;
  257. height: 40rpx;
  258. text-align: center;
  259. line-height: 40rpx;
  260. color: #fff;
  261. font-size: 14rpx;
  262. position: absolute;
  263. top: 0px;
  264. right: 0px;
  265. border-top-right-radius: 10rpx;
  266. border-bottom-left-radius: 10rpx;
  267. }
  268. .outstanding {
  269. background-color: #30D3A2;
  270. width: 100rpx;
  271. height: 40rpx;
  272. text-align: center;
  273. line-height: 40rpx;
  274. color: #fff;
  275. font-size: 14rpx;
  276. position: absolute;
  277. top: 0px;
  278. right: 0px;
  279. border-top-right-radius: 10rpx;
  280. border-bottom-left-radius: 10rpx;
  281. }
  282. .billall {}
  283. .topbill {
  284. display: flex;
  285. justify-content: center;
  286. align-items: center;
  287. height: 100rpx;
  288. background-color: #e6e6e6;
  289. }
  290. .topbilledit {
  291. display: flex;
  292. justify-content: space-around;
  293. align-items: center;
  294. }
  295. .changetime1 {
  296. padding-right: 10rpx;
  297. }
  298. .shexiangji1 {
  299. color: #fff;
  300. font-size: 36rpx;
  301. font-weight: bold;
  302. }
  303. .shexiangji {
  304. width: 300rpx;
  305. height: 300rpx;
  306. border-radius: 50%;
  307. background: #5C8FFF;
  308. margin: 0 auto;
  309. display: flex;
  310. justify-content: center;
  311. flex-direction: column;
  312. align-items: center;
  313. }
  314. .dakaweizhi2 {
  315. color: #999;
  316. font-size: 26rpx;
  317. }
  318. .dakaweizhi {
  319. display: flex;
  320. align-items: center;
  321. justify-content: center;
  322. width: 690rpx;
  323. height: 270rpx;
  324. }
  325. .Punchin {
  326. width: 690rpx;
  327. margin: 32rpx auto 40rpx;
  328. background: #fff;
  329. height: 690rpx;
  330. }
  331. .getuserInfo {
  332. display: flex;
  333. background: #fff;
  334. border-radius: 4px;
  335. padding: 24rpx 32rpx;
  336. }
  337. .getuserInfoimg {
  338. margin-right: 24rpx;
  339. }
  340. .getuserInfoname {
  341. display: flex;
  342. flex-direction: column;
  343. justify-content: space-between;
  344. margin-right: 20rpx;
  345. h3 {
  346. color: #333;
  347. font-size: 32rpx;
  348. }
  349. view {
  350. color: #999;
  351. font-size: 24rpx;
  352. }
  353. }
  354. .getuserInfophone {
  355. display: flex;
  356. align-items: flex-start;
  357. }
  358. .getuserInfophone2 {
  359. color: #666;
  360. font-size: 28rpx;
  361. }
  362. </style>