addr

package-lock.json

@@ -8,6 +8,7 @@
       "name": "shop-mobile",
       "version": "0.1.0",
       "dependencies": {
+        "@vant/area-data": "^1.4.1",
         "axios": "^1.4.0",
         "axios-retry": "^3.5.1",
         "babel-plugin-import": "^1.13.6",
@@ -2274,6 +2275,11 @@
         "@types/node": "*"
       }
     },
+    "node_modules/@vant/area-data": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@vant/area-data/-/area-data-1.4.1.tgz",
+      "integrity": "sha512-D8zI/rfxREhnIKGoYzsEJZ73fte4JARhFeFftLIH7ynu1sPrCBEgPkLEbwPyvw3VC4JdSIuzaK5uOhu+BcoPXw=="
+    },
     "node_modules/@vant/icons": {
       "version": "1.8.0",
       "resolved": "https://registry.npmjs.org/@vant/icons/-/icons-1.8.0.tgz",

package.json

@@ -7,6 +7,7 @@
     "build": "vue-cli-service build"
   },
   "dependencies": {
+    "@vant/area-data": "^1.4.1",
     "axios": "^1.4.0",
     "axios-retry": "^3.5.1",
     "babel-plugin-import": "^1.13.6",

src/api/address.js

@@ -0,0 +1,10 @@
+import { post, get } from '../utils/request'
+
+export const addressList = (data) => get("/p/address/list", data)
+
+
+export const addAddr = (data) => post("/p/address/addAddr", data)
+
+
+
+export const listByPid = (data) => get("/p/area/listByPid", data)

src/api/prodinfo.js

@@ -1,13 +1,13 @@
 import { post, get } from '../utils/request'
 
-
 export const prodInfo = (data) => get("/prod/prodInfo", data)
 
 export const prodCommData = (data) => get("/prodComm/prodCommData", data)
 
-
 export const changeItem = (data) => post("/p/shopCart/changeItem", data)
 
 export const confirm = (data) => post("/p/order/confirm", data)
 
-export const isCollection = (data) => get("/p/user/collection/isCollection", data)
+export const isCollection = (data) => get("/p/user/collection/isCollection", data)
+
+export const submit = (data) => post("/p/order/submit", data)

src/main.js

@@ -7,10 +7,12 @@ Vue.config.productionTip = false
 import {
   Image as VanImage, Form, Field, Search, CheckboxGroup, GoodsActionIcon,
   Swipe, Grid, GridItem, NoticeBar, Checkbox, Col, Cell, GoodsActionButton,
-  Button, Tabbar, TabbarItem, SwipeItem, Tag, Row, CellGroup, GoodsAction,
-  TreeSelect, Card, Empty, SubmitBar, Stepper, Divider, Icon, ActionSheet
+  Button, Tabbar, TabbarItem, SwipeItem, Tag, Row, CellGroup, GoodsAction, AddressEdit,
+  TreeSelect, Card, Empty, SubmitBar, Stepper, Divider, Icon, ActionSheet, AddressList
 } from 'vant';
 
+Vue.use(AddressEdit);
+Vue.use(AddressList);
 Vue.use(GoodsAction);
 Vue.use(GoodsActionButton);
 Vue.use(GoodsActionIcon);

src/router/index.js

@@ -8,6 +8,7 @@ import Category from '../views/Category.vue'
 import ShopCart from '../views/ShopCart.vue'
 import Layout from '../components/Layout.vue'
 import Prodinfo from '../views/ProdInfo.vue'
+import AddressList from '../views/AddressList.vue'
 
 Vue.use(VueRouter)
 
@@ -47,10 +48,15 @@ const routes = [
     path: '/register',
     name: 'register',
     component: Register
-  },{
+  },{  
     path: '/prodinfo',
     name: 'prodinfo',
     component: Prodinfo
+  },
+  {  
+    path: '/addressList',
+    name: 'addressList',
+    component: AddressList
   }
 ]
 

src/views/AddressList.vue

