|
|
@@ -20,7 +20,18 @@ export default defineComponent({
|
|
|
computed: {
|
|
|
dbField_esm() {
|
|
|
return dbField_esm
|
|
|
- }
|
|
|
+ },
|
|
|
+ productTypes(){
|
|
|
+ let arr = this.$store.getters.productTypes;
|
|
|
+ // 添加 all
|
|
|
+ arr.unshift({text: '全部', key: 'all' });
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
+ newsTypes(){// 添加 all
|
|
|
+ let arr = this.$store.getters.allNewsTypes;
|
|
|
+ arr.unshift({text: '全部', key: 'all' });
|
|
|
+ return arr;
|
|
|
+ },
|
|
|
},
|
|
|
components: {SearchBox, InputRow, PopCard, Pop, ImageTable, ImageViewer, RoundedTitle},
|
|
|
async asyncData(ctx){
|
|
|
@@ -45,7 +56,7 @@ export default defineComponent({
|
|
|
carouselList: [],
|
|
|
popShow: false,
|
|
|
popLoading: false,
|
|
|
- carouselPopShow: true,
|
|
|
+ carouselPopShow: false,
|
|
|
carouselPopLoading: false,
|
|
|
isEditCarousel: false,
|
|
|
carouselData: {},
|
|
|
@@ -64,13 +75,6 @@ export default defineComponent({
|
|
|
msg: '',
|
|
|
state: 0,
|
|
|
},
|
|
|
- // 图像资源id, 0为无图
|
|
|
- file: {
|
|
|
- val: 0,
|
|
|
- init: 0,
|
|
|
- msg: '',
|
|
|
- state: 0,
|
|
|
- },
|
|
|
// 轮播类型 '0:product','1:news','2:page','3:href'
|
|
|
type: {
|
|
|
val: 0,
|
|
|
@@ -78,10 +82,9 @@ export default defineComponent({
|
|
|
msg: '',
|
|
|
state: 0,
|
|
|
options: [
|
|
|
- {label: '直接链接', value: 0},
|
|
|
- {label: '内部产品', value: 1},
|
|
|
- {label: '指向新闻', value: 2},
|
|
|
- {label: '内部页面', value: 3},
|
|
|
+ {label: '直接链接', value: 0,checkField: 'href'},
|
|
|
+ {label: '内部产品', value: 1,checkField: 'productId'},
|
|
|
+ {label: '指向新闻', value: 2,checkField: 'newsId'},
|
|
|
],
|
|
|
},
|
|
|
// 具体值
|
|
|
@@ -90,6 +93,8 @@ export default defineComponent({
|
|
|
init: '',
|
|
|
msg: '',
|
|
|
state: 0,
|
|
|
+ // 依赖字段
|
|
|
+ depend: 'type',
|
|
|
showText: '',// 展示用字段
|
|
|
oldShowText: '',
|
|
|
},
|
|
|
@@ -106,25 +111,24 @@ export default defineComponent({
|
|
|
productSelectVisible: false,
|
|
|
productSearch: {
|
|
|
type: {
|
|
|
- val: pTypes[0].key,
|
|
|
- oldVal: pTypes[0].key,
|
|
|
- init: pTypes[0].key,
|
|
|
+ val: '',
|
|
|
+ oldVal: '',
|
|
|
+ init: '',
|
|
|
msg: '',
|
|
|
- options: pTypes,
|
|
|
+ options: [],
|
|
|
}
|
|
|
},
|
|
|
newsSelectVisible: false,
|
|
|
newsVisible: false,
|
|
|
newsSearch: {
|
|
|
type: {
|
|
|
- val: newsType[0].key,
|
|
|
- oldVal: newsType[0].key,
|
|
|
- init: newsType[0].key,
|
|
|
+ val: '',
|
|
|
+ oldVal: '',
|
|
|
+ init: '',
|
|
|
msg: '',
|
|
|
- options: pTypes,
|
|
|
+ options: [],
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
imageSelectVisible: false,
|
|
|
|
|
|
}
|
|
|
@@ -213,8 +217,38 @@ export default defineComponent({
|
|
|
}
|
|
|
},
|
|
|
// 加载轮播默认数据
|
|
|
+ async getNewsSearch(searchParam){
|
|
|
+ console.log(searchParam)
|
|
|
+ if(this.newsSearch.type.val !== this.newsSearch.type.oldVal){
|
|
|
+ searchParam.p = 1;
|
|
|
+ }
|
|
|
+ searchParam.type = this.newsSearch.type.val;
|
|
|
+ searchParam.l = this.limit;
|
|
|
+ searchParam.p = searchParam.page;
|
|
|
+ let [err,res] = await handle(
|
|
|
+ this.$axios.get(
|
|
|
+ apiMap.searchNewsMini.path,
|
|
|
+ {params:searchParam})
|
|
|
+ );
|
|
|
+ if(err){
|
|
|
+ console.log(err);
|
|
|
+ return [{message:'请求数据失败'},null];
|
|
|
+ }
|
|
|
|
|
|
-
|
|
|
+ let result = res.data;
|
|
|
+ if(result.code === rCode.OK){
|
|
|
+ this.newsSearch.type.oldVal = this.newsSearch.type.val;
|
|
|
+ // data 转换
|
|
|
+ result.data = result.data.map(item=>{
|
|
|
+ item.showText=item.name;
|
|
|
+ return item;
|
|
|
+ });
|
|
|
+ return [null,result];
|
|
|
+ }else{
|
|
|
+ // 可捕获的服务器错误
|
|
|
+ return [{message:result.msg},null];
|
|
|
+ }
|
|
|
+ },
|
|
|
checkFormItem(field,enumOptions,reCheckField){
|
|
|
let formItem = this.form[field];
|
|
|
if (formItem){
|
|
|
@@ -242,10 +276,48 @@ export default defineComponent({
|
|
|
}else{
|
|
|
let r = true;
|
|
|
for (const fieldKey in this.form) {
|
|
|
- this.form[fieldKey].msg = fieldIsAllow({
|
|
|
- [fieldKey]:this.form[fieldKey].val,
|
|
|
+ formItem = this.form[fieldKey];
|
|
|
+ let depend = this.form[formItem.depend];
|
|
|
+ let checkField = fieldKey;
|
|
|
+
|
|
|
+ if(formItem.reCheckField){
|
|
|
+ checkField = formItem.reCheckField;
|
|
|
+ }
|
|
|
+ // 枚举值判断
|
|
|
+ if(formItem.options){
|
|
|
+ // 有枚举字段,只判断是否在枚举中
|
|
|
+ if(formItem.options.findIndex(item=>item.value == formItem.val) === -1){
|
|
|
+ formItem.msg = '选项不在范围内';
|
|
|
+ r = false;
|
|
|
+ }
|
|
|
+ // 枚举值判断完毕,继续下一个字段
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 判断是否有依赖字段
|
|
|
+ if(depend){
|
|
|
+ if(depend.options){
|
|
|
+ // 依赖的对象有枚举类型,检查该枚举类型是否有有检测值
|
|
|
+ let optionItem = depend.options.find(item=>item.value == depend.val);
|
|
|
+ if(!optionItem){
|
|
|
+ depend.msg = '选项不在范围内';
|
|
|
+ formItem.msg = '该值依赖项输入异常';
|
|
|
+ r = false;
|
|
|
+ continue;
|
|
|
+ }
|
|
|
+ if(optionItem.checkField){
|
|
|
+ console.log(`采用依赖项的检测字段${optionItem.checkField}`)
|
|
|
+ checkField = optionItem.checkField;
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ console.log(`检测字段:${checkField},值:${formItem.val}`);
|
|
|
+ formItem.msg = fieldIsAllow({
|
|
|
+ [checkField]:formItem.val,
|
|
|
})
|
|
|
- if (this.form[fieldKey].msg){
|
|
|
+ if (formItem.msg){
|
|
|
r = false;
|
|
|
}
|
|
|
}
|
|
|
@@ -263,15 +335,44 @@ export default defineComponent({
|
|
|
this.form.value.showText = '';
|
|
|
}
|
|
|
},
|
|
|
-
|
|
|
openAddCarouselModal(){
|
|
|
// 初始化表单
|
|
|
this.initCarouseForm();
|
|
|
- // 打开弹窗. 选择图片,填写链接地址,排序
|
|
|
this.carouselPopShow = true;
|
|
|
this.isEditCarousel = false;
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ // 打开弹窗. 选择图片,填写链接地址,排序
|
|
|
+ this.productSearch.type.options = this.productTypes;
|
|
|
+ this.newsSearch.type.options = this.newsTypes;
|
|
|
+ // 默认值设置
|
|
|
+ this.productSearch.type.val = this.productTypes[0].key;
|
|
|
+ this.productSearch.type.oldVal = this.productTypes[0].key;
|
|
|
+ this.productSearch.type.init = this.productTypes[0].key;
|
|
|
+
|
|
|
+ this.newsSearch.type.val = this.newsTypes[0].key;
|
|
|
+ this.newsSearch.type.oldVal = this.newsTypes[0].key;
|
|
|
+ this.newsSearch.type.init = this.newsTypes[0].key;
|
|
|
+
|
|
|
+
|
|
|
+ });
|
|
|
},
|
|
|
+ onPopOkClickHandle(){
|
|
|
+ if(this.isEditCarousel){
|
|
|
+ console.log('保存修改后的轮播数据');
|
|
|
+ }else{
|
|
|
+ console.log('新增轮播图');
|
|
|
+ this.addCarouselExecute();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ addCarouselExecute(){
|
|
|
+ // 生成新数据表单
|
|
|
+ let carouselData = {};
|
|
|
+ let isPass = this.checkFormItem();
|
|
|
+ if(!isPass){
|
|
|
+ return console.log('数据验证不通过');
|
|
|
+ }
|
|
|
|
|
|
+ },
|
|
|
|
|
|
|
|
|
|
|
|
@@ -297,24 +398,28 @@ export default defineComponent({
|
|
|
console.log(`onProductSearchHandle ${e}`);
|
|
|
console.log(e);
|
|
|
console.log(this.productSearch.type.val);
|
|
|
- // this.productSearch.type
|
|
|
},
|
|
|
onSelectedItemHandle(item){
|
|
|
console.log(`selected item ${item}`);
|
|
|
console.log(item);
|
|
|
this.form.value.val = item.id;
|
|
|
this.form.value.showText = item.showText;
|
|
|
+ this.form.value.msg = '';
|
|
|
},
|
|
|
onTypeChangeHandle(e){
|
|
|
console.log(`type change ${e}`);
|
|
|
// 清除其他值
|
|
|
+ this.form.value.val = '';
|
|
|
this.form.value.msg = '';
|
|
|
this.form.value.showText = '';
|
|
|
},
|
|
|
- loadDefaultProductItem(){
|
|
|
- this.productSearch.type.val = pTypes[0].key;
|
|
|
- this.$refs.productSearch.loadData(1,true);
|
|
|
+
|
|
|
+ onNewsSearchHandle(e){
|
|
|
+ console.log(`onProductSearchHandle ${e}`);
|
|
|
+ console.log(e);
|
|
|
+ console.log(this.productSearch.type.val);
|
|
|
},
|
|
|
+
|
|
|
},
|
|
|
|
|
|
})
|
|
|
@@ -371,7 +476,8 @@ export default defineComponent({
|
|
|
<input-row :msg="form.sort.msg"
|
|
|
label="排序">
|
|
|
<a-input-number v-model="form.sort.val"
|
|
|
- @focus="form.password.msg=''"
|
|
|
+ @focus="form.sort.msg=''"
|
|
|
+ :min="0"
|
|
|
@blur="checkFormItem('sort')"
|
|
|
/>
|
|
|
</input-row>
|
|
|
@@ -414,7 +520,6 @@ export default defineComponent({
|
|
|
:limit="limit"
|
|
|
search-placeholder="请输入产品名称关键字"
|
|
|
loadTip="正在搜索产品中..."
|
|
|
- ref="productSearch"
|
|
|
@onSelectedItem="onSelectedItemHandle"
|
|
|
>
|
|
|
<div class="w-full" slot="otherSearchItem">
|
|
|
@@ -429,22 +534,22 @@ export default defineComponent({
|
|
|
</div>
|
|
|
</search-box>
|
|
|
</div>
|
|
|
- <a-button type="primary" @click="loadDefaultProductItem">
|
|
|
+ <a-button type="primary" >
|
|
|
选择产品
|
|
|
</a-button>
|
|
|
</a-popover>
|
|
|
</input-row>
|
|
|
<!-- 新闻选择-->
|
|
|
<input-row
|
|
|
- v-show="form.type.val === dbField_esm.db_base.carouselType.production"
|
|
|
+ v-show="form.type.val === dbField_esm.db_base.carouselType.news"
|
|
|
:msg="form.value.msg"
|
|
|
label="文章选择">
|
|
|
{{ form.value.showText }}
|
|
|
- <a-popover v-model="productSelectVisible" title="选择你需要的文章" trigger="click">
|
|
|
+ <a-popover v-model="newsSelectVisible" title="选择你需要的文章" trigger="click">
|
|
|
<div slot="content" class="searchBox" >
|
|
|
<search-box
|
|
|
class="h-72"
|
|
|
- :loadDataApi="getProductSearch"
|
|
|
+ :loadDataApi="getNewsSearch"
|
|
|
:limit="limit"
|
|
|
search-placeholder="请输入产品名称关键字"
|
|
|
loadTip="正在搜索产品中..."
|
|
|
@@ -452,9 +557,9 @@ export default defineComponent({
|
|
|
@onSelectedItem="onSelectedItemHandle"
|
|
|
>
|
|
|
<div class="w-full" slot="otherSearchItem">
|
|
|
- <a-radio-group v-model="productSearch.type.val"
|
|
|
- @change="onProductSearchHandle">
|
|
|
- <a-radio-button v-for="opt in productSearch.type.options"
|
|
|
+ <a-radio-group v-model="newsSearch.type.val"
|
|
|
+ @change="onNewsSearchHandle">
|
|
|
+ <a-radio-button v-for="opt in newsSearch.type.options"
|
|
|
:key="'cType'+opt.key"
|
|
|
:value="opt.key">
|
|
|
{{ opt.text }}
|
|
|
@@ -463,14 +568,15 @@ export default defineComponent({
|
|
|
</div>
|
|
|
</search-box>
|
|
|
</div>
|
|
|
- <a-button type="primary" @click="loadDefaultProductItem">
|
|
|
+ <a-button type="primary">
|
|
|
选择产品
|
|
|
</a-button>
|
|
|
</a-popover>
|
|
|
</input-row>
|
|
|
|
|
|
<!-- 选择图片 -->
|
|
|
- <input-row label="轮播图片">
|
|
|
+ <input-row label="轮播图片"
|
|
|
+ :msg="form.fileData.msg">
|
|
|
<a-popover v-model="imageSelectVisible"
|
|
|
class="w-full"
|
|
|
trigger="click">
|
|
|
@@ -492,7 +598,7 @@ export default defineComponent({
|
|
|
</input-row>
|
|
|
</div>
|
|
|
<template class="w-full" slot="footer">
|
|
|
- <a-button>{{isEditCarousel? '保存': '新增'}}</a-button>
|
|
|
+ <a-button @click="onPopOkClickHandle">{{isEditCarousel? '保存': '新增'}}</a-button>
|
|
|
</template>
|
|
|
</pop-card>
|
|
|
</pop>
|