|
|
@@ -1,420 +1,353 @@
|
|
|
<template>
|
|
|
- <view class="page">
|
|
|
- <view class="content">
|
|
|
- <view class="title">
|
|
|
- <text class="title-left">{{ i18n.contacts }}</text>
|
|
|
- </view>
|
|
|
- <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
|
|
- <u--form labelPosition="left" :model="model1" ref="uForm">
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- @click="showDialog = true"
|
|
|
- :label="i18n.country"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.country"
|
|
|
- disabled
|
|
|
- disabledColor="#ffffff"
|
|
|
- :placeholder="i18n.selection"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.name"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.name"
|
|
|
- :placeholder="i18n.goods"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
+ <view class="page">
|
|
|
+ <view class="content">
|
|
|
+ <view class="title">
|
|
|
+ <text class="title-left">{{ i18n.contacts }}</text>
|
|
|
+ </view>
|
|
|
+ <!-- 注意，如果需要兼容微信小程序，最好通过setRules方法设置rules规则 -->
|
|
|
+ <u--form labelPosition="left" :model="model1" ref="uForm">
|
|
|
+ <u-form-item labelWidth="150rpx" @click="showDialog = true" :label="i18n.country" borderBottom
|
|
|
+ ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.country" disabled disabledColor="#ffffff"
|
|
|
+ :placeholder="i18n.selection" border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.name" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.name" :placeholder="i18n.goods" border="none"></u--input>
|
|
|
+ </u-form-item>
|
|
|
+<!--
|
|
|
+ <view class="item u-flex ">
|
|
|
+ <text class="left">{{i18n.phone}}</text>
|
|
|
+ <view class="right" style="display: flex;">
|
|
|
+ <input style="width: 100rpx;" type="text" placeholder="(+86)"
|
|
|
+ v-model="model1.userInfo.phonecode" />
|
|
|
+ <text style="margin-right: 20rpx;">-</text>
|
|
|
+ <u--input v-model="model1.userInfo.phone" :placeholder="i18n.pleasePhone"
|
|
|
+ border="none"></u--input>
|
|
|
+ </view>
|
|
|
+ </view> -->
|
|
|
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.phone"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.phone"
|
|
|
- :placeholder="i18n.pleasePhoneNumber"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.postalCode"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.zip_code"
|
|
|
- :placeholder="i18n.PleacePostalCode"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.city"
|
|
|
- borderBottom
|
|
|
- @click="openCity"
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.city"
|
|
|
- disabled
|
|
|
- disabledColor="#ffffff"
|
|
|
- :placeholder="i18n.township"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
- </u-form-item>
|
|
|
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.detailed"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.detailed"
|
|
|
- :placeholder="i18n.sect"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.phone" borderBottom ref="item1">
|
|
|
+<!-- <u--input v-model="model1.userInfo.phone" :placeholder="i18n.pleasePhoneNumber"
|
|
|
+ border="none"></u--input> -->
|
|
|
+ <view class="right" style="display: flex;">
|
|
|
+ <input style="width: 100rpx;" type="text" placeholder="(+86)"
|
|
|
+ v-model="model1.userInfo.phonecode" />
|
|
|
+ <!-- <u--input style="width: 100rpx;" v-model="model1.userInfo.phonecode" placeholder="(+86)" border="none"></u--input> -->
|
|
|
+ <text style="margin-right: 20rpx;">-</text>
|
|
|
+ <u--input v-model="model1.userInfo.phone" :placeholder="i18n.pleasePhone"
|
|
|
+ border="none"></u--input>
|
|
|
+ </view>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.postalCode" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.zip_code" :placeholder="i18n.PleacePostalCode"
|
|
|
+ border="none"></u--input>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.city" borderBottom @click="openCity" ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.city" disabled disabledColor="#ffffff"
|
|
|
+ :placeholder="i18n.township" border="none"></u--input>
|
|
|
+ <u-icon slot="right" name="arrow-right"></u-icon>
|
|
|
+ </u-form-item>
|
|
|
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.companyName"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.companyName"
|
|
|
- :placeholder="i18n.company"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- <u-form-item
|
|
|
- labelWidth="150rpx"
|
|
|
- :label="i18n.email"
|
|
|
- borderBottom
|
|
|
- ref="item1"
|
|
|
- >
|
|
|
- <u--input
|
|
|
- v-model="model1.userInfo.email"
|
|
|
- :placeholder="i18n.pleaseEmail"
|
|
|
- border="none"
|
|
|
- ></u--input>
|
|
|
- </u-form-item>
|
|
|
- <view
|
|
|
- style="
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.detailed" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.detailed" :placeholder="i18n.sect" border="none"></u--input>
|
|
|
+ </u-form-item>
|
|
|
+
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.companyName" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.companyName" :placeholder="i18n.company"
|
|
|
+ border="none"></u--input>
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item labelWidth="150rpx" :label="i18n.email" borderBottom ref="item1">
|
|
|
+ <u--input v-model="model1.userInfo.email" :placeholder="i18n.pleaseEmail" border="none"></u--input>
|
|
|
+ </u-form-item>
|
|
|
+ <view style="
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
- "
|
|
|
- >
|
|
|
- <view class="item-left">
|
|
|
- <image
|
|
|
- src="../../static/mine/330.png"
|
|
|
- class="address-icon"
|
|
|
- mode=""
|
|
|
- ></image>
|
|
|
- <text>{{ i18n.addressBook }}</text>
|
|
|
- </view>
|
|
|
- <text style="font-size: 24rpx; color: #333" @click="empty">{{
|
|
|
+ ">
|
|
|
+ <view class="item-left">
|
|
|
+ <image src="../../static/mine/330.png" class="address-icon" mode=""></image>
|
|
|
+ <text>{{ i18n.addressBook }}</text>
|
|
|
+ </view>
|
|
|
+ <text style="font-size: 24rpx; color: #333" @click="empty">{{
|
|
|
i18n.empty
|
|
|
}}</text>
|
|
|
- </view>
|
|
|
- </u--form>
|
|
|
- </view>
|
|
|
- <!-- <SelectCity :show="show" @close="close" :countryId="country.id" /> -->
|
|
|
- <view class="footer">
|
|
|
- <button class="save" @click="submit">{{ i18n.preserve }}</button>
|
|
|
- </view>
|
|
|
+ </view>
|
|
|
+ </u--form>
|
|
|
+ </view>
|
|
|
+ <!-- <SelectCity :show="show" @close="close" :countryId="country.id" /> -->
|
|
|
+ <view class="footer">
|
|
|
+ <button class="save" @click="submit">{{ i18n.preserve }}</button>
|
|
|
+ </view>
|
|
|
|
|
|
- <u-picker
|
|
|
- :show="show"
|
|
|
- :columns="cityList"
|
|
|
- keyName="name"
|
|
|
- @confirm="countrycConfirm"
|
|
|
- @cancel="show = false"
|
|
|
- :closeOnClickOverlay="true"
|
|
|
- @close="close"
|
|
|
- ></u-picker>
|
|
|
- <u-picker
|
|
|
- :show="showDialog"
|
|
|
- :columns="columns"
|
|
|
- keyName="name"
|
|
|
- @cancel="showDialog = false"
|
|
|
- :closeOnClickOverlay="true"
|
|
|
- @confirm="confirm"
|
|
|
- @close="close"
|
|
|
- ></u-picker>
|
|
|
- </view>
|
|
|
+ <u-picker :show="show" :columns="cityList" keyName="name" @confirm="countrycConfirm" @cancel="show = false"
|
|
|
+ :closeOnClickOverlay="true" @close="close"></u-picker>
|
|
|
+ <u-picker :show="showDialog" :columns="columns" keyName="name" @cancel="showDialog = false"
|
|
|
+ :closeOnClickOverlay="true" @confirm="confirm" @close="close"></u-picker>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import SelectCity from "../addEditAddress/component/selectCity.vue";
|
|
|
-export default {
|
|
|
- components: {
|
|
|
- SelectCity,
|
|
|
- },
|
|
|
- computed: {
|
|
|
- i18n() {
|
|
|
- return this.$t("index");
|
|
|
- },
|
|
|
- },
|
|
|
- data() {
|
|
|
- return {
|
|
|
- show: false, //城市弹窗
|
|
|
- showDialog: false, //国家弹窗
|
|
|
- //表单数据
|
|
|
- model1: {
|
|
|
- userInfo: {
|
|
|
- name: "",
|
|
|
- phone: "",
|
|
|
- country: "",
|
|
|
- postalCode: "",
|
|
|
- city: "",
|
|
|
- detailed: "",
|
|
|
- email: "",
|
|
|
- companyName: "",
|
|
|
- zip_code: "",
|
|
|
- },
|
|
|
- },
|
|
|
- selectedCity: {}, //选中的城市
|
|
|
- columns: [], //获取到的国家数据
|
|
|
- country: {}, //选中的国家数据
|
|
|
- cityList: [[]], //选中国家之后的城市数据
|
|
|
- addressId: "", //编辑的地址id
|
|
|
- rules: {
|
|
|
- "userInfo.name": {
|
|
|
- type: "string",
|
|
|
- required: true,
|
|
|
- message: "请填写姓名",
|
|
|
- trigger: ["blur", "change"],
|
|
|
- },
|
|
|
- "userInfo.sex": {
|
|
|
- type: "string",
|
|
|
- max: 1,
|
|
|
- required: true,
|
|
|
- message: "请选择男或女",
|
|
|
- trigger: ["blur", "change"],
|
|
|
- },
|
|
|
- },
|
|
|
- };
|
|
|
- },
|
|
|
- onLoad(options) {
|
|
|
- if (options.id) {
|
|
|
- this.addressId = options.id;
|
|
|
- this.getAddressDetail(options.id);
|
|
|
- } else {
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: this.i18n.newAddress,
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- //回显数据
|
|
|
- getAddressDetail(id) {
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: "编辑地址",
|
|
|
- });
|
|
|
- uni.$u.http.get(`/api/address/${id}`).then((res) => {
|
|
|
- this.model1.userInfo.city = res.province_name;
|
|
|
- this.model1.userInfo.name = res.name;
|
|
|
- this.model1.userInfo.phone = res.mobile;
|
|
|
- this.model1.userInfo.detailed = res.address;
|
|
|
- this.model1.userInfo.companyName = res.company_name;
|
|
|
- this.model1.userInfo.is_default = res.is_default;
|
|
|
- this.model1.userInfo.country = res.country_name;
|
|
|
- this.model1.userInfo.email = res.email;
|
|
|
- this.country.id = res.country_id;
|
|
|
- this.selectedCity.id = res.province_id;
|
|
|
- this.model1.userInfo.zip_code = res.zip_code;
|
|
|
- });
|
|
|
- },
|
|
|
+ import SelectCity from "../addEditAddress/component/selectCity.vue";
|
|
|
+ export default {
|
|
|
+ components: {
|
|
|
+ SelectCity,
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ i18n() {
|
|
|
+ return this.$t("index");
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ show: false, //城市弹窗
|
|
|
+ showDialog: false, //国家弹窗
|
|
|
+ //表单数据
|
|
|
+ model1: {
|
|
|
+ userInfo: {
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ country: "",
|
|
|
+ postalCode: "",
|
|
|
+ city: "",
|
|
|
+ detailed: "",
|
|
|
+ email: "",
|
|
|
+ companyName: "",
|
|
|
+ zip_code: "",
|
|
|
+ },
|
|
|
+ },
|
|
|
+ selectedCity: {}, //选中的城市
|
|
|
+ columns: [], //获取到的国家数据
|
|
|
+ country: {}, //选中的国家数据
|
|
|
+ cityList: [
|
|
|
+ []
|
|
|
+ ], //选中国家之后的城市数据
|
|
|
+ addressId: "", //编辑的地址id
|
|
|
+ rules: {
|
|
|
+ "userInfo.name": {
|
|
|
+ type: "string",
|
|
|
+ required: true,
|
|
|
+ message: "请填写姓名",
|
|
|
+ trigger: ["blur", "change"],
|
|
|
+ },
|
|
|
+ "userInfo.sex": {
|
|
|
+ type: "string",
|
|
|
+ max: 1,
|
|
|
+ required: true,
|
|
|
+ message: "请选择男或女",
|
|
|
+ trigger: ["blur", "change"],
|
|
|
+ },
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(options) {
|
|
|
+ if (options.id) {
|
|
|
+ this.addressId = options.id;
|
|
|
+ this.getAddressDetail(options.id);
|
|
|
+ } else {
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: this.i18n.newAddress,
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ //回显数据
|
|
|
+ getAddressDetail(id) {
|
|
|
+ uni.setNavigationBarTitle({
|
|
|
+ title: "编辑地址",
|
|
|
+ });
|
|
|
+ uni.$u.http.get(`/api/address/${id}`).then((res) => {
|
|
|
+ this.model1.userInfo.city = res.province_name;
|
|
|
+ this.model1.userInfo.name = res.name;
|
|
|
+ this.model1.userInfo.phone = res.mobile;
|
|
|
+ this.model1.userInfo.detailed = res.address;
|
|
|
+ this.model1.userInfo.companyName = res.company_name;
|
|
|
+ this.model1.userInfo.is_default = res.is_default;
|
|
|
+ this.model1.userInfo.country = res.country_name;
|
|
|
+ this.model1.userInfo.email = res.email;
|
|
|
+ this.country.id = res.country_id;
|
|
|
+ this.selectedCity.id = res.province_id;
|
|
|
+ this.model1.userInfo.zip_code = res.zip_code;
|
|
|
+ this.model1.userInfo.phonecode = res.global_roaming;
|
|
|
+ });
|
|
|
+ },
|
|
|
|
|
|
- //清空输入
|
|
|
- empty() {
|
|
|
- this.model1.userInfo = {
|
|
|
- name: "",
|
|
|
- phone: "",
|
|
|
- country: "",
|
|
|
- postalCode: "",
|
|
|
- city: "",
|
|
|
- detailed: "",
|
|
|
- email: "",
|
|
|
- companyName: "",
|
|
|
- zip_code: "",
|
|
|
- };
|
|
|
- },
|
|
|
- //选择国家
|
|
|
- confirm(e) {
|
|
|
- this.country = e.value[0];
|
|
|
- this.model1.userInfo.country = this.country.name;
|
|
|
- this.getCityList(this.country.id);
|
|
|
- this.showDialog = false;
|
|
|
- },
|
|
|
- //打开选择城市的弹窗
|
|
|
- openCity() {
|
|
|
- //判断是否选择国家
|
|
|
- if (JSON.stringify(this.country) != "{}") {
|
|
|
- //判断选中的国家有没有城市数据
|
|
|
- if (this.cityList[0].length > 0) {
|
|
|
- this.show = true;
|
|
|
- } else {
|
|
|
- uni.$u.toast("该国家没有城市数据，请直接填写详细地址");
|
|
|
- }
|
|
|
- } else {
|
|
|
- uni.$u.toast("请先选择国家");
|
|
|
- }
|
|
|
- },
|
|
|
- //选择国家
|
|
|
- countrycConfirm(e) {
|
|
|
- this.selectedCity = e.value[0];
|
|
|
- this.model1.userInfo.city = this.selectedCity.name;
|
|
|
- this.show = false;
|
|
|
- },
|
|
|
- submit() {
|
|
|
- const obj = {
|
|
|
- mobile: this.model1.userInfo.phone,
|
|
|
- name: this.model1.userInfo.name,
|
|
|
- country_id: this.country.id,
|
|
|
- province_id: this.selectedCity.id,
|
|
|
- address: this.model1.userInfo.detailed,
|
|
|
- company_name: this.model1.userInfo.companyName,
|
|
|
- email: this.model1.userInfo.email,
|
|
|
- zip_code: this.model1.userInfo.zip_code,
|
|
|
- };
|
|
|
- if (this.addressId) {
|
|
|
- uni.$u.http.put(`/api/address/${this.addressId}`, obj).then((res) => {
|
|
|
- uni.navigateBack({
|
|
|
- delta: 1,
|
|
|
- });
|
|
|
- });
|
|
|
- } else {
|
|
|
- uni.$u.http.post(`/api/address`, obj).then((res) => {
|
|
|
- uni.navigateBack({
|
|
|
- delta: 1,
|
|
|
- });
|
|
|
- });
|
|
|
- }
|
|
|
- },
|
|
|
- //关闭弹窗
|
|
|
- close() {
|
|
|
- this.show = false;
|
|
|
- this.showDialog = false;
|
|
|
- },
|
|
|
- // 获取所有国家
|
|
|
- getCountryList() {
|
|
|
- uni.$u.http.get(`/api/area?is_domestic=0&pid=`).then((res) => {
|
|
|
- this.columns = [res];
|
|
|
- });
|
|
|
- },
|
|
|
- // getCountryList() {
|
|
|
- // uni.$u.http.get(`/api/container/country`).then((res) => {
|
|
|
- // this.columns = [res];
|
|
|
- // });
|
|
|
- // },
|
|
|
- //根据国家获取城市
|
|
|
- getCityList(num) {
|
|
|
- uni.$u.http.get(`/api/area/tree?pid=${num}`).then((res) => {
|
|
|
- this.cityList = [res];
|
|
|
- });
|
|
|
- },
|
|
|
- },
|
|
|
- mounted() {
|
|
|
- this.getCountryList();
|
|
|
- },
|
|
|
- onReady() {
|
|
|
- //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
|
|
- this.$refs.uForm.setRules(this.rules);
|
|
|
- },
|
|
|
-};
|
|
|
+ //清空输入
|
|
|
+ empty() {
|
|
|
+ this.model1.userInfo = {
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ country: "",
|
|
|
+ postalCode: "",
|
|
|
+ city: "",
|
|
|
+ detailed: "",
|
|
|
+ email: "",
|
|
|
+ companyName: "",
|
|
|
+ zip_code: "",
|
|
|
+ phonecode:'',
|
|
|
+ };
|
|
|
+ },
|
|
|
+ //选择国家
|
|
|
+ confirm(e) {
|
|
|
+ this.country = e.value[0];
|
|
|
+ this.model1.userInfo.country = this.country.name;
|
|
|
+ this.getCityList(this.country.id);
|
|
|
+ this.showDialog = false;
|
|
|
+ },
|
|
|
+ //打开选择城市的弹窗
|
|
|
+ openCity() {
|
|
|
+ //判断是否选择国家
|
|
|
+ if (JSON.stringify(this.country) != "{}") {
|
|
|
+ //判断选中的国家有没有城市数据
|
|
|
+ if (this.cityList[0].length > 0) {
|
|
|
+ this.show = true;
|
|
|
+ } else {
|
|
|
+ uni.$u.toast("该国家没有城市数据，请直接填写详细地址");
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ uni.$u.toast("请先选择国家");
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //选择国家
|
|
|
+ countrycConfirm(e) {
|
|
|
+ this.selectedCity = e.value[0];
|
|
|
+ this.model1.userInfo.city = this.selectedCity.name;
|
|
|
+ this.show = false;
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ const obj = {
|
|
|
+ mobile: this.model1.userInfo.phone,
|
|
|
+ name: this.model1.userInfo.name,
|
|
|
+ country_id: this.country.id,
|
|
|
+ province_id: this.selectedCity.id,
|
|
|
+ address: this.model1.userInfo.detailed,
|
|
|
+ company_name: this.model1.userInfo.companyName,
|
|
|
+ email: this.model1.userInfo.email,
|
|
|
+ zip_code: this.model1.userInfo.zip_code,
|
|
|
+ global_roaming: this.model1.userInfo.phonecode,
|
|
|
+ };
|
|
|
+ if (this.addressId) {
|
|
|
+ uni.$u.http.put(`/api/address/${this.addressId}`, obj).then((res) => {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ uni.$u.http.post(`/api/address`, obj).then((res) => {
|
|
|
+ uni.navigateBack({
|
|
|
+ delta: 1,
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //关闭弹窗
|
|
|
+ close() {
|
|
|
+ this.show = false;
|
|
|
+ this.showDialog = false;
|
|
|
+ },
|
|
|
+ // 获取所有国家
|
|
|
+ getCountryList() {
|
|
|
+ uni.$u.http.get(`/api/area?is_domestic=0&pid=`).then((res) => {
|
|
|
+ this.columns = [res];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // getCountryList() {
|
|
|
+ // uni.$u.http.get(`/api/container/country`).then((res) => {
|
|
|
+ // this.columns = [res];
|
|
|
+ // });
|
|
|
+ // },
|
|
|
+ //根据国家获取城市
|
|
|
+ getCityList(num) {
|
|
|
+ uni.$u.http.get(`/api/area/tree?pid=${num}`).then((res) => {
|
|
|
+ this.cityList = [res];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.getCountryList();
|
|
|
+ },
|
|
|
+ onReady() {
|
|
|
+ //如果需要兼容微信小程序，并且校验规则中含有方法等，只能通过setRules方法设置规则。
|
|
|
+ this.$refs.uForm.setRules(this.rules);
|
|
|
+ },
|
|
|
+ };
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
-.page {
|
|
|
- padding: 20rpx 24rpx;
|
|
|
+ .page {
|
|
|
+ padding: 20rpx 24rpx;
|
|
|
|
|
|
- .content {
|
|
|
- background-color: #fff;
|
|
|
- border-radius: 16rpx;
|
|
|
- padding: 0 24rpx;
|
|
|
+ .content {
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 16rpx;
|
|
|
+ padding: 0 24rpx;
|
|
|
|
|
|
- .title {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- height: 100rpx;
|
|
|
- border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
|
|
|
+ .title {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ height: 100rpx;
|
|
|
+ border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
|
|
|
|
|
|
- .title-left {
|
|
|
- font-size: 32rpx;
|
|
|
- color: #333;
|
|
|
- font-weight: 600;
|
|
|
- }
|
|
|
+ .title-left {
|
|
|
+ font-size: 32rpx;
|
|
|
+ color: #333;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
|
|
|
- .title-icon {
|
|
|
- width: 26rpx;
|
|
|
- height: 26rpx;
|
|
|
- margin-right: 10rpx;
|
|
|
- }
|
|
|
+ .title-icon {
|
|
|
+ width: 26rpx;
|
|
|
+ height: 26rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
|
|
|
- .title-right {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- font-size: 24rpx;
|
|
|
- color: rgba(51, 51, 51, 0.6);
|
|
|
- }
|
|
|
- }
|
|
|
+ .title-right {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: rgba(51, 51, 51, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .company {
|
|
|
- height: 102rpx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
|
|
|
- }
|
|
|
- }
|
|
|
+ .company {
|
|
|
+ height: 102rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 2rpx solid rgba(151, 151, 151, 0.1);
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .item-left {
|
|
|
- font-size: 24rpx;
|
|
|
- color: #333;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- height: 86rpx;
|
|
|
+ .item-left {
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #333;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ height: 86rpx;
|
|
|
|
|
|
- .address-icon {
|
|
|
- width: 26rpx;
|
|
|
- height: 26rpx;
|
|
|
- margin-right: 10rpx;
|
|
|
- }
|
|
|
- }
|
|
|
+ .address-icon {
|
|
|
+ width: 26rpx;
|
|
|
+ height: 26rpx;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .footer {
|
|
|
- background-color: #fff;
|
|
|
- position: fixed;
|
|
|
- bottom: 0;
|
|
|
- height: 146rpx;
|
|
|
- width: 750rpx;
|
|
|
- left: 0;
|
|
|
- padding-top: 20rpx;
|
|
|
+ .footer {
|
|
|
+ background-color: #fff;
|
|
|
+ position: fixed;
|
|
|
+ bottom: 0;
|
|
|
+ height: 146rpx;
|
|
|
+ width: 750rpx;
|
|
|
+ left: 0;
|
|
|
+ padding-top: 20rpx;
|
|
|
|
|
|
- .save {
|
|
|
- width: 702rpx;
|
|
|
- margin: 0 auto;
|
|
|
- background-color: #f83224;
|
|
|
- color: #fff;
|
|
|
- border-radius: 40rpx;
|
|
|
- }
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
|
|
+ .save {
|
|
|
+ width: 702rpx;
|
|
|
+ margin: 0 auto;
|
|
|
+ background-color: #f83224;
|
|
|
+ color: #fff;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
zhaogongxue