videoShopTour.vue 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191
  1. <template>
  2. <view class="videoShopTour-wrap">
  3. <!-- 搜索方式 -->
  4. <u-grid :col="2" class="search-type-con" hover-class="none">
  5. <u-grid-item class="search-module" @click="goSearch">
  6. <u-icon class="search-icon" name="xundianguanli" custom-prefix="xd-icon" size="80" color="#2b85e4"></u-icon>
  7. <view class="search-txt">按门店名称查询</view>
  8. </u-grid-item>
  9. <u-grid-item class="search-module" @click="goOrgSearch">
  10. <u-icon class="search-icon" name="zuzhijigou" custom-prefix="xd-icon" size="80" color="#19be6b"></u-icon>
  11. <view class="search-txt">按组织机构查询</view>
  12. </u-grid-item>
  13. </u-grid>
  14. <!-- 门店列表 -->
  15. <view class="list-con">
  16. <view class="list-tit">门店列表</view>
  17. <!-- 列表数据 -->
  18. <scroll-view class="listData-con" scroll-y>
  19. <view class="listData-item" v-for="(item, index) in list" :key="item.id" @click="goPage(item)">
  20. <view class="listData-item-l">
  21. <u-icon class="listData-item-l-icon" name="mendian" custom-prefix="xd-icon" size="40" color="#888"></u-icon>
  22. <text class="listData-item-l-name">{{item.name}}</text>
  23. </view>
  24. <view class="listData-item-r">
  25. <u-icon class="listData-item-r-icon" name="icon-xian-11" custom-prefix="xd-icon" size="24" color="#2b85e4"></u-icon>
  26. </view>
  27. </view>
  28. <u-empty :text="noDataText" img-width="120" v-if="list.length == 0 && status != 'loading'" style="height: auto;padding-top: 10vh;" mode="list"></u-empty>
  29. </scroll-view>
  30. </view>
  31. </view>
  32. </template>
  33. <script>
  34. import { clzConfirm } from '@/libs/tools.js'
  35. import { findStoreList,findStoreVsDevice } from '@/api/store.js'
  36. import { queryCurrentTaskUsing } from '@/api/task.js'
  37. export default{
  38. data(){
  39. return{
  40. noDataText: '暂无数据', // 数据异常提示
  41. status: 'loadmore', // 加载中状态
  42. list: [], // 数据列表
  43. }
  44. },
  45. onLoad() {
  46. this.init()
  47. },
  48. methods: {
  49. // 初始
  50. init(){
  51. this.status = 'loading'
  52. // 获取门店列表
  53. findStoreList({}).then(res => {
  54. if(res.status == 200){
  55. this.list = res.data || []
  56. this.noDataText = '暂无数据' // 有列表数据时不显示,因此只用默认设置为无数据时所需显示的'暂无数据'即可
  57. }else{
  58. this.list = []
  59. this.noDataText = res.message
  60. }
  61. this.status = 'loadmore'
  62. })
  63. },
  64. // 按门店名称查询
  65. goSearch(){
  66. uni.navigateTo({
  67. url: '/pages/searchPage/searchPage'
  68. })
  69. },
  70. // 按组织机构查询
  71. goOrgSearch(){
  72. uni.navigateTo({
  73. url: '/pages/organization/organization'
  74. })
  75. },
  76. // 开始巡店
  77. goPage(item){
  78. // 判断当前门店是否已绑定设备
  79. findStoreVsDevice({storeCode:item.code}).then(res=>{
  80. console.log(res)
  81. if(res.data.length){
  82. // 门店下的设备
  83. this.$u.vuex('vuex_storeVideoList',res.data)
  84. // 校验是否有历史巡店记录
  85. this.queryHasTaskUsing(item)
  86. }else{
  87. uni.showToast({
  88. icon: 'none',
  89. title: '当前门店没有绑定设备,暂时不能视频巡店'
  90. })
  91. }
  92. })
  93. },
  94. // 判断当前门店是否已绑定设备
  95. // type VIDEO_INSPECTION:视频巡店、SPOT_INSPECTION:现场巡店、POINT_INSPECTION:点检任务
  96. queryHasTaskUsing(item){
  97. console.log({ storeId: item.id, type: 'VIDEO_INSPECTION' })
  98. queryCurrentTaskUsing({ storeId: item.id, type: 'VIDEO_INSPECTION' }).then(res => {
  99. console.log(res)
  100. if(res.status == 200){
  101. if(res.data){ // 为true有历史巡店记录
  102. clzConfirm({
  103. title: '提示',
  104. content: '有进行中的巡店任务,是否继续?',
  105. confirmText: '继续巡店',
  106. cancelText: '重新开始',
  107. buttons: ['继续巡店','重新开始'],
  108. success: function (result) {
  109. if (result.confirm || result.index==0) { // 继续巡店
  110. uni.navigateTo({
  111. url: '/pages/shopTour/shopTour?storeId=' + item.id + '&taskId='+ res.data + '&restart=0&types=video'
  112. })
  113. }else if(result.cancel || result.index==1){ // 重新开始
  114. uni.navigateTo({
  115. url: '/pages/shopTour/shopTour?storeId=' + item.id + '&taskId='+ res.data + '&restart=1&types=video'
  116. })
  117. }
  118. }
  119. })
  120. }else{
  121. uni.navigateTo({
  122. url: '/pages/shopTour/shopTour?storeId=' + item.id + '&types=video'
  123. })
  124. }
  125. }else{
  126. uni.showToast({icon: 'none', title: res.message})
  127. }
  128. })
  129. }
  130. }
  131. }
  132. </script>
  133. <style lang="scss">
  134. page {
  135. background-color: #f8f8f8;
  136. height: calc(100vh - 44px);
  137. }
  138. .videoShopTour-wrap{
  139. height: 100%;
  140. // 搜索方式
  141. .search-type-con{
  142. .search-module{
  143. .search-txt{
  144. font-size: 26upx;
  145. padding-top: 6upx;
  146. }
  147. }
  148. }
  149. // 门店列表
  150. .list-con{
  151. .list-tit{
  152. padding: 20upx 30upx;
  153. border-bottom: 1upx solid #f8f8f8;
  154. }
  155. .listData-con{
  156. padding: 0 30upx;
  157. height: calc(100vh - 190px);
  158. box-sizing: border-box;
  159. .listData-item{
  160. display: flex;
  161. justify-content: space-between;
  162. align-items: center;
  163. padding: 25upx 15upx;
  164. border-bottom: 1px solid #F8F8F8;
  165. background-color: #fff;
  166. &:active{
  167. opacity: 0.5;
  168. }
  169. &-l{
  170. flex-grow: 1;
  171. padding-right: 10upx;
  172. position: relative;
  173. padding-left: 50upx;
  174. &-icon{
  175. vertical-align: sub;
  176. padding-right: 8upx;
  177. position: absolute;
  178. left: 0;
  179. top: -4upx;
  180. }
  181. }
  182. &-r{
  183. flex-shrink: 0;
  184. }
  185. }
  186. }
  187. }
  188. }
  189. </style>