|
@@ -14,7 +14,23 @@
|
|
import SchemaFormRenderer from '@/components/common/form-schema-renderer.vue'
|
|
import SchemaFormRenderer from '@/components/common/form-schema-renderer.vue'
|
|
import { createSchema } from './schema'
|
|
import { createSchema } from './schema'
|
|
import { mapState, mapMutations } from 'vuex'
|
|
import { mapState, mapMutations } from 'vuex'
|
|
-import { schemaKeyMap } from '@/views/create-order/data'
|
|
|
|
|
|
+import { schemaKeyMap, productKeyMap } from '@/views/create-order/data'
|
|
|
|
+import { cloneDeep, debounce } from 'lodash'
|
|
|
|
+
|
|
|
|
+// 浅对比两个对象,找出值不相同的字段的 key 并以数组形式返回
|
|
|
|
+function findShallowDifferentKeys(obj1, obj2) {
|
|
|
|
+ const differentKeys = [];
|
|
|
|
+ if (typeof obj1!== 'object' || obj1 === null || typeof obj2!== 'object' || obj2 === null) {
|
|
|
|
+ return differentKeys;
|
|
|
|
+ }
|
|
|
|
+ const allKeys = new Set([...Object.keys(obj1), ...Object.keys(obj2)]);
|
|
|
|
+ allKeys.forEach(key => {
|
|
|
|
+ if (obj1[key]!== obj2[key]) {
|
|
|
|
+ differentKeys.push(key);
|
|
|
|
+ }
|
|
|
|
+ });
|
|
|
|
+ return differentKeys;
|
|
|
|
+}
|
|
|
|
|
|
export default {
|
|
export default {
|
|
name: 'SchemaForm',
|
|
name: 'SchemaForm',
|
|
@@ -24,7 +40,7 @@ export default {
|
|
props: {
|
|
props: {
|
|
productType: {
|
|
productType: {
|
|
type: String,
|
|
type: String,
|
|
- default: 'cjdy'
|
|
|
|
|
|
+ default: productKeyMap.cjdy,
|
|
},
|
|
},
|
|
productInfo: {
|
|
productInfo: {
|
|
type: Object,
|
|
type: Object,
|
|
@@ -60,6 +76,8 @@ export default {
|
|
],
|
|
],
|
|
rules: {},
|
|
rules: {},
|
|
selectedRelatedOrder: {},
|
|
selectedRelatedOrder: {},
|
|
|
|
+ cacheValue: {}, // oldValue
|
|
|
|
+ unRefreshSchemaWhenFieldsChanged: ['contractAmount', 'linkedOrderId'],
|
|
}
|
|
}
|
|
},
|
|
},
|
|
computed: {
|
|
computed: {
|
|
@@ -97,7 +115,11 @@ export default {
|
|
async validate() {
|
|
async validate() {
|
|
return this.$refs.schemaForm.validate()
|
|
return this.$refs.schemaForm.validate()
|
|
},
|
|
},
|
|
|
|
+ cacheBeforeValue() {
|
|
|
|
+ Object.assign(this.cacheValue, this.value)
|
|
|
|
+ },
|
|
onInput(e) {
|
|
onInput(e) {
|
|
|
|
+ this.cacheBeforeValue()
|
|
this.$emit('input', e)
|
|
this.$emit('input', e)
|
|
this.afterInput() // 用于动态修改用户限制选中项
|
|
this.afterInput() // 用于动态修改用户限制选中项
|
|
},
|
|
},
|
|
@@ -131,7 +153,7 @@ export default {
|
|
}
|
|
}
|
|
} else if (buySubject === 2 && ent) {
|
|
} else if (buySubject === 2 && ent) {
|
|
if (accountTel && companyName) {
|
|
if (accountTel && companyName) {
|
|
- this.getUserService()
|
|
|
|
|
|
+ await this.getUserService()
|
|
}
|
|
}
|
|
}
|
|
}
|
|
this.afterInput()
|
|
this.afterInput()
|
|
@@ -162,20 +184,43 @@ export default {
|
|
}
|
|
}
|
|
return r
|
|
return r
|
|
},
|
|
},
|
|
|
|
+ getChangedFields() {
|
|
|
|
+ return findShallowDifferentKeys(this.value, this.cacheValue)
|
|
|
|
+ },
|
|
|
|
+ needChangeSchema() {
|
|
|
|
+ const changedFieldsArr = this.getChangedFields()
|
|
|
|
+ const changedFields = changedFieldsArr.join(',')
|
|
|
|
+ if (!changedFields) return true
|
|
|
|
+ return !this.unRefreshSchemaWhenFieldsChanged.includes(changedFields)
|
|
|
|
+ },
|
|
getSchemaItemWithKey(key) {
|
|
getSchemaItemWithKey(key) {
|
|
return this.schema.find(item => item.key === key)
|
|
return this.schema.find(item => item.key === key)
|
|
},
|
|
},
|
|
// 处理并分发各个产品卡片操作的限制
|
|
// 处理并分发各个产品卡片操作的限制
|
|
- afterInput() {
|
|
|
|
|
|
+ afterInput: debounce(function() {
|
|
|
|
+ // 修改某些字段时候才会更新schema
|
|
|
|
+ const needChange = this.needChangeSchema()
|
|
|
|
+ if (!needChange) return
|
|
this.$nextTick(() => {
|
|
this.$nextTick(() => {
|
|
- // this.changeSchemaCommon()
|
|
|
|
- if (this.productType === 'cjdy') {
|
|
|
|
|
|
+ // 注意:此处函数不允许异步动态修改props。会造成递归循环调用
|
|
|
|
+ if (this.productType === productKeyMap.cjdy) {
|
|
this.groupCjdySchema()
|
|
this.groupCjdySchema()
|
|
- } else if (this.productInfo === 'dhy') {
|
|
|
|
|
|
+ } else if (this.productType === productKeyMap.dhy) {
|
|
this.changeDhySchema()
|
|
this.changeDhySchema()
|
|
}
|
|
}
|
|
|
|
+ this.checkSchemaRule()
|
|
})
|
|
})
|
|
- console.log(this.thisProductInfoListItem, this.schema)
|
|
|
|
|
|
+ }, 10),
|
|
|
|
+ getPriceRequest: debounce(async function getPrice(p) {
|
|
|
|
+ this.$store.dispatch('order/getPrice', p).then(r => {
|
|
|
|
+ // 刷新xx组件价格
|
|
|
|
+ const key = schemaKeyMap.contractAmount
|
|
|
|
+ this.refreshValue({ [key]: Object.assign({}, this.value[key], { standardMoney: r }) })
|
|
|
|
+ })
|
|
|
|
+ }, 600),
|
|
|
|
+ // 根据schema的显示隐藏,检查schemaRule是否需要过滤
|
|
|
|
+ checkSchemaRule() {
|
|
|
|
+
|
|
},
|
|
},
|
|
// 工具:动态修改选中可用的类型
|
|
// 工具:动态修改选中可用的类型
|
|
utilChangeAvailablePayment() {
|
|
utilChangeAvailablePayment() {
|
|
@@ -250,7 +295,7 @@ export default {
|
|
// 1.1 个人: serviceArrMap不能位空,且,vipExist为true。此时可以续费(升级),否则不可以续费(升级)
|
|
// 1.1 个人: serviceArrMap不能位空,且,vipExist为true。此时可以续费(升级),否则不可以续费(升级)
|
|
this.utilCheckAndEnabledUpgradeRenew()
|
|
this.utilCheckAndEnabledUpgradeRenew()
|
|
} else if (buySubject === 2) {
|
|
} else if (buySubject === 2) {
|
|
- // 1.2 企业: 选择关联订单后再次查询。然后做1.1相关判断
|
|
|
|
|
|
+ // 1.2 企业: 选择关联订单后再次查询。然后做1.1相同判断
|
|
// 此处判断在关联订单选择完成后判断
|
|
// 此处判断在关联订单选择完成后判断
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@@ -262,6 +307,7 @@ export default {
|
|
const relatedOrders = this.getSchemaItemWithKey('relatedOrders')
|
|
const relatedOrders = this.getSchemaItemWithKey('relatedOrders')
|
|
if (Array.isArray(this.thisProductInfoListItem?.productUserService?.serviceArrMap)) {
|
|
if (Array.isArray(this.thisProductInfoListItem?.productUserService?.serviceArrMap)) {
|
|
const opt = this.thisProductInfoListItem?.productUserService?.serviceArrMap || []
|
|
const opt = this.thisProductInfoListItem?.productUserService?.serviceArrMap || []
|
|
|
|
+ // 表格源数据,传入后还需要再次整理
|
|
relatedOrders.props.options = opt.map(t => {
|
|
relatedOrders.props.options = opt.map(t => {
|
|
return {
|
|
return {
|
|
...t,
|
|
...t,
|
|
@@ -344,7 +390,7 @@ export default {
|
|
}
|
|
}
|
|
main.props.text = `付费${mainAccountCount}个 合计:<span class="text-color-main">${allTotal}</span>个`
|
|
main.props.text = `付费${mainAccountCount}个 合计:<span class="text-color-main">${allTotal}</span>个`
|
|
},
|
|
},
|
|
- // 服务周期
|
|
|
|
|
|
+ // 有效周期
|
|
commonChangeValidityPeriod() {
|
|
commonChangeValidityPeriod() {
|
|
const { saleGifts, [schemaKeyMap.payment]: payment } = this.value
|
|
const { saleGifts, [schemaKeyMap.payment]: payment } = this.value
|
|
const m = this.getSchemaItemWithKey('validityPeriod')
|
|
const m = this.getSchemaItemWithKey('validityPeriod')
|
|
@@ -358,19 +404,19 @@ export default {
|
|
// 1 付费:文本框,非必填,仅可输入1和正整数,单位可选:月(初始值)、天
|
|
// 1 付费:文本框,非必填,仅可输入1和正整数,单位可选:月(初始值)、天
|
|
// 2 赠送:文本框,非必填,仅可输入0和正整数,单位同付费,不支持选择。
|
|
// 2 赠送:文本框,非必填,仅可输入0和正整数,单位同付费,不支持选择。
|
|
// 3 合计:付费+赠送,初始值为-,单位同付费,如若为0,则提示“请输入有效周期”;
|
|
// 3 合计:付费+赠送,初始值为-,单位同付费,如若为0,则提示“请输入有效周期”;
|
|
- this.$set(m.props, 'showPayUnit', ['月', '日'])
|
|
|
|
|
|
+ this.$set(m.props, 'showPayUnit', [1, 2])
|
|
this.$set(m.props, 'freeUnitDisabled', true)
|
|
this.$set(m.props, 'freeUnitDisabled', true)
|
|
this.$set(m.props, 'showPayInput', true)
|
|
this.$set(m.props, 'showPayInput', true)
|
|
this.$set(m.props, 'sameUnit', true)
|
|
this.$set(m.props, 'sameUnit', true)
|
|
if (payment === 1 || payment === 4) {
|
|
if (payment === 1 || payment === 4) {
|
|
// 购买、试用
|
|
// 购买、试用
|
|
// do something...
|
|
// do something...
|
|
- this.$set(m.props, 'showOpenOnPaymentDay', true)
|
|
|
|
|
|
+ this.$set(m.props, 'showPaybackOpenServerDay', true)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
} else if (payment === 2) {
|
|
} else if (payment === 2) {
|
|
// 续费
|
|
// 续费
|
|
// 不展示自动开通模块
|
|
// 不展示自动开通模块
|
|
- this.$set(m.props, 'showOpenOnPaymentDay', false)
|
|
|
|
|
|
+ this.$set(m.props, 'showPaybackOpenServerDay', false)
|
|
// 显示底部提示
|
|
// 显示底部提示
|
|
this.$set(m.props, 'showButtonTip', true)
|
|
this.$set(m.props, 'showButtonTip', true)
|
|
} else {
|
|
} else {
|
|
@@ -379,19 +425,19 @@ export default {
|
|
}
|
|
}
|
|
} else if (saleGifts === 2) {
|
|
} else if (saleGifts === 2) {
|
|
// 赠送
|
|
// 赠送
|
|
- this.$set(m.props, 'showPayUnit', ['月', '日'])
|
|
|
|
|
|
+ this.$set(m.props, 'showPayUnit', [1, 2])
|
|
this.$set(m.props, 'freeUnitDisabled', true)
|
|
this.$set(m.props, 'freeUnitDisabled', true)
|
|
this.$set(m.props, 'showPayInput', false)
|
|
this.$set(m.props, 'showPayInput', false)
|
|
// this.$set(m.props, 'sameUnit', true)
|
|
// this.$set(m.props, 'sameUnit', true)
|
|
if (payment === 1 || payment === 4) {
|
|
if (payment === 1 || payment === 4) {
|
|
// 购买、试用
|
|
// 购买、试用
|
|
// do something...
|
|
// do something...
|
|
- this.$set(m.props, 'showOpenOnPaymentDay', true)
|
|
|
|
|
|
+ this.$set(m.props, 'showPaybackOpenServerDay', true)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
} else if (payment === 2) {
|
|
} else if (payment === 2) {
|
|
// 续费
|
|
// 续费
|
|
// 不展示自动开通模块
|
|
// 不展示自动开通模块
|
|
- this.$set(m.props, 'showOpenOnPaymentDay', false)
|
|
|
|
|
|
+ this.$set(m.props, 'showPaybackOpenServerDay', false)
|
|
// 显示底部提示
|
|
// 显示底部提示
|
|
this.$set(m.props, 'showButtonTip', true)
|
|
this.$set(m.props, 'showButtonTip', true)
|
|
} else {
|
|
} else {
|
|
@@ -401,17 +447,16 @@ export default {
|
|
}
|
|
}
|
|
} else if (this.utilCheckIsSourcePack()) {
|
|
} else if (this.utilCheckIsSourcePack()) {
|
|
// 【产品属性为资源包】且【该产品类型支持系统自动开通权限】
|
|
// 【产品属性为资源包】且【该产品类型支持系统自动开通权限】
|
|
- // 并且仅展示自动开通
|
|
|
|
|
|
+ // 仅展示自动开通
|
|
// m.show = false // 有自动开通权限【展示】
|
|
// m.show = false // 有自动开通权限【展示】
|
|
this.$set(m.props, 'showPayInput', false)
|
|
this.$set(m.props, 'showPayInput', false)
|
|
this.$set(m.props, 'showFreeInput', false)
|
|
this.$set(m.props, 'showFreeInput', false)
|
|
- this.$set(m.props, 'showOpenOnPaymentDay', true)
|
|
|
|
|
|
+ this.$set(m.props, 'showPaybackOpenServerDay', true)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
this.$set(m.props, 'showButtonTip', false)
|
|
} else {
|
|
} else {
|
|
m.show = false
|
|
m.show = false
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- // 合同金额
|
|
|
|
commonChangeContractAmount() {
|
|
commonChangeContractAmount() {
|
|
const { saleGifts } = this.value
|
|
const { saleGifts } = this.value
|
|
const m = this.getSchemaItemWithKey('contractAmount')
|
|
const m = this.getSchemaItemWithKey('contractAmount')
|
|
@@ -424,12 +469,16 @@ export default {
|
|
this.$set(m.props, 'showContractMoney', false)
|
|
this.$set(m.props, 'showContractMoney', false)
|
|
}
|
|
}
|
|
|
|
|
|
- // const price = this.getPrice()
|
|
|
|
- // this.$set(m.props, 'noStandardMoney', price === -1)
|
|
|
|
- // this.$set(m.props, 'standardMoney', price)
|
|
|
|
-
|
|
|
|
- // const rate = discountRate()
|
|
|
|
- // this.$set(m.props, 'discountRate', rate)
|
|
|
|
|
|
+ if (this.utilCheckIsVipService()) {
|
|
|
|
+ const p = {
|
|
|
|
+ productInfo: cloneDeep(this.thisProductInfoListItem),
|
|
|
|
+ type: this.productType,
|
|
|
|
+ productIndex: this.index,
|
|
|
|
+ }
|
|
|
|
+ this.getPriceRequest(p)
|
|
|
|
+ } else {
|
|
|
|
+ // 无法计算商品价格
|
|
|
|
+ }
|
|
},
|
|
},
|
|
// 组合以及定制:超级订阅规则
|
|
// 组合以及定制:超级订阅规则
|
|
groupCjdySchema() {
|
|
groupCjdySchema() {
|
|
@@ -449,6 +498,11 @@ export default {
|
|
// 合同金额
|
|
// 合同金额
|
|
this.commonChangeContractAmount()
|
|
this.commonChangeContractAmount()
|
|
},
|
|
},
|
|
|
|
+ // 组合以及定制:大会员规则
|
|
|
|
+ changeDhySchema() {
|
|
|
|
+ // const m = this.getSchemaItemWithKey('productType')
|
|
|
|
+ // console.log(m)
|
|
|
|
+ },
|
|
commonChangeSpecificationSchema() {
|
|
commonChangeSpecificationSchema() {
|
|
const { buySubject } = this.pageForm
|
|
const { buySubject } = this.pageForm
|
|
const { [schemaKeyMap.payment]: payment } = this.value
|
|
const { [schemaKeyMap.payment]: payment } = this.value
|