user.vue 5.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327
  1. <template>
  2. <view class="page-fill">
  3. <view class="headimg"></view>
  4. <view class="header">
  5. <view v-if="weixinUp" class="face3">
  6. <image :src="avatarUrl" class="face2"></image>
  7. </view>
  8. <view v-if="weixinDown">
  9. <image src="../../static/img/userimg.png" class="face"></image>
  10. </view>
  11. <view class="info-wapper">
  12. <view class="nickname">
  13. {{name}}
  14. </view>
  15. </view>
  16. <view class="tuichu">
  17. <button @tap="bindLogout" class="settings">
  18. <p class="p3">{{$t('user.bindLogout')}}</p>
  19. </button>
  20. </view>
  21. </view>
  22. <view class="">
  23. <uni-list>
  24. <view v-if="ifForeign">
  25. <view v-if="gid">
  26. <uni-list-item title="优惠码" @click="open()" />
  27. </view>
  28. </view>
  29. <view v-if="show">
  30. <uni-list-item :title="$t('user.equipmentname')" @click="updataName()" />
  31. </view>
  32. </uni-list>
  33. </view>
  34. <view class="xiugai2">
  35. <button type="primary" @click="trant()" class="xiugai2">
  36. <p class="xiugai3">解除微信绑定</p>
  37. </button>
  38. </view>
  39. </view>
  40. </template>
  41. <script>
  42. import uniList from '@/components/uni-list/uni-list.vue'
  43. import uniListItem from '@/components/uni-list-item/uni-list-item.vue'
  44. import {
  45. mapState,
  46. mapActions,
  47. mapMutations
  48. } from 'vuex'
  49. export default {
  50. components: {
  51. uniList,
  52. uniListItem,
  53. },
  54. data() {
  55. return {
  56. name: '',
  57. show: false,
  58. ifForeign: false,
  59. listName: [],
  60. value: null,
  61. id: null,
  62. gid: false,
  63. parm: {
  64. name: null,
  65. id: null
  66. },
  67. showOrNo: null,
  68. avatarUrl: null,
  69. weixinUp: false,
  70. weixinDown: true
  71. };
  72. },
  73. onPullDownRefresh() {
  74. setTimeout(function() {
  75. uni.stopPullDownRefresh();
  76. }, 800);
  77. },
  78. onShow() {
  79. uni.setNavigationBarTitle({title: this.$t('user.title')});
  80. uni.setTabBarItem({ index: 4,text: this.$t('tabs.tab5')});
  81. // uni.startPullDownRefresh();
  82. var globalUser = uni.getStorageSync("globalUser");
  83. var gid = globalUser.id;
  84. if(gid!=1){
  85. this.gid = true;
  86. }
  87. var ifForeign = globalUser.ifForeign;
  88. if(ifForeign==0){
  89. this.ifForeign = true;
  90. }
  91. // var me = this;
  92. var name = uni.getStorageSync("name");
  93. this.name = name;
  94. var listName = uni.getStorageSync("listName");
  95. this.listName = listName;
  96. if (listName != '' && listName != null) {
  97. var adminId = listName[0].adminId;
  98. if (adminId != '1' && adminId != null) {
  99. this.show = true;
  100. }
  101. }
  102. var newparm = uni.getStorageSync("newparm");
  103. if (newparm.toString().length > 1) {
  104. if (newparm.avatarUrl.length > 1) {
  105. this.avatarUrl = newparm.avatarUrl;
  106. this.weixinUp = true;
  107. this.weixinDown = false;
  108. }
  109. }
  110. },
  111. onLoad() {
  112. },
  113. methods: {
  114. open() {
  115. uni.navigateTo({
  116. url: 'promoCode',
  117. });
  118. },
  119. updataName() {
  120. uni.navigateTo({
  121. url: 'equipmentName',
  122. });
  123. },
  124. trant() {
  125. uni.reLaunch({
  126. url: '../WeixinSwicth/WeixinSwicth',
  127. });
  128. },
  129. bindLogout() {
  130. //清楚缓存
  131. uni.clearStorageSync();
  132. uni.reLaunch({
  133. url: '/pages/Login/Login',
  134. });
  135. },
  136. setStyle() {
  137. this.showOrNo = "block";
  138. },
  139. setStyle2() {
  140. this.showOrNo = "none";
  141. },
  142. }
  143. }
  144. </script>
  145. <style>
  146. .page-fill {
  147. width: 100%;
  148. height: 100%;
  149. background: #FFFFFF;
  150. padding-bottom: 100upx;
  151. }
  152. .headimg {
  153. height: 120upx;
  154. background: #206DC3;
  155. width: 750upx;
  156. }
  157. .header {
  158. height: 160upx;
  159. width: 690upx;
  160. background: #FFFFFF;
  161. margin: auto;
  162. padding-top: 50upx;
  163. box-shadow: 0upx -1upx 20upx #D3D3D3;
  164. border-radius: 15upx;
  165. transform: translateY(-90upx);
  166. display: flex;
  167. flex-direction: row;
  168. justify-content: flex-start;
  169. }
  170. .face {
  171. width: 116upx;
  172. height: 116upx;
  173. padding-left: 30upx;
  174. border-radius: 50%;
  175. flex-shrink: 0;
  176. }
  177. .face2 {
  178. width: 120upx;
  179. height: 120upx;
  180. padding-right: 0upx;
  181. border-radius: 50%;
  182. flex-shrink: 0;
  183. }
  184. .face3 {
  185. width: 120upx;
  186. height: 120upx;
  187. padding-left: 30upx;
  188. padding-right: 0upx;
  189. border-radius: 50%;
  190. flex-shrink: 0;
  191. }
  192. .info-wapper {
  193. width: 50%;
  194. margin-left: 30upx;
  195. display: flex;
  196. flex-direction: column;
  197. }
  198. .nickname {
  199. color: #363D44;
  200. font-size: 16px;
  201. font-weight: 600;
  202. padding: 30upx 0upx 0upx 0upx;
  203. font-family: "PingFang-SC-Bold";
  204. }
  205. .set-wapper {
  206. display: flex;
  207. flex-direction: row;
  208. justify-content: flex-end;
  209. width: 15%;
  210. }
  211. .tuichu {
  212. width: 100upx;
  213. height: 64upx;
  214. padding-top: 30upx;
  215. text-align: center;
  216. margin: 0 auto;
  217. }
  218. .settings {
  219. width: 100upx;
  220. height: 64upx;
  221. border-radius: 10upx;
  222. background: #D6101F;
  223. text-align: center;
  224. margin: 0 auto;
  225. }
  226. .p3 {
  227. /* #ifdef H5 */
  228. top: -13%;
  229. /* #endif */
  230. font-size: 32upx;
  231. color: #FFFFFF;
  232. font-weight: bold;
  233. width: 100upx;
  234. height: 64upx;
  235. /* #ifndef H5 */
  236. padding-top: 3upx;
  237. /* #endif */
  238. position: absolute;
  239. /* 水平居中 */
  240. left: 50%;
  241. -webkit-transform: translateX(-50%);
  242. transform: translateX(-50%);
  243. }
  244. .centerY {
  245. position: absolute;
  246. top: 50%;
  247. -webkit-transform: translateY(-50%);
  248. transform: translateY(-50%);
  249. }
  250. .button2 {
  251. padding-right: 60upx;
  252. padding-top: 2upx;
  253. }
  254. .button {
  255. width: 80upx;
  256. height: 60upx;
  257. border-radius: 10upx;
  258. }
  259. .p {
  260. /* #ifdef H5 */
  261. top: -13%;
  262. /* #endif */
  263. width: 80upx;
  264. height: 60upx;
  265. font-size: 30upx;
  266. /* #ifndef H5 */
  267. padding-top: 3upx;
  268. /* #endif */
  269. position: absolute;
  270. /* 水平居中 */
  271. left: 50%;
  272. -webkit-transform: translateX(-50%);
  273. transform: translateX(-50%);
  274. }
  275. .xiugai2 {
  276. width: 100%;
  277. height: 80upx;
  278. font-family: "PingFang-SC-Bold";
  279. font-weight: bold;
  280. margin: auto;
  281. font-size: 50upx;
  282. color: #363D44;
  283. position: fixed;
  284. bottom: 0;
  285. }
  286. .xiugai3 {
  287. height: 80upx;
  288. font-family: "PingFang-SC-Bold";
  289. font-weight: bold;
  290. margin: auto;
  291. font-size: 40upx;
  292. color: #363D44;
  293. }
  294. .body {
  295. background-color: #FFFFFF;
  296. padding: 10upx 10upx 10upx 10upx;
  297. display: flex;
  298. flex-direction: row;
  299. justify-content: flex-start;
  300. }
  301. </style>