|
@@ -25,20 +25,18 @@
|
|
|
</div>
|
|
|
<div class="userInfoBox">
|
|
|
<!-- 地区 -->
|
|
|
- <div v-if="isInland && user.type != '0'">
|
|
|
+ <div v-if="user.type == '2'">
|
|
|
<div v-if="!areaShow" class="userInfo l-flex-between">
|
|
|
<span class="userInfoLeft">{{ $t("user.region") }}: </span>
|
|
|
<div class="cust_vantBorder">
|
|
|
<div class="filedInpPad">
|
|
|
- <van-field @click-input="fieldValueInpClk" readonly clearable v-model="fieldValue"
|
|
|
+ <van-field @click-input="clickShowArea" readonly clearable v-model="fieldValue"
|
|
|
:placeholder="$t('user.regionPlace')">
|
|
|
<template #right-icon>
|
|
|
<div class="l-flex-RC">
|
|
|
- <van-icon v-if="fieldValue" @click="
|
|
|
- fieldValue = '';
|
|
|
- accountDetail.areaId = '';
|
|
|
+ <van-icon v-if="fieldValue" @click="fieldValue = ''; accountDetail.areaId = '';
|
|
|
" class="o-mr-6" name="clear" />
|
|
|
- <van-icon @click="fieldValueInpClk" name="arrow-down" />
|
|
|
+ <van-icon @click="clickShowArea" name="arrow-down" />
|
|
|
</div>
|
|
|
</template>
|
|
|
</van-field>
|
|
@@ -174,7 +172,7 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<!-- 设备上下线提醒 -->
|
|
|
- <div v-if="isInWeChat && user.type == '2'" class="userInfo l-flex-RC">
|
|
|
+ <div v-if="(isInWeChat || user.ifForeign === '1') && user.type == '2'" class="userInfo l-flex-RC">
|
|
|
<span class="userInfoLeft l-flex-RC">{{ $t("user.onOffNotice") }}: </span>
|
|
|
<div class="cust_vantBorder">
|
|
|
<van-switch :model-value="onOffNotice" active-color="#0090fa" style="font-size: 18px;"
|
|
@@ -255,17 +253,32 @@
|
|
|
@confirmclk="confirmClk">
|
|
|
</kDialog>
|
|
|
<!-- 地区弹窗 -->
|
|
|
- <kCascader @getareaname="getAreaName" :selectId="accountDetail.areaId" @areapopfinish="areaPopFinish"
|
|
|
- ref="kCascaderRef"></kCascader>
|
|
|
+ <!-- <kCascader @getareaname="getAreaName" :selectId="accountDetail.areaId" @areapopfinish="areaPopFinish"
|
|
|
+ ref="kCascaderRef"></kCascader> -->
|
|
|
<!-- 时区弹窗 -->
|
|
|
<kTimezone @gettimezone="getTimezone" :selectId="accountDetail.timezone" @timezonepopfinish="timezonePopFinish"
|
|
|
ref="kTimezoneRef"></kTimezone>
|
|
|
+ <!-- 省市选择弹窗 -->
|
|
|
+ <van-popup v-model:show="showArea" position="bottom">
|
|
|
+ <van-cascader :title="$t('register.areaRequired')" :options="areaOptions" @close="showArea = false"
|
|
|
+ @finish="onConfirmArea" />
|
|
|
+ </van-popup>
|
|
|
+ <!-- 国家选择弹窗 -->
|
|
|
+ <van-popup v-model:show="showCountry" round position="bottom">
|
|
|
+ <van-cascader :title="$t('register.chooseCountryCity')" :options="countryOptions" @close="showCountry = false"
|
|
|
+ @finish="onConfirmCountry">
|
|
|
+ <template #options-top="{ tabIndex }">
|
|
|
+ <van-search v-if="tabIndex === 0" v-model="searchValue" class="searchCity"
|
|
|
+ :placeholder="$t('kSelectPop.searchKey')" @update:model-value="valueChange(tabIndex)" />
|
|
|
+ </template>
|
|
|
+ </van-cascader>
|
|
|
+ </van-popup>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
// 导入地区弹窗
|
|
|
-import kCascader from "@/components/commom/kCascader/index.vue";
|
|
|
+// import kCascader from "@/components/commom/kCascader/index.vue";
|
|
|
// 导入时区弹窗
|
|
|
import kTimezone from "@/components/commom/kTimezone/index.vue";
|
|
|
// 导入接口
|
|
@@ -276,19 +289,24 @@ import kDialog from "@/components/commom/kDialog/index.vue";
|
|
|
import { onMounted, reactive, ref } from "vue";
|
|
|
import sHeader from "@/components/SimpleHeader";
|
|
|
import {
|
|
|
+ getLocal,
|
|
|
getLoginUser,
|
|
|
$M_EmailAvailable,
|
|
|
$M_PhoneTest,
|
|
|
} from "@/common/js/utils";
|
|
|
import { useRouter } from "vue-router";
|
|
|
-import { tAdminGetRelation, updatePayPlatform, updateOrderNotice, updateOnOffNotice } from "@/service/user";
|
|
|
+import { tAdminGetRelation, updatePayPlatform, updateOrderNotice, updateOnOffNotice, getAreaById, updateArea, getCitiesById } from "@/service/user";
|
|
|
import { showFailToast, showToast, showSuccessToast, showConfirmDialog } from 'vant';
|
|
|
import { useI18n } from "vue-i18n";
|
|
|
import { styleUrl } from "../common/js/utils";
|
|
|
+import { countriesData } from '@/common/js/countries';
|
|
|
+import { countriesDataEn } from '@/common/js/countries-en';
|
|
|
+import { useCascaderAreaData } from '@vant/area-data';
|
|
|
|
|
|
export default {
|
|
|
- components: { sHeader, kDialog, kCascader, kTimezone },
|
|
|
+ components: { sHeader, kDialog, kTimezone },
|
|
|
setup() {
|
|
|
+ let languageName = ref(getLocal("curLang"));
|
|
|
// 引入语言
|
|
|
const { t } = useI18n();
|
|
|
// 账户信息
|
|
@@ -311,6 +329,21 @@ export default {
|
|
|
const orderNotice = ref(false);
|
|
|
// 设备上/离线通知开关状态
|
|
|
const onOffNotice = ref(false);
|
|
|
+ // 弹窗省市
|
|
|
+ const showArea = ref(false);
|
|
|
+ const areaOptions = ref();
|
|
|
+ // 弹窗国家
|
|
|
+ const showCountry = ref(false);
|
|
|
+ const countryOptions = ref(languageName.value == 'zh' ? countriesData : countriesDataEn);
|
|
|
+
|
|
|
+ // 弹窗控制
|
|
|
+ const clickShowArea = () => {
|
|
|
+ if (user.ifForeign == 0) {
|
|
|
+ showArea.value = true;
|
|
|
+ } else {
|
|
|
+ showCountry.value = true;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
const sunzeePay = ref(false);
|
|
|
const sevencloudPay = ref(false);
|
|
@@ -397,23 +430,6 @@ export default {
|
|
|
// 点击邮箱的确定按钮
|
|
|
const mailboxChg = async (e, idx) => {
|
|
|
switch (idx) {
|
|
|
- // case 1:
|
|
|
- // if (!e) {
|
|
|
- // showToast(t("user.associateParentPlace"));
|
|
|
- // } else {
|
|
|
- // const { data } = await tAdminSetRelationAdmin({
|
|
|
- // adminId: user.id,
|
|
|
- // username: e,
|
|
|
- // });
|
|
|
- // relationType.value = true;
|
|
|
- // if (data.code === "00000") {
|
|
|
- // showToast(data.message);
|
|
|
- // setTimeout(() => {
|
|
|
- // gettAdminGetRelation();
|
|
|
- // }, 500);
|
|
|
- // }
|
|
|
- // }
|
|
|
- // break;
|
|
|
case 2:
|
|
|
if (!e) {
|
|
|
showToast(t("user.mailboxPlace"));
|
|
@@ -477,18 +493,27 @@ export default {
|
|
|
break;
|
|
|
}
|
|
|
};
|
|
|
+ // 地区ID
|
|
|
+ const areaId = ref(null);
|
|
|
// 获取账户详情
|
|
|
- const getAcccountDetail = () => {
|
|
|
+ const getAcccountDetail = async () => {
|
|
|
getAdmin({ id: user.id }).then((res) => {
|
|
|
accountDetail.value = res.data.data;
|
|
|
- // 查询地址回显
|
|
|
+ if (accountDetail.value.areaId != null && accountDetail.value.type == 2) {
|
|
|
+ areaId.value = accountDetail.value.areaId;
|
|
|
+ // 查询地址回显
|
|
|
+ if (accountDetail.value.ifForeign == "0") {
|
|
|
+ getArea();
|
|
|
+ } else {
|
|
|
+ getCities();
|
|
|
+ }
|
|
|
+ }
|
|
|
if (accountDetail.value.orderNotice == "1") {
|
|
|
orderNotice.value = true;
|
|
|
}
|
|
|
if (accountDetail.value.onOffNotice == "1") {
|
|
|
onOffNotice.value = true;
|
|
|
}
|
|
|
- kCascaderRef.value.init(accountDetail.value.areaId);
|
|
|
// 查询时区回显
|
|
|
kTimezoneRef.value.init(accountDetail.value.timeZone)
|
|
|
});
|
|
@@ -500,7 +525,6 @@ export default {
|
|
|
if (res.data.data.payPlatform == '1') {
|
|
|
sunzeePay.value = true;
|
|
|
}
|
|
|
- console.log("sunzeePay", sunzeePay.value)
|
|
|
});
|
|
|
};
|
|
|
// 获取七云支付平台
|
|
@@ -510,7 +534,6 @@ export default {
|
|
|
if (res.data.data.payPlatform == '1') {
|
|
|
sevencloudPay.value = true;
|
|
|
}
|
|
|
- console.log("sevencloudPay", sevencloudPay.value)
|
|
|
});
|
|
|
};
|
|
|
// 退出登录弹窗
|
|
@@ -545,8 +568,6 @@ export default {
|
|
|
title: t('user.tips'),
|
|
|
message: t('user.changeTips'),
|
|
|
}).then(() => {
|
|
|
- // checked.value = newValue;
|
|
|
- console.log(value);
|
|
|
params.id = 2738;
|
|
|
if (value) {
|
|
|
params.payPlatform = '1';
|
|
@@ -570,8 +591,6 @@ export default {
|
|
|
title: t('user.tips'),
|
|
|
message: t('user.changeTips'),
|
|
|
}).then(() => {
|
|
|
- // checked.value = newValue;
|
|
|
- console.log(value);
|
|
|
params.id = 2739;
|
|
|
if (value) {
|
|
|
params.payPlatform = '1';
|
|
@@ -657,6 +676,18 @@ export default {
|
|
|
getSunzeeDetail();
|
|
|
getSevenCloudDetail();
|
|
|
}
|
|
|
+ // 省市选择器
|
|
|
+ const areaData = useCascaderAreaData();
|
|
|
+ areaData.forEach(province => {
|
|
|
+ province.children.forEach(city => {
|
|
|
+ // 删除城市中的区级信息
|
|
|
+ delete city.children;
|
|
|
+ });
|
|
|
+ });
|
|
|
+ // 删除台湾、澳门和香港
|
|
|
+ const provincesToRemove = ['710000', '810000', '820000'];
|
|
|
+ areaOptions.value = areaData.filter(province => !provincesToRemove.includes(province.value));
|
|
|
+
|
|
|
});
|
|
|
const gettAdminGetRelation = async () => {
|
|
|
const { data } = await tAdminGetRelation({
|
|
@@ -711,30 +742,100 @@ export default {
|
|
|
return menuList.length > 0;
|
|
|
}
|
|
|
};
|
|
|
+ // 获取地区
|
|
|
+ const fullName = ref("");
|
|
|
+ const name = ref("");
|
|
|
+ // 国内省市
|
|
|
+ const getArea = async () => {
|
|
|
+ const { data } = await getAreaById({
|
|
|
+ areaId: areaId.value,
|
|
|
+ });
|
|
|
+ if (data.code === "00000") {
|
|
|
+ fullName.value = data.data.fullName;
|
|
|
+ name.value = data.data.name;
|
|
|
+ if (fullName.value != name.value) {
|
|
|
+ fullName.value = fullName.value.replace(name.value, "").trim();
|
|
|
+ fullName.value = fullName.value + "/" + name.value;
|
|
|
+ }
|
|
|
+ fieldValue.value = fullName.value;
|
|
|
+ }
|
|
|
+ };
|
|
|
+ const countryValue = ref("");
|
|
|
+ const cityValue = ref("");
|
|
|
+ // 国外城市
|
|
|
+ const getCities = async () => {
|
|
|
+ const { data } = await getCitiesById({
|
|
|
+ areaId: areaId.value,
|
|
|
+ });
|
|
|
+ if (data.data != "") {
|
|
|
+ const citiesCode = data.data.split('/')[0];
|
|
|
+ const countriesCode = data.data.split('/')[1];
|
|
|
+ countryOptions.value.find(item => {
|
|
|
+ if (item.value === countriesCode) {
|
|
|
+ countryValue.value = item.text;
|
|
|
+ item.children.find(item => {
|
|
|
+ if (item.value === citiesCode) {
|
|
|
+ cityValue.value = item.text;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ if (countryValue.value == cityValue.value) {
|
|
|
+ fieldValue.value = cityValue.value;
|
|
|
+ } else {
|
|
|
+ fieldValue.value = countryValue.value + "/" + cityValue.value;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ };
|
|
|
// 地区弹窗
|
|
|
const fieldValue = ref("");
|
|
|
- const kCascaderRef = ref(null);
|
|
|
- // 点击地区输入框
|
|
|
- const fieldValueInpClk = () => {
|
|
|
- kCascaderRef.value.openPop();
|
|
|
- };
|
|
|
- // 选择地区完成
|
|
|
- const areaPopFinish = async (e) => {
|
|
|
- console.log("e", e);
|
|
|
- fieldValue.value = e.selectName;
|
|
|
- accountDetail.value.areaId = e.selectId;
|
|
|
+ // 地区参数值
|
|
|
+ const areaValue = ref('');
|
|
|
+ const onConfirmArea = async ({ selectedOptions }) => {
|
|
|
+ if (selectedOptions[0]?.text == selectedOptions[1]?.text) {
|
|
|
+ fieldValue.value = selectedOptions[0]?.text;
|
|
|
+ if (user.ifForeign === "1") {
|
|
|
+ areaValue.value = selectedOptions[1]?.value;
|
|
|
+ } else {
|
|
|
+ areaValue.value = selectedOptions[0]?.text;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ fieldValue.value = selectedOptions[0]?.text + "/" + selectedOptions[1]?.text;
|
|
|
+ if (user.ifForeign === "1") {
|
|
|
+ areaValue.value = selectedOptions[1]?.value;
|
|
|
+ } else {
|
|
|
+ areaValue.value = selectedOptions[0]?.text + selectedOptions[1]?.text;
|
|
|
+ }
|
|
|
+ }
|
|
|
const params = {
|
|
|
- id: user.id,
|
|
|
- areaId: e.selectId,
|
|
|
+ adminId: user.id,
|
|
|
+ areaValue: areaValue.value,
|
|
|
};
|
|
|
- const { data } = await updateAdmin(params);
|
|
|
+ const { data } = await updateArea(params);
|
|
|
+ if (data.code === "00000") {
|
|
|
+ getAcccountDetail();
|
|
|
+ }
|
|
|
+
|
|
|
+ showArea.value = false;
|
|
|
areaShow.value = true;
|
|
|
+ };
|
|
|
+ const onConfirmCountry = async ({ selectedOptions }) => {
|
|
|
+ if (selectedOptions[0]?.text == selectedOptions[1]?.text) {
|
|
|
+ fieldValue.value = selectedOptions[1]?.text;
|
|
|
+ } else {
|
|
|
+ fieldValue.value = selectedOptions.map((option) => option.text).join('/');
|
|
|
+ }
|
|
|
+ areaValue.value = selectedOptions[1]?.value;
|
|
|
+ const params = {
|
|
|
+ adminId: user.id,
|
|
|
+ areaValue: areaValue.value,
|
|
|
+ };
|
|
|
+ const { data } = await updateArea(params);
|
|
|
if (data.code === "00000") {
|
|
|
- showToast(data.message);
|
|
|
- setTimeout(() => {
|
|
|
- getAcccountDetail();
|
|
|
- }, 500);
|
|
|
+ getAcccountDetail();
|
|
|
}
|
|
|
+ showCountry.value = false;
|
|
|
+ areaShow.value = true;
|
|
|
};
|
|
|
// 时区弹窗
|
|
|
const tzFieldValue = ref("");
|
|
@@ -803,14 +904,32 @@ export default {
|
|
|
checkIsAbroad();
|
|
|
haveRelationCheck();
|
|
|
})
|
|
|
- // 获取回显的值
|
|
|
- const getAreaName = (e) => {
|
|
|
- fieldValue.value = e;
|
|
|
- };
|
|
|
// 获取时区回显的值
|
|
|
const getTimezone = (e) => {
|
|
|
tzFieldValue.value = e;
|
|
|
};
|
|
|
+
|
|
|
+
|
|
|
+ // 搜索关键词
|
|
|
+ const searchValue = ref('');
|
|
|
+ const countryData = ref(languageName.value == 'zh' ? countriesData : countriesDataEn);
|
|
|
+ // 搜索数据
|
|
|
+ const valueChange = (index) => {
|
|
|
+ let tempOptions = [];
|
|
|
+ if (searchValue.value) {
|
|
|
+ if (index === 0) {
|
|
|
+ // 国家
|
|
|
+ countryData.value.forEach(item => {
|
|
|
+ if (item.text.includes(searchValue.value)) {
|
|
|
+ tempOptions.push(item);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ countryOptions.value = tempOptions;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ countryOptions.value = countryData.value;
|
|
|
+ }
|
|
|
+ };
|
|
|
return {
|
|
|
user,
|
|
|
operUnipay,
|
|
@@ -833,15 +952,11 @@ export default {
|
|
|
accountDetail,
|
|
|
fieldValue,
|
|
|
tzFieldValue,
|
|
|
- kCascaderRef,
|
|
|
kTimezoneRef,
|
|
|
- fieldValueInpClk,
|
|
|
tzFieldValueInpClk,
|
|
|
- areaPopFinish,
|
|
|
timezonePopFinish,
|
|
|
timezoneShowPicker,
|
|
|
isInWeChat,
|
|
|
- getAreaName,
|
|
|
getTimezone,
|
|
|
isAbroad,
|
|
|
haveRelation,
|
|
@@ -859,6 +974,16 @@ export default {
|
|
|
onOffNotice,
|
|
|
changeOnOffNotice,
|
|
|
timezoneOnConfirm,
|
|
|
+ clickShowArea,
|
|
|
+ showArea,
|
|
|
+ areaOptions,
|
|
|
+ onConfirmArea,
|
|
|
+ showCountry,
|
|
|
+ countryOptions,
|
|
|
+ onConfirmCountry,
|
|
|
+
|
|
|
+ searchValue,
|
|
|
+ valueChange
|
|
|
};
|
|
|
}
|
|
|
};
|