Compare commits
2 Commits
974730d660
...
ace2d675c3
| Author | SHA1 | Date | |
|---|---|---|---|
| ace2d675c3 | |||
| 823dc27462 |
84
f/web-kboss/src/utils/consultDict.js
Normal file
84
f/web-kboss/src/utils/consultDict.js
Normal file
@ -0,0 +1,84 @@
|
||||
export function isEnglishLocale(i18n) {
|
||||
return !!(i18n && i18n.locale === 'en-US')
|
||||
}
|
||||
|
||||
export function getDictLabel(item, isEn) {
|
||||
if (!item) return ''
|
||||
if (isEn) {
|
||||
return item.dict_value_en || item.dict_value_zh || item.dict_value || ''
|
||||
}
|
||||
return item.dict_value_zh || item.dict_value || item.dict_value_en || ''
|
||||
}
|
||||
|
||||
export function extractConsultOptionList(res) {
|
||||
if (res && Array.isArray(res.data)) return res.data
|
||||
if (res && res.data && Array.isArray(res.data.data)) return res.data.data
|
||||
return []
|
||||
}
|
||||
|
||||
export function normalizeDictOptions(list, type) {
|
||||
return list
|
||||
.filter(item => item && item.dict_type === type)
|
||||
.sort((a, b) => Number(a.sort_order || 0) - Number(b.sort_order || 0))
|
||||
.map(item => ({
|
||||
id: String(item.dict_key),
|
||||
nameZh: item.dict_value_zh || item.dict_value || '',
|
||||
nameEn: item.dict_value_en || item.dict_value_zh || item.dict_value || ''
|
||||
}))
|
||||
}
|
||||
|
||||
export function parseDirectionParts(label, isEn) {
|
||||
if (!label) {
|
||||
return { title: '', desc: '' }
|
||||
}
|
||||
|
||||
const text = String(label)
|
||||
if (isEn) {
|
||||
const match = text.match(/^(.+?)\s*\((.+)\)\s*$/)
|
||||
return match
|
||||
? { title: match[1].trim(), desc: match[2].trim() }
|
||||
: { title: text, desc: '' }
|
||||
}
|
||||
|
||||
const match = text.match(/^(.+?)((.+?))$/)
|
||||
return match
|
||||
? { title: match[1].trim(), desc: match[2].trim() }
|
||||
: { title: text, desc: '' }
|
||||
}
|
||||
|
||||
export function normalizeDirectionOptions(list) {
|
||||
return list
|
||||
.filter(item => item && item.dict_type === 'direction')
|
||||
.sort((a, b) => Number(a.sort_order || 0) - Number(b.sort_order || 0))
|
||||
.map(item => {
|
||||
const nameZh = item.dict_value_zh || item.dict_value || ''
|
||||
const nameEn = item.dict_value_en || nameZh
|
||||
const parts = parseDirectionParts(nameZh, false)
|
||||
|
||||
return {
|
||||
id: String(item.dict_key),
|
||||
nameZh,
|
||||
nameEn,
|
||||
titleZh: parts.title,
|
||||
descZh: parts.desc,
|
||||
titleEn: parseDirectionParts(nameEn, true).title,
|
||||
descEn: parseDirectionParts(nameEn, true).desc
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
export function localizeDictOptions(options, isEn) {
|
||||
return (options || []).map(item => ({
|
||||
...item,
|
||||
name: isEn ? item.nameEn : item.nameZh
|
||||
}))
|
||||
}
|
||||
|
||||
export function localizeDirectionOptions(options, isEn) {
|
||||
return (options || []).map(item => ({
|
||||
...item,
|
||||
name: isEn ? item.nameEn : item.nameZh,
|
||||
title: isEn ? item.titleEn : item.titleZh,
|
||||
desc: isEn ? item.descEn : item.descZh
|
||||
}))
|
||||
}
|
||||
@ -63,7 +63,7 @@
|
||||
<el-form-item label="5. 请选择您的企业类型(单选)" prop="enterprise_type">
|
||||
<el-radio-group v-model="formData.enterprise_type" class="option-grid">
|
||||
<el-radio
|
||||
v-for="item in enterpriseOptions"
|
||||
v-for="item in localizedEnterpriseOptions"
|
||||
:key="item.id"
|
||||
:label="String(item.id)"
|
||||
class="option-item"
|
||||
@ -82,7 +82,7 @@
|
||||
class="full-select"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in provinceOptions"
|
||||
v-for="item in localizedProvinceOptions"
|
||||
:key="`region-${item.id}-${item.name}`"
|
||||
:label="item.name"
|
||||
:value="String(item.id)"
|
||||
@ -93,7 +93,7 @@
|
||||
<el-form-item label="7. 您想咨询的方向(可多选)">
|
||||
<el-checkbox-group v-model="formData.consult_direction_list" class="direction-list">
|
||||
<el-checkbox
|
||||
v-for="item in consultDirectionOptions"
|
||||
v-for="item in localizedConsultDirectionOptions"
|
||||
:key="item.id"
|
||||
:label="item.id"
|
||||
class="direction-item"
|
||||
@ -141,6 +141,14 @@
|
||||
|
||||
<script>
|
||||
import { reqConsultForm, reqProductConsult } from '@/api/H5'
|
||||
import {
|
||||
extractConsultOptionList,
|
||||
isEnglishLocale,
|
||||
localizeDictOptions,
|
||||
localizeDirectionOptions,
|
||||
normalizeDictOptions as buildDictOptions,
|
||||
normalizeDirectionOptions as buildDirectionOptions
|
||||
} from '@/utils/consultDict'
|
||||
|
||||
export default {
|
||||
name: 'MobileFullScreenConsultDialog',
|
||||
@ -207,9 +215,21 @@ export default {
|
||||
set(value) {
|
||||
this.$emit('update:visible', value)
|
||||
}
|
||||
},
|
||||
localizedEnterpriseOptions() {
|
||||
return localizeDictOptions(this.enterpriseOptions, isEnglishLocale(this.$i18n))
|
||||
},
|
||||
localizedProvinceOptions() {
|
||||
return localizeDictOptions(this.provinceOptions, isEnglishLocale(this.$i18n))
|
||||
},
|
||||
localizedConsultDirectionOptions() {
|
||||
return localizeDirectionOptions(this.consultDirectionOptions, isEnglishLocale(this.$i18n))
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$i18n.locale'() {
|
||||
this.provinceSelectKey += 1
|
||||
},
|
||||
visible: {
|
||||
immediate: true,
|
||||
handler(newVal) {
|
||||
@ -256,44 +276,15 @@ export default {
|
||||
this.dialogVisible = false
|
||||
this.$emit('close')
|
||||
},
|
||||
normalizeDictOptions(list, type) {
|
||||
return list
|
||||
.filter(item => item && item.dict_type === type)
|
||||
.sort((a, b) => Number(a.sort_order || 0) - Number(b.sort_order || 0))
|
||||
.map(item => ({
|
||||
id: String(item.dict_key),
|
||||
name: item.dict_value
|
||||
}))
|
||||
},
|
||||
normalizeDirectionOptions(list) {
|
||||
return list
|
||||
.filter(item => item && item.dict_type === 'direction')
|
||||
.sort((a, b) => Number(a.sort_order || 0) - Number(b.sort_order || 0))
|
||||
.map(item => {
|
||||
const value = item.dict_value || ''
|
||||
const match = value.match(/^(.+?)((.+?))$/)
|
||||
return {
|
||||
id: String(item.dict_key),
|
||||
name: value,
|
||||
title: match ? match[1] : value,
|
||||
desc: match ? match[2] : ''
|
||||
}
|
||||
})
|
||||
},
|
||||
extractConsultOptionList(res) {
|
||||
if (res && Array.isArray(res.data)) return res.data
|
||||
if (res && res.data && Array.isArray(res.data.data)) return res.data.data
|
||||
return []
|
||||
},
|
||||
async fetchConsultOptions() {
|
||||
try {
|
||||
const res = await reqConsultForm()
|
||||
const list = this.extractConsultOptionList(res)
|
||||
const list = extractConsultOptionList(res)
|
||||
if (!list.length) return
|
||||
|
||||
const enterpriseOptions = this.normalizeDictOptions(list, 'enterprise_type')
|
||||
const provinceOptions = this.normalizeDictOptions(list, 'region')
|
||||
const consultDirectionOptions = this.normalizeDirectionOptions(list)
|
||||
const enterpriseOptions = buildDictOptions(list, 'enterprise_type')
|
||||
const provinceOptions = buildDictOptions(list, 'region')
|
||||
const consultDirectionOptions = buildDirectionOptions(list)
|
||||
|
||||
if (enterpriseOptions.length) this.enterpriseOptions = enterpriseOptions
|
||||
if (provinceOptions.length) {
|
||||
|
||||
@ -42,13 +42,14 @@
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('contactSales.provinceLabel')" prop="region" class="form-item--full">
|
||||
<el-select
|
||||
:key="provinceSelectKey"
|
||||
v-model="addData.region"
|
||||
filterable
|
||||
:placeholder="$t('contactSales.provincePlaceholder')"
|
||||
class="full-select"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in provinceOptions"
|
||||
v-for="item in localizedProvinceOptions"
|
||||
:key="item.id"
|
||||
:label="item.name"
|
||||
:value="item.id"
|
||||
@ -88,6 +89,13 @@ import Vue from 'vue'
|
||||
import { mapState } from 'vuex'
|
||||
import { reqNewHomeConsult } from '@/api/newHome'
|
||||
import { reqConsultForm } from '@/api/H5'
|
||||
import {
|
||||
extractConsultOptionList,
|
||||
isEnglishLocale,
|
||||
localizeDictOptions,
|
||||
localizeDirectionOptions,
|
||||
normalizeDictOptions as buildDictOptions
|
||||
} from '@/utils/consultDict'
|
||||
|
||||
export default Vue.extend({
|
||||
name: 'Talk',
|
||||
@ -129,6 +137,7 @@ export default Vue.extend({
|
||||
dialogVisible: false,
|
||||
enterpriseOptions: [],
|
||||
provinceOptions: [],
|
||||
provinceSelectKey: 0,
|
||||
addData: {
|
||||
content: '', // 需求内容
|
||||
custom_type: '1', // 客户类型 0-个人 1-企业
|
||||
@ -158,13 +167,16 @@ export default Vue.extend({
|
||||
: ''
|
||||
},
|
||||
localizedEnterpriseOptions() {
|
||||
return this.enterpriseOptions.map(item => ({
|
||||
...item,
|
||||
name: this.getEnterpriseOptionName(item.name)
|
||||
}))
|
||||
return localizeDictOptions(this.enterpriseOptions, isEnglishLocale(this.$i18n))
|
||||
},
|
||||
localizedProvinceOptions() {
|
||||
return localizeDictOptions(this.provinceOptions, isEnglishLocale(this.$i18n))
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$i18n.locale'() {
|
||||
this.provinceSelectKey += 1
|
||||
},
|
||||
showTalk: {
|
||||
immediate: true,
|
||||
handler(value) {
|
||||
@ -176,23 +188,6 @@ export default Vue.extend({
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
getEnterpriseOptionName(name) {
|
||||
const map = {
|
||||
大型企业: 'largeEnterprise',
|
||||
中小企业: 'sme',
|
||||
OPC个人: 'opcIndividual',
|
||||
高校科研机构: 'university',
|
||||
高校: 'university',
|
||||
政府: 'government',
|
||||
其他: 'other'
|
||||
}
|
||||
const key = map[name]
|
||||
if (!key) return name
|
||||
|
||||
const i18nKey = `contactSales.enterpriseOptions.${key}`
|
||||
const translated = this.$t(i18nKey)
|
||||
return translated === i18nKey ? name : translated
|
||||
},
|
||||
getDefaultFormData() {
|
||||
return {
|
||||
content: '',
|
||||
@ -205,31 +200,20 @@ export default Vue.extend({
|
||||
region: ''
|
||||
}
|
||||
},
|
||||
normalizeDictOptions(list, type) {
|
||||
return list
|
||||
.filter(item => item && item.dict_type === type)
|
||||
.sort((a, b) => Number(a.sort_order || 0) - Number(b.sort_order || 0))
|
||||
.map(item => ({
|
||||
id: item.dict_key,
|
||||
name: item.dict_value
|
||||
}))
|
||||
},
|
||||
extractConsultOptionList(res) {
|
||||
if (res && Array.isArray(res.data)) return res.data
|
||||
if (res && res.data && Array.isArray(res.data.data)) return res.data.data
|
||||
return []
|
||||
},
|
||||
async fetchConsultOptions() {
|
||||
try {
|
||||
const res = await reqConsultForm()
|
||||
const list = this.extractConsultOptionList(res)
|
||||
const list = extractConsultOptionList(res)
|
||||
if (!list.length) return
|
||||
|
||||
const enterpriseOptions = this.normalizeDictOptions(list, 'enterprise_type')
|
||||
const provinceOptions = this.normalizeDictOptions(list, 'region')
|
||||
const enterpriseOptions = buildDictOptions(list, 'enterprise_type')
|
||||
const provinceOptions = buildDictOptions(list, 'region')
|
||||
|
||||
if (enterpriseOptions.length) this.enterpriseOptions = enterpriseOptions
|
||||
if (provinceOptions.length) this.provinceOptions = provinceOptions
|
||||
if (provinceOptions.length) {
|
||||
this.provinceOptions = provinceOptions
|
||||
this.provinceSelectKey += 1
|
||||
}
|
||||
} catch (error) {
|
||||
// 字典接口异常时保持当前选项,避免影响基础提交。
|
||||
}
|
||||
@ -397,7 +381,21 @@ export default Vue.extend({
|
||||
}
|
||||
|
||||
.form-item--message {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
::v-deep .form-item--message .el-form-item__label {
|
||||
width: 100% !important;
|
||||
float: none;
|
||||
line-height: 1.5;
|
||||
white-space: normal;
|
||||
word-break: normal;
|
||||
overflow-wrap: break-word;
|
||||
}
|
||||
|
||||
::v-deep .form-item--message .el-form-item__content {
|
||||
width: calc(100% - 184px);
|
||||
max-width: calc(100% - 184px);
|
||||
}
|
||||
|
||||
.full-select {
|
||||
@ -541,6 +539,11 @@ export default Vue.extend({
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
::v-deep .form-item--message .el-form-item__content {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.agreement-checkbox {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user