<template>
|
<div>
|
<div class="common-form">
|
<span>{{ curItem.name }}</span>
|
</div>
|
<el-form size="small" :model="curItem" label-width="100px">
|
<!-- 商户分类 -->
|
<el-form-item label="商户分类：">
|
<el-cascader
|
class="ww100"
|
v-model="currCategory"
|
v-if="CategoryList.length > 0"
|
ref="cascader"
|
:options="CategoryList"
|
:props="{ checkStrictly: true, children: 'child', value: 'category_id', label: 'name' }"
|
@change="changeCategory"
|
clearable
|
></el-cascader>
|
</el-form-item>
|
<!-- 商户排序 -->
|
<el-form-item label="是否显示排序：">
|
<el-radio-group v-model="curItem.params.is_sort">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="是否显示分类筛选：">
|
<el-radio-group v-model="curItem.params.is_category">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<el-form-item label="是否显示筛选：">
|
<el-radio-group v-model="curItem.params.is_filter">
|
<el-radio :label="1">是</el-radio>
|
<el-radio :label="0">否</el-radio>
|
</el-radio-group>
|
</el-form-item>
|
<!-- 显示数量 -->
|
<el-form-item label="显示数量："><el-input v-model="curItem.params.product_num" class="w-auto"></el-input></el-form-item>
|
<!--组件样式-->
|
<div class="p-10-0 mb16 f14 border-b"><span class="gray6">组件样式</span></div>
|
|
<!-- 背景颜色 -->
|
<el-form-item label="背景颜色：">
|
<div class="d-s-c">
|
<el-color-picker v-model="curItem.style.background"></el-color-picker>
|
<el-button type="button" style="margin-left: 10px;" @click.stop="$parent.onEditorResetColor(curItem.style, 'background', '#F6F6F6')">重置</el-button>
|
</div>
|
</el-form-item>
|
|
<!--图片-->
|
<el-form-item label="评分图标：">
|
<div class="diy-setpages-cover">
|
<img v-if="curItem.style.server_score_image" v-img-url="curItem.style.server_score_image" alt="" @click="$parent.onEditorSelectImage(curItem.style, 'server_score_image')" :style="'background-color:'+curItem.style.titleBackgroundColor+' ;'">
|
<div>建议尺寸60×60</div>
|
</div>
|
</el-form-item>
|
</el-form>
|
</div>
|
</template>
|
|
|
<script>
|
import supplierService from '@/api/supplier.js';
|
export default {
|
data() {
|
return {
|
currCategory: [],
|
CategoryList: []
|
};
|
},
|
props: ['curItem', 'selectedIndex'],
|
created() {
|
this.getCategoryList();
|
},
|
watch: {
|
selectedIndex: function(n, o) {
|
this.currCategory=this.currCategoryAuto(this.CategoryList);
|
console.log(this.currCategory)
|
}
|
},
|
methods: {
|
/*获取分类列表*/
|
getCategoryList() {
|
supplierService.Category({category_type: 20}).then(res => {
|
this.CategoryList = res.data.category;
|
// 在数组开头插入"全部"选项
|
this.CategoryList.unshift({
|
category_id: 0,
|
name: '全部',
|
});
|
if (this.curItem.params.category!=0){
|
// 获取分类列表后立即设置默认选中项
|
this.$nextTick(() => {
|
this.currCategory = this.currCategoryAuto(this.CategoryList);
|
});
|
}
|
|
});
|
},
|
/*选择默认*/
|
currCategoryAuto(list){
|
let arr=[];
|
for(let i=0;i<list.length;i++){
|
let item=list[i];
|
if(item.category_id==this.curItem.params.category){
|
arr.push(item.category_id);
|
break;
|
}else{
|
if(Object.prototype.toString.call(item.child)== '[object Array]'&&item.child.length>0){
|
for(let j=0;j<item.child.length;j++){
|
if(item.child[j].category_id==this.curItem.params.category){
|
arr.push(item.category_id);
|
arr.push(item.child[j].category_id);
|
break;
|
}
|
}
|
}
|
}
|
}
|
return arr;
|
},
|
/*选择类别*/
|
changeCategory(e) {
|
if(e.length > 0){
|
let item = this.$refs['cascader'].getCheckedNodes();
|
this.curItem.params.category = item[0].data.category_id;
|
}else{
|
this.curItem.params.category = 0;
|
}
|
},
|
}
|
};
|
</script>
|
