You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

483 lines
9.4 KiB

10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
  1. <template>
  2. <view class="content">
  3. <view class="banner">
  4. <view class="head-div flex">
  5. <view style="width: 118rpx;height: 118rpx;">
  6. <image style="width: 118rpx;height: 118rpx;border-radius: 50%;" :src="userInfo.headImage"></image>
  7. </view>
  8. <view style="padding: 10rpx 34rpx;">
  9. <view class="nickname">{{ userInfo.nickName }}</view>
  10. <view class="days">
  11. 手机号
  12. <view class="phone">{{ userInfo.phone }}</view>
  13. </view>
  14. </view>
  15. </view>
  16. <view style="position: absolute; top: 96rpx;right: 32rpx;" @click="toSetting">
  17. <image src="/static/icons/icon8.png" mode="aspectFit" style="width: 32rpx; height: 32rpx"></image>
  18. </view>
  19. </view>
  20. <view class="one-card">
  21. <view class="cart">
  22. <view class="collect" @click="clickCollect">
  23. <view class="tx">
  24. 我的收藏
  25. </view>
  26. <view class="info">
  27. {{ collectNum }}
  28. </view>
  29. </view>
  30. <view class="coupon" @click="clickCoupon">
  31. <view class="tx">
  32. 我的优惠劵
  33. </view>
  34. <view class="info">
  35. {{ couponNum }}
  36. </view>
  37. </view>
  38. </view>
  39. </view>
  40. <view class="two-card">
  41. <view class="flex" style="margin: 40rpx 0rpx;">
  42. <view style="width: 10rpx;height: 30rpx;background: #EF8C94;border-radius: 6rpx;" />
  43. <view class="head-title">常用功能</view>
  44. </view>
  45. <view class="flex flex-sb icons">
  46. <view class="icon-item" @click="toOrderManagement">
  47. <image class="icon" src="/static/icons/m1.png" />
  48. <view class="title">订单管理</view>
  49. </view>
  50. <view class="icon-item" @click="toMessage">
  51. <image class="icon" src="/static/icons/m2.png" />
  52. <view class="title">消息通知</view>
  53. </view>
  54. <view class="icon-item" @click="clickAddress">
  55. <image class="icon" src="/static/icons/m3.png" />
  56. <view class="title">地址管理</view>
  57. </view>
  58. </view>
  59. <view class="flex flex-sb icons">
  60. <view class="icon-item" @click="toComplain">
  61. <image class="icon" src="/static/icons/m4.png" />
  62. <view class="title">投诉建议</view>
  63. </view>
  64. <view class="icon-item" @click="clickService">
  65. <image class="icon" src="/static/icons/m5.png" />
  66. <view class="title">客服中心</view>
  67. </view>
  68. <view class="icon-item" @click="toEvaluate">
  69. <image class="icon" src="/static/icons/m6.png" />
  70. <view class="title">我的评价</view>
  71. </view>
  72. </view>
  73. <view class="flex flex-sb icons">
  74. <view class="icon-item" @click="clickSettled">
  75. <image class="icon" src="/static/icons/m7.png" />
  76. <view class="title">商家入驻</view>
  77. </view>
  78. </view>
  79. </view>
  80. <view style="text-align: center;color: #aaa;padding: 20px;line-height: 22px;">
  81. {{ copyright }}
  82. <br />
  83. {{ gs_name }}
  84. <br />
  85. {{ beian }}
  86. </view>
  87. </view>
  88. </template>
  89. <script>
  90. export default {
  91. data() {
  92. return {
  93. userInfo: {},
  94. couponNum: 0,
  95. collectNum: 0,
  96. copyright : '',
  97. gs_name : '',
  98. beian : ''
  99. }
  100. },
  101. onShow() {
  102. this.getUserInfo()
  103. this.getCouponNum()
  104. this.getCollectNum()
  105. this.getConfig()
  106. },
  107. methods: {
  108. //获取用户信息
  109. getUserInfo() {
  110. this.$api('getUserInfo', {}, res => {
  111. if (res.code == 200) {
  112. this.userInfo = res.result;
  113. if(!res.result.phone){ //用户未绑定手机
  114. this.toPhoneDetail()
  115. }
  116. }
  117. if (res.code == 500 && res.message === '操作失败,用户不存在!') {
  118. localStorage.removeItem('token')
  119. localStorage.removeItem('userInfo')
  120. uni.navigateTo({
  121. url: '/pages/login/login'
  122. })
  123. }
  124. })
  125. },
  126. //跳转设置页面
  127. toSetting() {
  128. uni.navigateTo({
  129. url: '/pages/mine/setting'
  130. })
  131. },
  132. //跳转收藏页面
  133. clickCollect() {
  134. uni.navigateTo({
  135. url: '/pages/mine/collect'
  136. })
  137. },
  138. //跳转优惠券页面
  139. clickCoupon() {
  140. uni.navigateTo({
  141. url: '/pages/mine/coupon'
  142. })
  143. },
  144. //跳转地址管理页面
  145. clickAddress() {
  146. uni.navigateTo({
  147. url: '/pages/mine/address'
  148. })
  149. },
  150. //跳转技师招募页面
  151. clickSettled() {
  152. uni.navigateTo({
  153. url: '/pages/mine/settled'
  154. })
  155. },
  156. //跳转我的钱包页面
  157. clickWallet() {
  158. uni.navigateTo({
  159. url: '/pages/mine/wallet'
  160. })
  161. },
  162. //跳转分销代理页面
  163. clickDistribute() {
  164. uni.navigateTo({
  165. url: '/pages/mine/distribution'
  166. })
  167. },
  168. //联系客服
  169. clickService() {
  170. uni.makePhoneCall({
  171. phoneNumber: this.phone,
  172. success: () => {},
  173. fail: () => {}
  174. });
  175. },
  176. //获取优惠券数量
  177. getCouponNum() {
  178. this.$api('getCouponList', {}, res => {
  179. if (res.code == 200) {
  180. this.couponNum = res.result.total;
  181. }
  182. })
  183. },
  184. //获取收藏技师数量
  185. getCollectNum() {
  186. this.$api('getCollectList', this.queryParams, res => {
  187. if (res.code == 200) {
  188. this.collectNum = res.result.total;
  189. }
  190. })
  191. },
  192. //获取配置信息
  193. getConfig() {
  194. this.$api('getConfig', {} ,res => {
  195. if(res.code == 200){
  196. res.result.forEach(item => {
  197. if(item.keyValue == 'phone'){
  198. this.phone = this.deleteTag(item.content);
  199. }
  200. if(item.keyValue == 'copyright'){
  201. this.copyright = item.content
  202. }
  203. if(item.keyValue == 'gs_name'){
  204. this.gs_name = item.content
  205. }
  206. if(item.keyValue == 'beian'){
  207. this.beian = item.content
  208. }
  209. })
  210. }
  211. })
  212. },
  213. //删除html标签
  214. deleteTag(html){
  215. return html.replace(/<[^>]*>/g, '');
  216. },
  217. //跳转绑定手机页面
  218. toPhoneDetail(){
  219. uni.reLaunch({
  220. url : '/pages/mine/phoneDetail'
  221. })
  222. },
  223. //跳转消息通知
  224. toMessage(){
  225. uni.navigateTo({
  226. url: '/pages/message/message'
  227. })
  228. },
  229. //跳转投诉建议
  230. toComplain(){
  231. uni.navigateTo({
  232. url: '/pages/complain/complain'
  233. })
  234. },
  235. //跳转我的评价
  236. toEvaluate(){
  237. uni.navigateTo({
  238. url: '/pages/evaluate/evaluate'
  239. })
  240. },
  241. //跳转订单管理
  242. toOrderManagement(){
  243. uni.navigateTo({
  244. url: '/pages/orderManagement/orderManagement'
  245. })
  246. }
  247. }
  248. }
  249. </script>
  250. <style scoped>
  251. body {
  252. background-color: #f5f5f5;
  253. }
  254. .banner {
  255. width: 100%;
  256. height: calc(392rpx -160rpx);
  257. background: #F1B8BD;
  258. }
  259. .head-div {
  260. width: calc(100vw - 72rpx);
  261. height: 268rpx;
  262. padding: 72rpx 36rpx 0;
  263. margin: 0 auto;
  264. }
  265. .nickname {
  266. font-size: 36rpx;
  267. font-family: PingFang SC, PingFang SC-Bold;
  268. font-weight: 700;
  269. text-align: left;
  270. color: #fff;
  271. line-height: 42rpx;
  272. }
  273. .days {
  274. display: flex;
  275. font-size: 20rpx;
  276. font-family: PingFang SC, PingFang SC-Regular;
  277. font-weight: 400;
  278. text-align: left;
  279. color: #fff;
  280. line-height: 28px;
  281. margin-top: 10rpx;
  282. }
  283. .bind{
  284. background: #e2e2e2;
  285. padding: 0rpx 10rpx;
  286. border-radius: 10rpx;
  287. }
  288. .one-card {
  289. width: calc(100% - 80px);
  290. border-radius: 16rpx;
  291. margin: -50rpx auto 0;
  292. background-color: #fff;
  293. padding: 20px;
  294. }
  295. .two-card {
  296. width: calc(100% - 60px);
  297. border-radius: 16rpx;
  298. margin: 20rpx auto;
  299. padding: 0rpx 10px;
  300. border-radius: 16px;
  301. }
  302. .title {
  303. height: 40rpx;
  304. line-height: 40rpx;
  305. font-size: 24rpx;
  306. font-family: PingFang SC, PingFang SC-Regular;
  307. font-weight: 400;
  308. text-align: center;
  309. color: #2f2e2e;
  310. margin-top: 15rpx;
  311. }
  312. .icon {
  313. margin: 0 auto;
  314. width: 60rpx;
  315. height: 60rpx;
  316. border-radius: 50%;
  317. }
  318. .icon-item{
  319. display: flex;
  320. flex-direction: column;
  321. justify-content: center;
  322. width: calc(33.33% - 20rpx);
  323. background: #fff;
  324. border-radius: 20rpx;
  325. box-sizing: border-box;
  326. padding: 40rpx 0rpx;
  327. margin-bottom: 20rpx;
  328. }
  329. .head-title {
  330. font-size: 30rpx;
  331. font-family: PingFang SC, PingFang SC-Bold;
  332. color: #2f2e2e;
  333. line-height: 30rpx;
  334. margin-left: 10rpx;
  335. font-weight: 700;
  336. }
  337. .font-4 {
  338. font-size: 28rpx;
  339. font-family: PingFang SC, PingFang SC-Bold;
  340. text-align: left;
  341. color: #ffffff;
  342. text-shadow: 0 4rpx 6rpx 0 rgba(40, 170, 133, 0.81);
  343. line-height: 44rpx;
  344. position: absolute;
  345. top: 32rpx;
  346. left: 72rpx;
  347. z-index: 1;
  348. }
  349. .font-5 {
  350. font-size: 30rpx;
  351. font-family: PingFang SC, PingFang SC-Bold;
  352. text-align: left;
  353. color: #ffffff;
  354. line-height: 72rpx;
  355. text-shadow: 0 4rpx 6rpx 0 rgba(0, 0, 0, 0.16);
  356. }
  357. .button-cz {
  358. width: 200rpx;
  359. height: 58rpx;
  360. line-height: 58rpx;
  361. background: linear-gradient(182deg, #ffffff 2%, #a6fce3 88%);
  362. border-radius: 30rpx;
  363. box-shadow: 0 6rpx 12rpx 0 rgba(129, 209, 186, 0.66);
  364. font-size: 28rpx;
  365. font-family: PingFang SC, PingFang SC-Bold;
  366. font-weight: 700;
  367. text-align: center;
  368. color: #3fc791;
  369. position: absolute;
  370. top: 72rpx;
  371. right: 52rpx;
  372. z-index: 1;
  373. }
  374. .cart {
  375. width: 100%;
  376. background-color: #fff;
  377. display: flex;
  378. justify-content: center;
  379. align-items: center;
  380. }
  381. .cart>view {
  382. width: calc(50% - 10px);
  383. height: 140rpx;
  384. background-size: 100% 100%;
  385. box-sizing: border-box;
  386. padding: 20rpx;
  387. font-size: 26rpx;
  388. line-height: 46rpx;
  389. }
  390. .cart>view>view {}
  391. .cart>view>.info {
  392. color: #666;
  393. font-size: 20rpx;
  394. }
  395. .cart>view>view>text {
  396. font-size: 30rpx;
  397. font-weight: 600;
  398. }
  399. .collect {
  400. margin-top: 10px;
  401. background: url(/static/ms/merit.png);
  402. margin-right: 5px;
  403. }
  404. .coupon {
  405. margin-left: 5px;
  406. margin-top: 10px;
  407. background: url(/static/ms/meleft.png);
  408. }
  409. .cart-top {
  410. width: calc(100% - 20px);
  411. height: 30px;
  412. display: block;
  413. position: absolute;
  414. left: 14px;
  415. background-color: #666;
  416. top: 45px;
  417. border-radius: calc(30% + 10px);
  418. }
  419. </style>