mylocation.vue 9.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451
  1. <template>
  2. <view style="position: relative;">
  3. <!-- 胶囊 -->
  4. <mvBar :mysNavConfig="mysNavConfig"></mvBar>
  5. <view :style="{marginTop:navH}"></view>
  6. <view>
  7. <!-- 收货地址 -->
  8. <view class="card" style="margin-top: 6%;" v-for="item in list">
  9. <view class="">
  10. <view class="" style="display: flex;justify-content:space-around;align-items: center;">
  11. <view class="">
  12. <image class="head-img" :src="picture.icon_loc" mode="">
  13. </image>
  14. </view>
  15. <view class="" style="padding-left: 3%;padding-right: 3%;width: 80%;">
  16. <view style="display: flex;">
  17. <p class='ipon' style="padding-right: 200rpx;">{{item.receiver_name}}</p>
  18. <p class='ipon'>{{item.phone_number}}</p>
  19. </view>
  20. <p class='ipon'>{{item.full_detail_addr}}</p>
  21. </view>
  22. </view>
  23. <view class="" style="border-bottom: 2rpx solid #C0C0C0;margin-top: 3%;margin-bottom: 3%;"> </view>
  24. <view class="func">
  25. <view class="func-left">
  26. <label style="font-size: 28rpx;vertical-align: middle;">
  27. <radio color="#F0D232" :value="item.default_tag" :checked="item.default_tag" style="transform:scale(0.6);
  28. font-size: 24rpx;" @click="setdefault(item)" name="radio" />
  29. </label>
  30. <span>默认地址</span>
  31. </view>
  32. <view class="func-right">
  33. <view class="func-btn" @click="edit(item)">
  34. <image :src="picture.icon_edit" mode="">
  35. </image>
  36. <span>编辑</span>
  37. </view>
  38. <view class="func-btn" @click="del(item)">
  39. <image :src="picture.icon_del" mode="" style="width: 33rpx;height: 33rpx;">
  40. </image>
  41. <span>删除</span>
  42. </view>
  43. </view>
  44. </view>
  45. </view>
  46. </view>
  47. </view>
  48. <view class="" style="width: 100%;height: 150rpx;">
  49. </view>
  50. <view class="signup">
  51. <view class="signupbtn">
  52. <button type="default" class="btn1" @click="addreceipt()">手动添加</button>
  53. </view>
  54. <view class="signupbtn">
  55. <button type="default" class="btn1" @click="chooseAddr()">
  56. <image class="weixinlogo" :src="weixinimage">
  57. </image>
  58. <p class="auto-text">
  59. 自动获取</p>
  60. </button>
  61. </view>
  62. </view>
  63. </view>
  64. </template>
  65. <script>
  66. import region from '@/components/pca-code.json';
  67. import mvBar from "@/components/mys_navBar/mysNavBar";
  68. export default {
  69. components: {
  70. mvBar,
  71. },
  72. data() {
  73. return {
  74. navH: getApp().globalData.navHeight,
  75. weixinimage: "../../../static/img/icon-weixin.png",
  76. picture: {
  77. icon_edit: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-edit.png',
  78. icon_del: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-del.png',
  79. icon_loc: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/youngee/talent_upload/icon-loc.png',
  80. home8: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/home8.png',
  81. home10: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/home10.png',
  82. home11: 'https://horastar.obs.cn-east-3.myhuaweicloud.com/talent/home11.png',
  83. },
  84. list: [],
  85. mysNavConfig: {
  86. /* 开启单页显示首页图标 */
  87. isHome: true,
  88. /* 固定导航 */
  89. navFixed: true,
  90. /* 标题 (屏幕中心居中 两边图标中心居中使用slot center1) */
  91. navTitle: {
  92. text: "收货地址管理",
  93. color: "",
  94. fontSize: "32rpx", // px upx rpx
  95. fontWeight: "normal", // 100 - 700
  96. },
  97. btnType: "type2",
  98. onLeftClick: "",
  99. /* type2 按钮 */
  100. type2Config: {
  101. // 左图标
  102. leftPath: "/static/img/png2.png",
  103. // 右图标
  104. rightPath: "/static/img/png4.png",
  105. // 圆角
  106. radius: "40rpx",
  107. },
  108. },
  109. };
  110. },
  111. onShow() {
  112. this.getlist()
  113. },
  114. onLoad() {},
  115. methods: {
  116. // 列表
  117. getlist() {
  118. return this.$https.get('/youngee/c/t/g/get-talent-address')
  119. .then(res => {
  120. console.log(res)
  121. this.list = res.data.data
  122. for (let k = 0; k < this.list.length; ++k) {
  123. let a = this.list[k].region_code.toString().slice(0, 2)
  124. let b = this.list[k].region_code.toString().slice(0, 4)
  125. let c = 0
  126. for (var i = 0; i < region.length; i++) {
  127. if (region[i].code == a) {
  128. a = region[i].name
  129. for (var j = 0; j < region[i].children.length; j++) {
  130. if (region[i].children[j].code == b) {
  131. b = region[i].children[j].name
  132. for (var o = 0; o < region[i].children[j].children.length; o++) {
  133. if (region[i].children[j].children[o].code == this.list[k]
  134. .region_code) {
  135. c = region[i].children[j].children[o].name
  136. }
  137. }
  138. }
  139. }
  140. }
  141. }
  142. this.list[k].full_detail_addr = a + b + c + this.list[k].detail_addr
  143. }
  144. })
  145. },
  146. // 进入添加收货地址
  147. addreceipt() {
  148. uni.navigateTo({
  149. url: '/page_mycenter/myinformation/addlocation?ismodify=0'
  150. });
  151. },
  152. async chooseAddr() {
  153. const that = this
  154. uni.chooseAddress({
  155. async success(res) {
  156. await that.$https.post('/youngee/c/t/p/add-talent-address', {
  157. region_code: res.nationalCode,
  158. detail_addr: res.provinceName + res.cityName + res.countyName + res
  159. .detailInfo,
  160. phone_number: res.telNumber,
  161. receiver_name: res.userName,
  162. mail_code: res.postalCode,
  163. default_tag: 1
  164. })
  165. .then(res => {
  166. console.log(res)
  167. })
  168. },
  169. fail: (res) => {
  170. console.log(res)
  171. }
  172. })
  173. },
  174. // 改变默认地址
  175. setdefault(item) {
  176. console.log(item.default_tag)
  177. if (item.default_tag === 1)
  178. return
  179. this.$https.post('/youngee/c/t/p/change-default-delivery-addr', {
  180. address_id: item.address_id,
  181. })
  182. .then(res => {
  183. console.log(res)
  184. this.getlist()
  185. uni.showToast({
  186. title: '修改成功'
  187. })
  188. })
  189. },
  190. // 编辑地址
  191. edit(item) {
  192. console.log(item.receiver_name)
  193. uni.navigateTo({
  194. url: '/page_mycenter/myinformation/addlocation?address_id=' + item.address_id + '&ismodify=1'
  195. });
  196. },
  197. // 删除地址
  198. del(item) {
  199. let that = this
  200. uni.showModal({
  201. title: '提示',
  202. content: '确认删除',
  203. success: function(res) {
  204. if (res.confirm) {
  205. // console.log(item)
  206. that.$https.post('/youngee/c/t/p/delete-talent-address', {
  207. address_id: item.address_id,
  208. default_tag: item.default_tag,
  209. })
  210. .then(res => {
  211. console.log(res)
  212. that.getlist()
  213. uni.showToast({
  214. title: '删除成功'
  215. })
  216. })
  217. } else if (res.cancel) {
  218. console.log('用户点击取消');
  219. }
  220. },
  221. })
  222. },
  223. }
  224. };
  225. </script>
  226. <style>
  227. </style>
  228. <style lang="scss" scoped>
  229. view {
  230. font-size: 28rpx;
  231. // line-height: inherit;
  232. }
  233. .menu {
  234. position: fixed;
  235. top: 180rpx;
  236. border-bottom: #FCCF41;
  237. background-color: #FFFFFF;
  238. justify-content: space-around;
  239. height: 5%;
  240. width: 100%;
  241. display: flex;
  242. z-index: 10;
  243. }
  244. .menu-item p {
  245. font-weight: 600;
  246. &.lor {
  247. border-bottom: 5rpx solid #F0D232;
  248. color: #F0D232;
  249. padding-bottom: 15rpx;
  250. }
  251. }
  252. .signup {
  253. display: flex;
  254. align-items: center;
  255. justify-content: space-around;
  256. width: 100%;
  257. position: fixed;
  258. padding-bottom: 10rpx;
  259. bottom: 0rpx;
  260. display: flex;
  261. height: 100rpx;
  262. padding-top: 2%;
  263. box-shadow: 0rpx 5rpx 40rpx #ccc;
  264. // width: 100%;
  265. // position: fixed;
  266. // bottom: 0rpx;
  267. // display: flex;
  268. // height: 90rpx;
  269. // background-color: #FFFFFF;
  270. // justify-content: space-around;
  271. // ;
  272. // /* 垂直居中 */
  273. // align-items: center;
  274. }
  275. .signupbtn p {
  276. font-size: 32rpx;
  277. }
  278. .btn1 {
  279. // width: 60%;
  280. background-color: #f2d22d;
  281. color: #000;
  282. border-color: #ffffff;
  283. border-radius: 10rpx;
  284. font-size: 32rpx;
  285. line-height: 200%;
  286. letter-spacing: 10rpx;
  287. font-weight: 500;
  288. height: 100%;
  289. width: 280rpx;
  290. display: flex;
  291. align-items: center;
  292. justify-content: center;
  293. }
  294. .auto-btn {
  295. width: 300rpx;
  296. text-align: center;
  297. background-color: #FCCF41;
  298. border-radius: 10rpx;
  299. color: #FFFFFF;
  300. font-size: 28rpx;
  301. line-height: 180%;
  302. margin-right: 10%;
  303. display: flex;
  304. justify-content: center;
  305. align-items: center;
  306. }
  307. .auto-text {
  308. display: inline-block;
  309. // font-size:32rpx;
  310. }
  311. .weixinlogo {
  312. display: inline-block;
  313. padding-right: 5rpx;
  314. width: 35rpx;
  315. height: 35rpx;
  316. }
  317. .radio {
  318. color: #F0D232;
  319. }
  320. .func {
  321. display: flex;
  322. justify-content: space-between;
  323. }
  324. .func-left {
  325. display: flex;
  326. align-items: center;
  327. }
  328. .func-right {
  329. display: flex;
  330. justify-content: center;
  331. padding: 0 0 0 1%;
  332. }
  333. .func-btn {
  334. display: flex;
  335. align-items: center;
  336. padding-left: 20rpx;
  337. }
  338. .func-btn span {
  339. color: #333333;
  340. font-size: 30rpx;
  341. font-weight: 500;
  342. }
  343. .func-btn image {
  344. vertical-align: middle;
  345. width: 30rpx;
  346. height: 30rpx;
  347. display: inline-block;
  348. padding-right: 14rpx;
  349. }
  350. .head-img {
  351. vertical-align: middle;
  352. width: 50rpx;
  353. height: 50rpx;
  354. display: inline-block;
  355. padding-right: 30rpx;
  356. }
  357. .ipon {
  358. color: #333333;
  359. font-size: 30rpx;
  360. font-weight: 500;
  361. margin-bottom: 10rpx;
  362. }
  363. .card {
  364. width: 88%;
  365. padding: 24rpx;
  366. margin-top: 30rpx;
  367. border-radius: 10rpx;
  368. background-color: #ffffff;
  369. margin: 0 auto;
  370. box-shadow: 0px 0px 10rpx 2rpx #CCCCCC;
  371. }
  372. .butto {
  373. text-align: center;
  374. }
  375. .option {
  376. padding: 20rpx;
  377. }
  378. .uni-margin-wrap {
  379. width: 690rpx;
  380. width: 100%;
  381. ;
  382. }
  383. .swiper {
  384. height: 300rpx;
  385. }
  386. .swiper-item {
  387. display: block;
  388. height: 300rpx;
  389. line-height: 300rpx;
  390. text-align: center;
  391. }
  392. .swiper-list {
  393. margin-top: 40rpx;
  394. margin-bottom: 0;
  395. }
  396. .uni-common-mt {
  397. margin-top: 60rpx;
  398. position: relative;
  399. }
  400. .info {
  401. position: absolute;
  402. right: 20rpx;
  403. }
  404. .uni-padding-wrap {
  405. width: 550rpx;
  406. padding: 0 100rpx;
  407. }
  408. </style>