mine.vue 9.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331
  1. <template>
  2. <view>
  3. <img src="../../static/mine/banner.png" class="banner" />
  4. <div class="info">
  5. <div class="headerandwelcome">
  6. <img src="../../static/mine/head.png" alt="" class="header" />
  7. <div class="weltxt">
  8. {{ getUserLocalStorageInfo.user.truename }},欢迎您!
  9. </div>
  10. </div>
  11. <div class="labelpage">
  12. <div class="labelpage_row">
  13. <img height="44rpx" src="../../static/mine/versionicon.png" alt="" />
  14. <div class="labelpage_text">
  15. <div class="labelpage_name">当前版本号</div>
  16. <div class="labelpage_value">v1.0.1</div>
  17. <div class="border"></div>
  18. </div>
  19. </div>
  20. <div
  21. v-if="!bindFlag"
  22. class="labelpage_row"
  23. style="margin-top: 48rpx"
  24. @click="bindWxId()"
  25. >
  26. <img height="44rpx" src="../../static/mine/versionicon.png" alt="" />
  27. <div class="labelpage_text">
  28. <div class="labelpage_name">绑定微信账号</div>
  29. <!-- <div class="labelpage_value">v1.0.1</div> -->
  30. <div class="border"></div>
  31. </div>
  32. </div>
  33. <div
  34. v-if="bindFlag"
  35. class="labelpage_row"
  36. style="margin-top: 48rpx"
  37. @click="unbindWxId()"
  38. >
  39. <img height="44rpx" src="../../static/mine/versionicon.png" alt="" />
  40. <div class="labelpage_text">
  41. <div class="labelpage_name">解绑微信账号</div>
  42. <!-- <div class="labelpage_value">v1.0.1</div> -->
  43. <div class="border"></div>
  44. </div>
  45. </div>
  46. <div
  47. class="labelpage_row"
  48. style="margin-top: 48rpx"
  49. @click="bindPush()"
  50. >
  51. <img height="44rpx" src="../../static/mine/versionicon.png" alt="" />
  52. <div class="labelpage_text">
  53. <div class="labelpage_name">绑定消息推送</div>
  54. <!-- <div class="labelpage_value">v1.0.1</div> -->
  55. <div class="border"></div>
  56. </div>
  57. </div>
  58. <div
  59. class="labelpage_row"
  60. style="margin-top: 48rpx"
  61. @click="editPassWord()"
  62. >
  63. <img height="44rpx" src="../../static/mine/editpassword.png" alt="" />
  64. <div class="labelpage_text">
  65. <div class="labelpage_name">密码修改</div>
  66. <div class="labelpage_value">
  67. <img
  68. src="../../static/mine/youjiantou.png"
  69. style="width: 44rpx; height: 44rpx"
  70. alt=""
  71. />
  72. </div>
  73. <div class="border"></div>
  74. </div>
  75. </div>
  76. <div
  77. class="labelpage_row"
  78. style="margin-top: 48rpx"
  79. @click="outLogin()"
  80. >
  81. <img height="44rpx" src="../../static/mine/outicon.png" alt="" />
  82. <div class="labelpage_text">
  83. <div class="labelpage_name">退出账号</div>
  84. <div class="labelpage_value">
  85. <img
  86. src="../../static/mine/youjiantou.png"
  87. style="width: 44rpx; height: 44rpx"
  88. alt=""
  89. />
  90. </div>
  91. </div>
  92. </div>
  93. </div>
  94. </div>
  95. </view>
  96. </template>
  97. <script>
  98. import {
  99. getUserInfo,
  100. getUserLocalStorageInfo,
  101. bindWxOpenId,
  102. getWxUserById,
  103. unbindWxId,
  104. } from "@/js_sdk/http";
  105. export default {
  106. data() {
  107. return {
  108. userInfo: {},
  109. bindFlag: 1,
  110. getUserLocalStorageInfo: getUserLocalStorageInfo(),
  111. };
  112. },
  113. onLoad() {
  114. this.getWxUserById();
  115. //option为object类型,会序列化上个页面传递的参数
  116. // this.getUserInfo(); //打印出上个页面传递的参数。
  117. },
  118. methods: {
  119. bindPush() {
  120. let that = this;
  121. // wx.requestSubscribeMessage({
  122. // tmplIds: [
  123. // "HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY",
  124. // "Zt7a0xK-gy0aBe0owXmHi98t46n9vxrlkiQwz3ThnfQ",
  125. // "iwqrwmxwjgQrGXFdZ3_kqYXOU52bfREK1cQJGwreKRE",
  126. // ],
  127. // success(res) {
  128. // console.log(res);
  129. // },
  130. // });
  131. wx.getSetting({
  132. withSubscriptions: true,
  133. success(res) {
  134. var itemSettings = res.subscriptionsSetting.itemSettings;
  135. console.log(itemSettings);
  136. // HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY: "accept"
  137. // Zt7a0xK-gy0aBe0owXmHi98t46n9vxrlkiQwz3ThnfQ: "accept"
  138. // iwqrwmxwjgQrGXFdZ3_kqYXOU52bfREK1cQJGwreKRE: "accept"
  139. if (
  140. !itemSettings ||
  141. itemSettings["HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY"] !=
  142. "accept" ||
  143. itemSettings["Zt7a0xK-gy0aBe0owXmHi98t46n9vxrlkiQwz3ThnfQ"] !=
  144. "accept" ||
  145. itemSettings["iwqrwmxwjgQrGXFdZ3_kqYXOU52bfREK1cQJGwreKRE"] !=
  146. "accept"
  147. ) {
  148. wx.requestSubscribeMessage({
  149. tmplIds: [
  150. "HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY",
  151. "Zt7a0xK-gy0aBe0owXmHi98t46n9vxrlkiQwz3ThnfQ",
  152. "iwqrwmxwjgQrGXFdZ3_kqYXOU52bfREK1cQJGwreKRE",
  153. ],
  154. success: (res) => {
  155. if (
  156. itemSettings["HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY"] &&
  157. itemSettings["HL4csSthBOnLbntYxrs4QE_Nb94Im8lN62t4lvl65XY"] ==
  158. "reject"
  159. ) {
  160. that.$showToast("未绑定所有消息通知");
  161. } else {
  162. that.$showToast("绑定成功");
  163. }
  164. console.log(res);
  165. },
  166. fail(err) {
  167. console.log("失败!!!!!!!!!!!!_:", err);
  168. },
  169. });
  170. } else {
  171. that.$showToast("请勿重复绑定");
  172. }
  173. },
  174. });
  175. },
  176. async getWxUserById() {
  177. let { data } = await getWxUserById(getUserLocalStorageInfo().user.id);
  178. this.bindFlag = data.bindFlag ? true : false;
  179. console.log(data);
  180. },
  181. async unbindWxId() {
  182. let data = await unbindWxId({
  183. userId: getUserLocalStorageInfo().user.id,
  184. });
  185. this.getWxUserById();
  186. this.$showToast("解绑成功");
  187. },
  188. bindWxId() {
  189. let _this = this;
  190. wx.login({
  191. success: async function (res) {
  192. if (res.code) {
  193. var code = res.code; // 获取到用户的临时登录凭证 code
  194. // 发送 code 到服务器端
  195. let data = await bindWxOpenId({
  196. code: res.code,
  197. userId: getUserLocalStorageInfo().user.id,
  198. });
  199. console.log(data.errmsg);
  200. if (data.errmsg == "成功") {
  201. // _this.$showToast("绑定成功");
  202. uni.showToast({
  203. title: "绑定成功",
  204. duration: 500,
  205. });
  206. _this.getWxUserById();
  207. } else {
  208. uni.showToast({
  209. title: data.errMsg,
  210. duration: 500,
  211. });
  212. }
  213. console.log(data);
  214. // ...
  215. } else {
  216. console.log("登录失败!" + res.errMsg);
  217. }
  218. },
  219. });
  220. },
  221. outLogin() {
  222. wx.showModal({
  223. title: "提示!",
  224. content: "是否确认退出登录?",
  225. success: function (res) {
  226. if (res.confirm) {
  227. uni.clearStorageSync();
  228. uni.reLaunch({
  229. url: "/pages/login/login",
  230. });
  231. }
  232. },
  233. });
  234. },
  235. editPassWord() {
  236. uni.navigateTo({
  237. url: "/pages/subPackages/password/index",
  238. });
  239. },
  240. async getUserInfo() {
  241. let data = await getUserInfo();
  242. this.userInfo = data.data;
  243. },
  244. },
  245. };
  246. </script>
  247. <style scoped lang="scss">
  248. .banner {
  249. width: 100%;
  250. height: 424rpx;
  251. position: absolute;
  252. z-index: 1;
  253. }
  254. .headerandwelcome {
  255. margin-bottom: 60rpx;
  256. height: 120rpx;
  257. width: 100%;
  258. }
  259. .info {
  260. position: absolute;
  261. width: calc(100% - 64rpx);
  262. margin: 60rpx 32rpx 0 32rpx;
  263. z-index: 2;
  264. }
  265. .header {
  266. height: 120rpx;
  267. width: 120rpx;
  268. margin-left: 15rpx;
  269. border-radius: 50%;
  270. float: left;
  271. }
  272. .weltxt {
  273. height: 120rpx;
  274. line-height: 120rpx;
  275. color: #ffffff;
  276. margin-left: 32rpx;
  277. float: left;
  278. }
  279. .labelpage {
  280. width: calc(100% - 96rpx);
  281. // height: 308rpx;
  282. padding: 96rpx 48rpx;
  283. border-radius: 12rpx 12rpx 12rpx 12rpx;
  284. background: #ffffff;
  285. }
  286. .labelpage_row {
  287. height: 83rpx;
  288. width: 100%;
  289. img {
  290. height: 44rpx;
  291. width: 44rpx;
  292. float: left;
  293. margin-right: 12rpx;
  294. }
  295. .labelpage_text {
  296. width: calc(100% - 64rpx);
  297. height: 44rpx;
  298. line-height: 44rpx;
  299. float: left;
  300. }
  301. .labelpage_name {
  302. height: 44rpx;
  303. line-height: 44rpx;
  304. float: left;
  305. font-size: 28rpx;
  306. color: #081640;
  307. font-weight: 400;
  308. }
  309. .labelpage_value {
  310. height: 44rpx;
  311. line-height: 44rpx;
  312. float: right;
  313. font-size: 28rpx;
  314. color: #1d18bc;
  315. font-weight: 400;
  316. }
  317. .border {
  318. margin-top: 48rpx;
  319. width: 100%;
  320. height: 1rpx;
  321. border-bottom: 2rpx solid #e6e6e6;
  322. float: left;
  323. }
  324. }
  325. </style>