userinfo.vue 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305
  1. <template>
  2. <!-- <view class="container">
  3. <uni-list>
  4. <uni-list-item title="个人资料" @click="navTo('/pages/set/userinfo')" ></uni-list-item>
  5. <uni-list-item title="修改密码" @click="navTo('/pages/set/password')" ></uni-list-item>
  6. <uni-list-item title="实名认证" @click="navTo('/pages/set/phone')" ></uni-list-item>
  7. <uni-list-item title="收货地址" @click="navTo('/pages/set/address')" ></uni-list-item>
  8. </uni-list>
  9. <uni-list class="margin-t-20">
  10. <uni-list-item title="消息推送" :switch-checked='true' :show-switch="true" :show-arrow="false" switch-color='#5dbc7c' @switchChange='switchChange'>
  11. </uni-list-item>
  12. </uni-list>
  13. <uni-list class="margin-t-20">
  14. <uni-list-item title="清除缓存" ></uni-list-item>
  15. <uni-list-item title="检查更新" >
  16. <template slot="right">
  17. 当前版本 1.0.3
  18. </template>
  19. </uni-list-item>
  20. </uni-list>
  21. <view class="list-cell log-out-btn" @click="toLogout">
  22. <text class="cell-tit">退出登录</text>
  23. </view>
  24. </view> -->
  25. <view class="container">
  26. <view class="row b-b flex jg">
  27. <text class="tit">头像</text>
  28. <image :src="userInfo.avatar" @click="imgsub"></image>
  29. </view>
  30. <view class="row b-b flex">
  31. <text class="tit">昵称</text>
  32. <input class="input" v-model="userInfo.nickname" type="text" placeholder-class="placeholder" />
  33. </view>
  34. <view class="row b-b flex">
  35. <text class="tit">邀请码</text>
  36. <input class="input" v-model="userInfo.uid" type="text" disabled="true" placeholder-class="placeholder"
  37. style="color: #999;" />
  38. </view>
  39. <!-- v-if="agents!=''" -->
  40. <!-- <view class="row b-b flex" v-if="!Array.isArray(userInfo.agent)">
  41. <text class="tit">代理区域</text>
  42. <view class="agents" style="color: #999;text-align: right;">
  43. <view class="agent" v-for="(item,index) in userInfo.agent" :key="index">
  44. {{item}}
  45. </view>
  46. </view>
  47. </view> -->
  48. <view class="row b-b flex" v-if="userInfo.account || userInfo.phone">
  49. <text class="tit">用户账号</text>
  50. <input class="input" v-model="userInfo.account || userInfo.phone" type="number" disabled="true"
  51. placeholder-class="placeholder" />
  52. </view>
  53. <view class="submit-box flex">
  54. <view class="submit" @click="edit">确认修改</view>
  55. <view class="submit" @click="bind" style="margin: 15rpx auto;">绑定上级</view>
  56. <view class="submit dl" @click="toLogout">退出登录</view>
  57. </view>
  58. </view>
  59. </template>
  60. <script>
  61. // import uniList from "@/components/uni-list/uni-list.vue"
  62. // import uniListItem from "@/components/uni-list-item/uni-list-item.vue"
  63. // import { logout } from '@/api/set.js';
  64. // import {
  65. // mapMutations
  66. // } from 'vuex';
  67. // export default {
  68. // components: {
  69. // uniList,uniListItem
  70. // },
  71. // data() {
  72. // return {
  73. // };
  74. // },
  75. // methods:{
  76. // ...mapMutations('user',['logout']),
  77. // navTo(url){
  78. // uni.navigateTo({
  79. // url:url
  80. // })
  81. // },
  82. // //退出登录
  83. // toLogout(){
  84. // let obj = this;
  85. // uni.showModal({
  86. // content: '确定要退出登录么',
  87. // success: (e)=>{
  88. // if(e.confirm){
  89. // logout({}).then((e) => {
  90. // uni.navigateBack();
  91. // }).catch((e) => {
  92. // console.log(e);
  93. // })
  94. // obj.logout();
  95. // }
  96. // }
  97. // });
  98. // },
  99. // //switch切换触发方法
  100. // switchChange(e){
  101. // console.log(e);
  102. // let statusTip = e.value ? '打开': '关闭';
  103. // this.$api.msg(`${statusTip}消息推送`);
  104. // },
  105. // }
  106. // }
  107. import uniList from '@/components/uni-list/uni-list.vue';
  108. import uniListItem from '@/components/uni-list-item/uni-list-item.vue';
  109. import {
  110. mapState,
  111. mapMutations
  112. } from 'vuex';
  113. import {
  114. logout
  115. } from '@/api/set.js';
  116. import {
  117. edit
  118. } from '@/api/user.js';
  119. import{upload} from '@/api/order.js'
  120. export default {
  121. components: {
  122. uniList,
  123. uniListItem
  124. },
  125. data() {
  126. return {
  127. userInfo: {},
  128. pics: [],
  129. };
  130. },
  131. onLoad() {
  132. this.userInfo = uni.getStorageSync('userInfo') || '';
  133. console.log(this.userInfo)
  134. },
  135. methods: {
  136. ...mapMutations('user', ['logout']),
  137. bind() {
  138. uni.navigateTo({
  139. url: '/pages/set/bind'
  140. })
  141. },
  142. //退出登录
  143. toLogout() {
  144. let obj = this;
  145. uni.showModal({
  146. content: '确定要退出登录么',
  147. success: e => {
  148. if (e.confirm) {
  149. logout({}).then(e => {
  150. obj.logout();
  151. uni.switchTab({
  152. url: '/pages/index/index'
  153. })
  154. })
  155. .catch(e => {
  156. console.log(e);
  157. });
  158. }
  159. }
  160. });
  161. },
  162. imgsub() {
  163. let obj = this
  164. console.log('上传头像')
  165. // this.$util.uploadImageOne('upload/image', function(res) {
  166. // console.log('------',res);
  167. // this.pics.push(res.data.pathreplace(/http:\/\/mer.crmeb.net/,'https://hy.liuniu946.com'));
  168. // // obj.userInfo.avatar = res.data.path.replace(/http:\/\/mer.crmeb.net/,'http://zccy.frp.liuniu946.com')
  169. // obj.$set(this, 'pics', this.pics);
  170. // obj.$set(this, 'extract_pic', this.pics[0])
  171. // });
  172. // uploads({
  173. // filename: ''
  174. // }).then(data => {
  175. // console.log("data",data);
  176. // this.userInfo.avatar = data[0].url;
  177. // })
  178. upload({
  179. filename: ''
  180. }).then(res => {
  181. console.log(res[0].url)
  182. obj.userInfo.avatar = res[0].url
  183. // console.log(obj.userInfo.avatar)
  184. });
  185. },
  186. edit() {
  187. const that = this;
  188. uni.showLoading({
  189. title: '提交中...',
  190. mask: true
  191. })
  192. edit({
  193. avatar: this.userInfo.avatar,
  194. nickname: this.userInfo.nickname
  195. }).then(e => {
  196. uni.hideLoading()
  197. that.$api.msg('修改成功');
  198. setTimeout(() => {
  199. uni.switchTab({
  200. url: '/pages/user/user'
  201. });
  202. }, 1000);
  203. }).catch(e => {
  204. console.log(e);
  205. that.$api.msg('修改失败');
  206. })
  207. }
  208. }
  209. };
  210. </script>
  211. <style lang='scss'>
  212. /* page{
  213. background: $page-color-base;
  214. }
  215. .list-cell{
  216. display:flex;
  217. align-items:baseline;
  218. padding: 20rpx $page-row-spacing;
  219. line-height:60rpx;
  220. position:relative;
  221. background: #fff;
  222. justify-content: center;
  223. &.log-out-btn{
  224. margin-top: 40rpx;
  225. .cell-tit{
  226. color: $uni-color-primary;
  227. text-align: center;
  228. margin-right: 0;
  229. }
  230. }
  231. .cell-tit{
  232. flex: 1;
  233. font-size: $font-base + 2rpx;
  234. color: $font-color-dark;
  235. margin-right:10rpx;
  236. }
  237. .cell-tip{
  238. font-size: $font-base;
  239. color: $font-color-light;
  240. }
  241. switch{
  242. transform: translateX(16rpx) scale(.84);
  243. }
  244. } */
  245. page {
  246. background-color: #f3f3f3;
  247. min-height: 100%;
  248. .container {
  249. height: 100%;
  250. }
  251. }
  252. .row {
  253. background-color: #fff;
  254. padding: 42rpx 25rpx;
  255. font-size: 30rpx;
  256. color: #333333;
  257. image {
  258. width: 80rpx;
  259. height: 80rpx;
  260. border-radius: 50%;
  261. }
  262. .input {
  263. text-align: right;
  264. color: #333333;
  265. }
  266. }
  267. .submit-box {
  268. display: flex;
  269. flex-direction: column;
  270. padding-top: 157rpx;
  271. .submit {
  272. margin: 40rpx auto;
  273. width: 560rpx;
  274. background-color: #F75022;
  275. color: #FFFFFF;
  276. text-align: center;
  277. padding: 26rpx 0rpx;
  278. border-radius: 50rpx;
  279. }
  280. .dl {
  281. background-color: #FFFFFF;
  282. color: #F75022;
  283. }
  284. }
  285. .jg {
  286. margin-bottom: 20rpx;
  287. }
  288. </style>