entryReport.vue 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645
  1. <template>
  2. <view class="content">
  3. <view class="zdyNav">
  4. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  5. <view class="nav">
  6. <view>
  7. <image src="../../static/img/baiheiback.png" mode="" class="baiheiback" @click="back"></image>
  8. </view>
  9. <view>门店列表</view>
  10. <view style="width:70px;"></view>
  11. </view>
  12. </view>
  13. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  14. <view style="height: 44px;"></view>
  15. <view class="topView">
  16. <view class="status_bar" :style="{height: iStatusBarHeight + 'px'}"></view>
  17. <view style="height: 44px;"></view>
  18. <!-- 搜索 -->
  19. <!-- <view class="searchBox">
  20. <image src="../../static/img/icon_search.png" class="searchImg"></image>
  21. <input type="text" class="searchInput" placeholder="请输入门店名称、联系人、手机号" v-model="searchValue"
  22. @confirm="searchDone" />
  23. </view> -->
  24. <searchBox placeholder="请输入门店名称、联系人、手机号" @search='search($event)'></searchBox>
  25. <!-- 筛选条件 -->
  26. <view class="siftBg">
  27. <picker value="firstIndex" :range="firstArr" @change="bindPickerChange">
  28. <view class="uni-input">距上次提交 {{firstIndex == null ? '不限' : firstArr[firstIndex]}}
  29. <image class="downArrow" src="../../static/img/icon_downArrow.png" mode=""></image>
  30. </view>
  31. </picker>
  32. <!-- 筛选条件 需检测项 -->
  33. <view class="checkBg" @click="changeHave">
  34. <image class='checkImg' src="../../static/img/icon_select_def@2x.png" mode="" v-if="!isHave">
  35. </image>
  36. <image class='checkImg' src="../../static/img/icon_select_per@2x.png" mode="" v-else>
  37. </image>
  38. 需检测项大于0
  39. </view>
  40. </view>
  41. </view>
  42. <!-- 门店列表 -->
  43. <view class="shopContent">
  44. <view v-for="(item,index) in shopData" :key="index">
  45. <!-- 需要检查项 大于0 -->
  46. <view class="shopBox" v-if="isHave && item.checkCount > 0">
  47. <view class="shopTop">
  48. <view class="shopName">{{item.ShopName}}</view>
  49. <!-- 地址 和电话 图标 -->
  50. <image class="tubiao" src="../../static/img/icon_daohang_def@2x.png" @click="goAddress(item)">
  51. </image>
  52. <image class="tubiao" src="../../static/img/icon_phone_def@2x.png"
  53. @click="call(item.ContactorPhone)">
  54. </image>
  55. </view>
  56. <!-- 门店类型-开业时间-联系人 -->
  57. <view class="shopType"><text style='color: #B98B5D;'>{{item.levelName}}</text> ·
  58. <text v-if="item.OpeningTime != null">{{item.OpeningTime}}</text> 联系人:{{item.Contactor}}
  59. </view>
  60. <!-- 详细地址 -->
  61. <view class="addressView">
  62. <view class="address">{{item.Address}}</view>
  63. <view class="distance" v-if="item.distance != 0.00">{{item.distance}}km</view>
  64. </view>
  65. <!-- 提交信息 -->
  66. <view class="tijao">
  67. <view class="time" v-if="item.maxTime">距上次提交:<text
  68. style='color: #FF4F00;'>{{item.maxTime}}</text>天</view>
  69. <view class="time" v-else-if="item.maxTime === 0">距上次提交:当天</view>
  70. <view class="time" v-else-if="!item.maxTime">暂无提交记录</view>
  71. <view class="xiangmu"><text style='color: #FF4F00;'>{{item.checkCount}}</text>项需要检测</view>
  72. </view>
  73. <!-- btns -->
  74. <view class="btns">
  75. <view class="lishi" @click="goHistory(item)">历史记录</view>
  76. <view class="qiandao" @click="sinnIn(item)">签到</view>
  77. <view class="baogao" @click="goEntered(item)" v-if="item.levelName">录入报告</view>
  78. <view class="baogao" @click="showLeveError" v-else-if="!item.levelName">录入报告</view>
  79. <view class="baogao" @click="showCheckError" v-else-if="!item.PackageName || itme.State == 0">
  80. 录入报告</view>
  81. </view>
  82. </view>
  83. <!-- 展示全部数据 -->
  84. <view class="shopBox" v-if="!isHave">
  85. <view class="shopTop">
  86. <view class="shopName">{{item.ShopName}}</view>
  87. <!-- 地址 和电话 图标 -->
  88. <image class="tubiao" src="../../static/img/icon_daohang_def@2x.png" @click="goAddress(item)">
  89. </image>
  90. <image class="tubiao" src="../../static/img/icon_phone_def@2x.png"
  91. @click="call(item.ContactorPhone)">
  92. </image>
  93. </view>
  94. <!-- 门店类型-开业时间-联系人 -->
  95. <view class="shopType"><text style='color: #B98B5D;'>{{item.levelName}}</text> ·
  96. <text v-if="item.OpeningTime != null">{{item.OpeningTime}}</text> 联系人:{{item.Contactor}}
  97. </view>
  98. <!-- 详细地址 -->
  99. <view class="addressView">
  100. <view class="address">{{item.Address}}</view>
  101. <view class="distance" v-if="item.distance != 0.00">{{item.distance}}km</view>
  102. </view>
  103. <!-- 提交信息 -->
  104. <view class="tijao">
  105. <view class="time" v-if="item.maxTime">距上次提交:<text
  106. style='color: #FF4F00;'>{{item.maxTime}}</text>天</view>
  107. <view class="time" v-else-if="item.maxTime === 0">距上次提交:当天</view>
  108. <view class="time" v-else-if="!item.maxTime">暂无提交记录</view>
  109. <view class="xiangmu"><text style='color: #FF4F00;'>{{item.checkCount}}</text>项需要检测</view>
  110. </view>
  111. <!-- btns -->
  112. <view class="btns">
  113. <view class="lishi" @click="goHistory(item)">历史记录</view>
  114. <view class="qiandao" @click="sinnIn(item)">签到</view>
  115. <view class="baogao" @click="goEntered(item)" v-if="item.levelName">录入报告</view>
  116. <view class="baogao" @click="showLeveError" v-else-if="!item.levelName">录入报告</view>
  117. <view class="baogao" @click="showCheckError" v-else-if="!item.PackageName || itme.State == 0">
  118. 录入报告</view>
  119. </view>
  120. </view>
  121. </view>
  122. </view>
  123. <!-- 上拉 加载更多 -->
  124. <!-- <view class="noMore" v-if="noMoreShow">没有更多数据</view> -->
  125. <!-- 无数据空白页 -->
  126. <view class="nodataBox" v-if="shopData.length == 0">
  127. <image src="../../static/img/pic_empty_def.png" mode="widthFix" class="nodataImg"></image>
  128. <view class="noTxt">暂无数据</view>
  129. </view>
  130. </view>
  131. </template>
  132. <script>
  133. import searchBox from '@/components/searchBox/searchBox.vue'
  134. export default {
  135. components: {
  136. searchBox
  137. },
  138. data() {
  139. return {
  140. searchValue: '',
  141. lng: '',
  142. lat: '',
  143. firstIndex: null,
  144. firstArr: ['不限', '1-15天', '15-30天', '30天以上'],
  145. isHave: false,
  146. shopData: [],
  147. page: 1,
  148. noMoreShow: false,
  149. iStatusBarHeight: '',
  150. }
  151. },
  152. onLoad() {
  153. //页面加载初始化生命周期函数
  154. this.iStatusBarHeight = uni.getSystemInfoSync().statusBarHeight;
  155. },
  156. onShow() {
  157. this.firstIndex = null
  158. this.isHave = false
  159. var that = this
  160. uni.getLocation({
  161. success(res) {
  162. that.lng = res.longitude
  163. that.lat = res.latitude
  164. that.page = 1
  165. that.getShopData()
  166. },
  167. fail() {
  168. }
  169. })
  170. //#ifdef H5
  171. that.lng = '117.06533'
  172. that.lat = '36.68013'
  173. that.getShopData()
  174. // #endif
  175. },
  176. methods: {
  177. showLeveError() {
  178. uni.showToast({
  179. title: '该门店未设置门店类型',
  180. icon: 'none',
  181. duration: 2000,
  182. });
  183. },
  184. showCheckError() {
  185. uni.showToast({
  186. title: '未查询到检测套餐信息',
  187. icon: 'none',
  188. duration: 2000,
  189. });
  190. },
  191. back() {
  192. uni.reLaunch({
  193. url: '../index/index'
  194. })
  195. },
  196. goHistory(item) {
  197. uni.navigateTo({
  198. url: 'historyReport?shopId=' + item.shopId
  199. })
  200. },
  201. sinnIn(item) {
  202. uni.navigateTo({
  203. url: 'signIn?shopId=' + item.shopId
  204. })
  205. },
  206. goEntered(item) {
  207. console.log(item)
  208. if(item.State){
  209. this.$http('accompany/SuperAccounts/queryManagerTodaySign', {
  210. shopId:item.shopId,
  211. }, 'GET').then(res => {
  212. if(res.data.today){
  213. if(item.maxTime<30){
  214. var that=this;
  215. console.log(item.maxTime)
  216. if(item.maxTime == null||item.maxTime===''){
  217. that.$store.commit('mutationsCategoryList', '');
  218. that.$store.commit('mutationssuggestList', '')
  219. uni.navigateTo({
  220. url: 'entered?shopId=' + item.shopId + '&ShopName=' + item.ShopName + '&Contactor=' + item.Contactor
  221. })
  222. }else{
  223. uni.showModal({
  224. title: '提示',
  225. content: '距上次提交报告:'+item.maxTime+'天,是否继续录入?',
  226. success: function (res) {
  227. if (res.confirm) {
  228. that.$store.commit('mutationsCategoryList', '');
  229. that.$store.commit('mutationssuggestList', '')
  230. uni.navigateTo({
  231. url: 'entered?shopId=' + item.shopId + '&ShopName=' + item.ShopName + '&Contactor=' + item.Contactor
  232. })
  233. } else if (res.cancel) {
  234. console.log('用户点击取消');
  235. }
  236. }
  237. });
  238. }
  239. }else{
  240. this.$store.commit('mutationsCategoryList', '');
  241. this.$store.commit('mutationssuggestList', '')
  242. uni.navigateTo({
  243. url: 'entered?shopId=' + item.shopId + '&ShopName=' + item.ShopName + '&Contactor=' + item.Contactor
  244. })
  245. }
  246. }else{
  247. setTimeout(function() {
  248. uni.showToast({
  249. title: '请先进行签到',
  250. icon: 'none',
  251. duration: 3000,
  252. });
  253. }, 300);
  254. }
  255. })
  256. return false;
  257. } else {
  258. uni.showToast({
  259. title: '未查询到检测套餐信息',
  260. icon: 'none',
  261. duration: 3000,
  262. });
  263. }
  264. },
  265. search(val) {
  266. // console.log(val);
  267. this.searchValue = val
  268. this.page = 1
  269. this.getShopData()
  270. },
  271. bindPickerChange(e) {
  272. this.firstIndex = Number(e.target.value)
  273. this.page = 1
  274. this.getShopData()
  275. },
  276. changeHave() {
  277. this.isHave = !this.isHave
  278. },
  279. goAddress(v) {
  280. console.log(v)
  281. if (!v.lat) {
  282. uni.showToast({
  283. title: '该门店未设置定位',
  284. icon: 'none',
  285. duration: 3000,
  286. });
  287. return
  288. }
  289. uni.openLocation({
  290. latitude: Number(v.lat),
  291. longitude: Number(v.lng),
  292. name: v.ShopName,
  293. address: v.Address,
  294. });
  295. },
  296. call(e) {
  297. if (e.length != 0) {
  298. uni.makePhoneCall({
  299. phoneNumber: e
  300. })
  301. }
  302. },
  303. getShopData() {
  304. uni.showLoading({
  305. title: '加载中'
  306. })
  307. var maxTime = ''
  308. if (this.firstIndex == 0) {
  309. maxTime = ''
  310. } else {
  311. maxTime = Number(this.firstIndex)
  312. }
  313. let url = 'accompany/SuperAccounts/queryShopListByMyTeam',
  314. params = {
  315. // page: this.page,
  316. // limit: 20,
  317. shopName: this.searchValue,
  318. lng: this.lng,
  319. lat: this.lat,
  320. maxTime: maxTime,
  321. }
  322. this.$http(url, params, 'GET').then(res => {
  323. var list = res.data
  324. // 处理 undefined和null转为空白字符串
  325. list.forEach((item, index) => {
  326. for (const key in item) {
  327. item[key] = this.$praseStrEmpty(item[key])
  328. }
  329. })
  330. this.shopData = list
  331. console.log(this.shopData);
  332. // if (this.page == 1) {
  333. // this.shopData = list
  334. // } else {
  335. // this.shopData = this.shopData.concat(list)
  336. // }
  337. // if(list.length < 10){
  338. // this.noMoreShow = false
  339. // }
  340. // else {
  341. // this.noMoreShow = true
  342. // }
  343. })
  344. },
  345. },
  346. // 下拉刷新 上拉加载更多
  347. onPullDownRefresh() {
  348. this.getShopData()
  349. setTimeout(function() {
  350. uni.stopPullDownRefresh();
  351. }, 1000);
  352. },
  353. // onReachBottom() {
  354. // this.page++;
  355. // this.getShopData()
  356. // },
  357. }
  358. </script>
  359. <style scoped>
  360. .content {
  361. background-color: #F4F5F7;
  362. min-height: 100vh;
  363. }
  364. .zdyNav {
  365. position: fixed;
  366. left: 0;
  367. top: 0;
  368. background: #FFFFFF;
  369. z-index: 99;
  370. }
  371. .nav {
  372. width: 100vw;
  373. height: 44px;
  374. background: #FFFFFF;
  375. display: flex;
  376. justify-content: space-between;
  377. font-size: 34rpx;
  378. line-height: 44px;
  379. }
  380. .status_bar {
  381. background: #FFFFFF;
  382. }
  383. .baiheiback {
  384. width: 70px;
  385. height: 44px;
  386. }
  387. .topView {
  388. width: 100%;
  389. background-color: #FFFFFF;
  390. left: 0rpx;
  391. top: 0rpx;
  392. position: fixed;
  393. z-index: 98;
  394. }
  395. /* #ifdef H5 */
  396. .topView {
  397. /* top: 44px; */
  398. }
  399. /* #endif */
  400. .searchBox {
  401. height: 72rpx;
  402. margin: 24rpx;
  403. background-color: #F4F5F7;
  404. border-radius: 36rpx;
  405. display: flex;
  406. }
  407. .searchImg {
  408. margin-top: 20rpx;
  409. margin-left: 20rpx;
  410. width: 32rpx;
  411. height: 32rpx;
  412. }
  413. .searchInput {
  414. height: 72rpx;
  415. font-size: 28rpx;
  416. padding-left: 16rpx;
  417. width: 85%;
  418. }
  419. .siftBg {
  420. display: flex;
  421. justify-content: space-between;
  422. height: 80rpx;
  423. padding: 0rpx 24rpx;
  424. align-items: center;
  425. }
  426. .siftBg,
  427. .checkBg {
  428. font-size: 28rpx;
  429. color: #3C3C3C;
  430. }
  431. .downArrow {
  432. width: 16rpx;
  433. height: 12rpx;
  434. padding: 6rpx 8rpx;
  435. }
  436. .checkBg {
  437. display: flex;
  438. flex-direction: row;
  439. align-items: center;
  440. height: 72rpx;
  441. padding: 0rpx 24rpx;
  442. }
  443. .checkImg {
  444. width: 32rpx;
  445. height: 32rpx;
  446. margin-right: 8rpx;
  447. }
  448. .shopContent {
  449. background-color: #F4F5F7;
  450. padding: 0rpx 24rpx;
  451. padding-top: 200rpx;
  452. }
  453. .shopBox {
  454. background-color: #FFFFFF;
  455. border-radius: 10rpx;
  456. margin: 20rpx 0rpx;
  457. }
  458. .shopTop {
  459. display: flex;
  460. justify-content: space-between;
  461. padding-top: 30rpx;
  462. padding-left: 20rpx;
  463. padding-right: 20rpx;
  464. }
  465. .shopName {
  466. font-size: 30rpx;
  467. font-weight: bold;
  468. color: #3C3C3C;
  469. margin-right: 20rpx;
  470. width: 500rpx;
  471. }
  472. .tubiao {
  473. width: 48rpx;
  474. height: 48rpx;
  475. padding-left: 40rpx;
  476. }
  477. .shopType {
  478. padding: 10rpx 20rpx;
  479. font-size: 26rpx;
  480. color: #3C3C3C;
  481. }
  482. .addressView {
  483. padding: 10rpx 20rpx;
  484. display: flex;
  485. font-size: 26rpx;
  486. color: #999999;
  487. display: flex;
  488. justify-content: space-between;
  489. }
  490. .address {
  491. margin-right: 20rpx;
  492. }
  493. .tijao {
  494. padding: 10rpx 20rpx 30rpx 20rpx;
  495. display: flex;
  496. justify-content: space-between;
  497. font-size: 26rpx;
  498. color: #999999;
  499. border-bottom: 1rpx solid #EEEEEE;
  500. }
  501. .btns {
  502. display: flex;
  503. justify-content: flex-end;
  504. }
  505. .lishi,
  506. .qiandao,
  507. .baogao {
  508. margin: 20rpx;
  509. color: #3C3C3C;
  510. font-size: 28rpx;
  511. width: 150rpx;
  512. height: 56rpx;
  513. border-radius: 28rpx;
  514. border: 2rpx solid #DDDDDD;
  515. text-align: center;
  516. line-height: 56rpx;
  517. }
  518. .baogao {
  519. border: 2rpx solid #FF4F00;
  520. color: #FF4F00;
  521. }
  522. /* 空白页css */
  523. .nodataBox {
  524. text-align: center;
  525. }
  526. .nodataImg {
  527. width: 400rpx;
  528. padding-top: 300rpx;
  529. }
  530. .noTxt {
  531. font-size: 30rpx;
  532. color: #999999;
  533. padding-top: 50rpx;
  534. }
  535. .noMore {
  536. text-align: center;
  537. line-height: 50rpx;
  538. color: #999999;
  539. font-size: 28rpx;
  540. }
  541. </style>