index.vue 6.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280
  1. <template>
  2. <view class="content">
  3. <view class="user-info-box">
  4. <image class="user-image" :src="userData.headImage"></image>
  5. <view class="user-info">
  6. <view class="user-logoin-title">{{userData.userName}}</view>
  7. <view class="user-type">
  8. <view class="iconfont iconshangjia-shanghu"></view>
  9. <view>商家用户</view>
  10. </view>
  11. </view>
  12. </view>
  13. <view class="order-box">
  14. <view class="order-item" @click="orderClick(2)">
  15. <view class="iconfont icondaifahuo order-item-icon"></view>
  16. <view class="order-item-text">待发货</view>
  17. </view>
  18. <view class="order-item" @click="orderClick(3)">
  19. <view class="iconfont icondaishouhuo order-item-icon"></view>
  20. <view class="order-item-text">已发货</view>
  21. </view>
  22. <view class="order-item" @click="orderClick(4)">
  23. <view class="iconfont iconyishouhuo order-item-icon"></view>
  24. <view class="order-item-text">已收货</view>
  25. </view>
  26. <view class="order-item" @click="orderClick(5)">
  27. <view class="iconfont icondaipingjia order-item-icon"></view>
  28. <view class="order-item-text">已评价</view>
  29. </view>
  30. </view>
  31. <view class="cell-group">
  32. <view class="item-btn" @click="pickClick()">
  33. <view class="iconfont iconcaizhai item-btn-icon"></view>
  34. <view class="item-btn-text">自助采摘</view>
  35. <view class="iconfont iconfangxiang"></view>
  36. </view>
  37. <view class="item-btn" @click="authorizeClick()" v-if="userData.isMaster">
  38. <view class="iconfont iconquanxian item-btn-icon"></view>
  39. <view class="item-btn-text">授权</view>
  40. <view class="iconfont iconfangxiang"></view>
  41. </view>
  42. <view class="item-btn" @click="couponClick()">
  43. <view class="iconfont iconyouhuiquan item-btn-icon"></view>
  44. <view class="item-btn-text">优惠券管理</view>
  45. <view class="iconfont iconfangxiang"></view>
  46. </view>
  47. </view>
  48. <view class="cell-group">
  49. <view class="item-btn" @click="infoClick()">
  50. <view class="iconfont icondianpu item-btn-icon"></view>
  51. <view class="item-btn-text">商户信息</view>
  52. <view class="iconfont iconfangxiang"></view>
  53. </view>
  54. <view class="item-btn" @click="aboutUsClick()">
  55. <view class="iconfont iconguanyu item-btn-icon"></view>
  56. <view class="item-btn-text">关于我们</view>
  57. <view class="iconfont iconfangxiang"></view>
  58. </view>
  59. <view class="item-btn" @click="modalShow=true">
  60. <view class="iconfont iconguanyu item-btn-icon"></view>
  61. <view class="item-btn-text">后台管理信息</view>
  62. <view class="iconfont iconfangxiang"></view>
  63. </view>
  64. </view>
  65. <u-top-tips ref="uTips"></u-top-tips>
  66. <u-modal v-model="modalShow" title="后台管理信息" :content="'账号:'+manageInfo.account+',密码'+ manageInfo.password"></u-modal>
  67. </view>
  68. </template>
  69. <script>
  70. const NET = require('@/utils/request')
  71. const API = require('@/config/api')
  72. export default {
  73. data() {
  74. return {
  75. integral: '',
  76. userData: {
  77. userId: '',
  78. userName: '',
  79. headImage: '',
  80. isMaster: 0,
  81. },
  82. manageInfo: {},
  83. modalShow: false
  84. }
  85. },
  86. onLoad() {
  87. this.userData = uni.getStorageSync("userData")
  88. console.log('是否授权', this.userData.isMaster)
  89. },
  90. onShow() {
  91. NET.request(API.getManageInfo, {}, 'POST').then(res => {
  92. this.manageInfo = res.data
  93. }).catch(error => {
  94. this.$refs.uTips.show({
  95. title: error.data.msg,
  96. type: 'warning',
  97. })
  98. })
  99. },
  100. methods: {
  101. // 我的订单
  102. orderClick(type) {
  103. uni.navigateTo({
  104. url: '/pagesMain/orderList?type=' + type
  105. });
  106. },
  107. // 自助采摘
  108. pickClick() {
  109. uni.navigateTo({
  110. // url: '/pagesMedia/pickVideo',
  111. url: '/pagesMain/pickOrderList?type=' + 6
  112. });
  113. },
  114. // 授权
  115. authorizeClick() {
  116. uni.navigateTo({
  117. url: '/pagesMain/authorizeList'
  118. });
  119. },
  120. // 优惠券管理
  121. couponClick() {
  122. uni.navigateTo({
  123. url: '/pagesMain/couponList'
  124. });
  125. },
  126. // 商户信息
  127. infoClick() {
  128. uni.navigateTo({
  129. url: '/pagesMain/registerForm'
  130. });
  131. },
  132. // 关于我们
  133. aboutUsClick() {
  134. uni.navigateTo({
  135. url: '/pagesMain/aboutUs'
  136. });
  137. },
  138. // 获取后台管理账号密码
  139. manageInfoClick(){
  140. this.modalShow = true
  141. }
  142. }
  143. }
  144. </script>
  145. <style lang='scss'>
  146. page {
  147. width: 100%;
  148. height: 100%;
  149. }
  150. .content {
  151. width: 100%;
  152. height: 100%;
  153. float: left;
  154. background-color: #F3F3F3;
  155. .user-info-box {
  156. width: 100%;
  157. height: 120px;
  158. float: left;
  159. box-sizing: border-box;
  160. padding: 15px;
  161. position: relative;
  162. background-size: 100% 195px;
  163. background-position: center top;
  164. background-repeat: no-repeat;
  165. background-image: url(@/static/images/userBg.png);
  166. .user-image {
  167. width: 65px;
  168. height: 65px;
  169. object-fit: cover;
  170. border-radius: 50%;
  171. float: left;
  172. }
  173. .user-info {
  174. width: calc(100% - 85px);
  175. float: left;
  176. display: flex;
  177. flex-direction: column;
  178. padding: 10px 15px;
  179. box-sizing: border-box;
  180. z-index: 10;
  181. .user-logoin-title {
  182. font-size: 36upx;
  183. font-weight: 500;
  184. color: rgba(255, 255, 255, 1);
  185. }
  186. .user-type {
  187. width: 70px;
  188. height: 20px;
  189. background: #FFFFFF;
  190. color: #55AF3D;
  191. display: flex;
  192. align-items: center;
  193. justify-content: center;
  194. font-size: 12px;
  195. }
  196. }
  197. }
  198. .order-box {
  199. width: 690upx;
  200. height: 170upx;
  201. float: left;
  202. background: rgba(255, 255, 255, 1);
  203. box-shadow: 0px 0px 10upx 0px rgba(51, 51, 51, 0.1);
  204. border-radius: 10upx;
  205. display: flex;
  206. flex-direction: row;
  207. align-items: center;
  208. z-index: 10;
  209. position: relative;
  210. left: 50%;
  211. transform: translateX(-50%);
  212. margin-top: -20px;
  213. margin-bottom: 10px;
  214. .order-line {
  215. width: 12upx;
  216. height: 106upx;
  217. }
  218. .order-item {
  219. flex: 1;
  220. display: flex;
  221. flex-direction: column;
  222. align-items: center;
  223. justify-content: center;
  224. .order-item-icon {
  225. color: #52A63A;
  226. font-size: 30px;
  227. }
  228. .order-item-text {
  229. font-size: 28upx;
  230. margin-top: 10upx;
  231. font-weight: 500;
  232. }
  233. }
  234. }
  235. .cell-group {
  236. width: 100%;
  237. float: left;
  238. margin-bottom: 10px;
  239. .item-btn {
  240. width: 100%;
  241. height: 50px;
  242. display: flex;
  243. flex-direction: row;
  244. align-items: center;
  245. box-sizing: border-box;
  246. background-color: #fff;
  247. padding: 0 15px;
  248. .item-btn-icon {
  249. color: #52A63A;
  250. font-size: 20px;
  251. }
  252. .item-btn-text {
  253. font-size: 28upx;
  254. margin-left: 20upx;
  255. font-weight: 500;
  256. flex: 1;
  257. color: rgba(102, 102, 102, 1);
  258. }
  259. }
  260. }
  261. }
  262. </style>