@@ -0,0 +1,88 @@
+<template>
+    <div>
+        <van-address-list v-show="type === 'list'" v-model="chosenAddressId" :list="list" :disabled-list="disabledList" disabled-text="以下地址超出配送范围"
+            default-tag-text="默认" @add="onAdd" @edit="onEdit" />
+
+        <van-address-edit v-show="type === 'edit'" :area-list="areaList" show-postal show-delete show-set-default show-search-result
+            :search-result="searchResult" :area-columns-placeholder="['请选择', '请选择', '请选择']" @save="onSave"
+            @delete="onDelete" @change-detail="onChangeDetail" />
+    </div>
+</template>
+<script>
+import { addressList, addAddr, listByPid } from '../api/address'
+import { areaList } from '@vant/area-data';
+export default {
+    data() {
+        return {
+            chosenAddressId: 0,
+            list: [],
+            type: 'list',
+            disabledList: [],
+            areaList: areaList,
+            searchResult:[]
+        }
+    },
+    async created() {
+        this.init()
+    },
+    methods: {
+        async init(){
+            const list = await addressList()
+            list.map(result => {
+                result.tel = result.mobile
+                result.address = result.province + " " + result.city + " "
+                    + result.area + " " + result.addr
+                result.name = result.receiver
+                result.isDefault = result.commonAddr === 1 ? true : false
+                result.id = result.areaId
+            })
+            this.list = list
+        },
+        onDelete(){
+            this.init()
+            this.type = 'list'
+        },
+        onAdd() {
+            this.type = 'edit'
+        },
+        onEdit() {
+        },
+        onChangeDetail(val){
+        },
+        async onSave(data){
+
+            const province = await listByPid({pid:0})
+            province.map(async (result)=>{
+                if ( data.province === result.areaName ) {
+                    data.provinceId = result.areaId
+                    const city = await listByPid({pid: result.areaId})
+                    city.map(async (result)=>{
+                        if ( data.city === result.areaName ) {
+                            data.cityId = result.areaId
+                            const city = await listByPid({pid: result.areaId})
+                            city.map(async (result)=>{
+                                if ( data.county === result.areaName ) {
+                                    data.countyId = result.areaId
+                                    addAddr({
+                                        receiver: data.name,
+                                        addr: data.addressDetail,
+                                        postCode: data.postalCode,
+                                        mobile: data.tel,
+                                        province: data.province,
+                                        provinceId:data.provinceId,
+                                        city: data.city,
+                                        cityId: data.cityId,
+                                        area: data.county,
+                                        areaId: data.countyId,
+                                    })
+                                }
+                            })
+                        }
+                    })
+                }
+            })
+        }
+    }
+}
+</script>
+<style lang="less"></style>

src/views/ProdInfo.vue

@@ -74,7 +74,7 @@
             <div style="height: 1rem;"></div>
             <van-card :num="confirm.orderItem.prodCount" 
                 :price="defaultSku.price ? defaultSku.price : prodData.price" 
-                :desc="prodData.brief" :title="defaultSku.skuName"
+                :desc="prodData.brief" :title="defaultSku.skuName ? defaultSku.skuName : prodData.prodName "
                 :thumb="defaultSku.pic ? defaultSku.pic : prodData.pic ">
                 <template #tags>
                 </template>
@@ -96,9 +96,9 @@
                 <div style="margin-top: 2rem;"></div>
 
                 <div class="shopcart-button">
-                    <van-button class="left" :disabled="defaultSku.skuName ? false : true" type="danger"
+                    <van-button class="left" :disabled="defaultSku.price ? false : true" type="danger"
                     @click="shopcartAdd">加入购物车</van-button>
-                    <van-button class="right" :disabled="defaultSku.skuName ? false : true" type="danger"
+                    <van-button class="right" :disabled="defaultSku.price ? false : true" type="danger"
                     @click="buynow">立即购买</van-button>
                 </div>
             </div>
@@ -132,7 +132,7 @@
     </div>
 </template>
 <script>
-import { prodInfo, prodCommData, isCollection, changeItem, confirm } 
+import { prodInfo, prodCommData, isCollection, changeItem, confirm, submit } 
     from '../api/prodinfo'
 import { formatHtml } from '../utils/util'
 import { Toast  } from 'vant'
@@ -191,7 +191,22 @@ export default {
     },
     methods: {
         buynow(){
-            
+            this.confirm.orderItem.prodId = this.prodData.prodId
+            this.confirm.orderItem.skuId = this.defaultSku.skuId
+            this.confirm.orderItem.shopId = this.prodData.shopId
+            this.confirm.orderItem.distributionCardNo = ""
+            confirm(this.confirm).then(r=>{
+                submit( {
+                    orderShopParam: [
+                    {
+                        shopId: this.prodData.shopId,
+                        remarks:""
+                    }
+                    ]
+                })
+            }).catch(e=>{
+                console.log(e)
+            })
         },
         shopcartAdd(){
             this.shopcart.basketId = 0
@@ -219,6 +234,7 @@ export default {
                 if (defaultArr.length === 0) {
                     defaultArr = propArr
                     this.defaultSku = sku[i]
+                    if ( sku.length === 1 ) return ;
                 }
                 for (let n = 0; n < propArr.length; n++) {
                     const valueStr = propArr[n];