|
|
@@ -2,29 +2,14 @@
|
|
|
<div class="app-list-content">
|
|
|
<x-crud class="liu-crud-wrap" @load="onLoad">
|
|
|
<template #slot-tabs>
|
|
|
- <el-tabs
|
|
|
- class="liu-tabs"
|
|
|
- type="border-card"
|
|
|
- v-model="tabIndex"
|
|
|
- @tab-click="tabClick"
|
|
|
- >
|
|
|
- <el-tab-pane
|
|
|
- v-for="(item, index) in tabsData"
|
|
|
- :key="index"
|
|
|
- :label="item.text"
|
|
|
- :name="item.key"
|
|
|
- >
|
|
|
+ <el-tabs class="liu-tabs" type="border-card" v-model="tabIndex" @tab-click="tabClick" >
|
|
|
+ <el-tab-pane v-for="(item, index) in tabsData" :key="index" :label="item.text" :name="item.key" >
|
|
|
</el-tab-pane>
|
|
|
</el-tabs>
|
|
|
</template>
|
|
|
|
|
|
<template #table-column-cover="{ scope }">
|
|
|
- <cl-avatar
|
|
|
- shape="square"
|
|
|
- :size="32"
|
|
|
- :src="scope.row.cover"
|
|
|
- :style="{ margin: 'auto' }"
|
|
|
- ></cl-avatar>
|
|
|
+ <cl-avatar shape="square" :size="32" :src="scope.row.cover" :style="{ margin: 'auto' }" ></cl-avatar>
|
|
|
</template>
|
|
|
|
|
|
<template #table-column-goodsName="{ scope }">
|
|
|
@@ -38,25 +23,26 @@
|
|
|
|
|
|
<template #table-column-inTurn="{ scope }">
|
|
|
<span v-if="!sort.status">{{ scope.row.inTurn }}</span>
|
|
|
- <el-input
|
|
|
- ref="sort-input"
|
|
|
- focus
|
|
|
- size="mini"
|
|
|
- v-else
|
|
|
- v-model="scope.row.inTurn"
|
|
|
- @blur="changeSort(scope.row)"
|
|
|
- ></el-input>
|
|
|
+ <el-input ref="sort-input" focus size="mini" v-else v-model="scope.row.inTurn" @blur="changeSort(scope.row)" >
|
|
|
+ </el-input>
|
|
|
</template>
|
|
|
|
|
|
<template #slot-modify="{ scope }">
|
|
|
- <el-button
|
|
|
- type="text"
|
|
|
- @click.native.stop="replaceBtnFn(scope.row.id)"
|
|
|
- >修改</el-button
|
|
|
- >
|
|
|
+ <el-button type="text" @click.native.stop="replaceBtnFn(scope.row.id)" >修改</el-button >
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-cp-class="{scope}">
|
|
|
+ <el-select size="mini" v-model="currentCpClassName" placeholder="产品分类" style="width:150px;margin-right:10px;" @change="getCpClass" clearable>
|
|
|
+ <el-option v-for="item in cpClassData" :key="item.value" :label="item.name" :value="item.id"> </el-option>
|
|
|
+ </el-select>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #slot-item-class="{scope}">
|
|
|
+ <el-select size="mini" v-model="currentItemClassName" placeholder="花材分类" style="width:150px;margin-right:10px;" @change="getItemClass" clearable>
|
|
|
+ <el-option v-for="item in itemClassList" :key="item.value" :label="item.name" :value="item.id"> </el-option>
|
|
|
+ </el-select>
|
|
|
</template>
|
|
|
|
|
|
- <!-- 排序 -->
|
|
|
<template #table-header-inTurn>
|
|
|
<div class="set-sort">
|
|
|
<span>排序</span>
|
|
|
@@ -69,23 +55,20 @@
|
|
|
<template #slot-add-goods-btn>
|
|
|
<el-button type="primary" size="mini" @click="replaceBtnFn(0)">添加</el-button>
|
|
|
</template>
|
|
|
+
|
|
|
+ <template #slot-cpClassStyle="{scope}">
|
|
|
+ <el-radio-group v-model="cpClassStyle" @change="changeClassify" style="margin-right:20px;padding-top:6px;margin-left:20px;">
|
|
|
+ <el-radio label="-1">全部</el-radio>
|
|
|
+ <el-radio label="0">未分产品</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </template>
|
|
|
+
|
|
|
</x-crud>
|
|
|
|
|
|
<!-- 新增弹窗 -->
|
|
|
- <el-dialog
|
|
|
- :title="`${currentItemId == 0 ? '添加' : '修改'}花材`"
|
|
|
- :visible.sync="addDialog"
|
|
|
- :close-on-click-modal="false"
|
|
|
- width="600px"
|
|
|
- >
|
|
|
+ <el-dialog :title="`${currentItemId == 0 ? '添加' : '修改'}花材`" :visible.sync="addDialog" :close-on-click-modal="false" width="600px" >
|
|
|
<div class="ad-modal-content">
|
|
|
- <el-form
|
|
|
- :model="replaceForm"
|
|
|
- :rules="replaceFormRules"
|
|
|
- ref="replaceForm"
|
|
|
- label-width="100px"
|
|
|
- class="demo-form"
|
|
|
- >
|
|
|
+ <el-form :model="replaceForm" :rules="replaceFormRules" ref="replaceForm" label-width="100px" class="demo-form" >
|
|
|
<el-form-item label="名称" prop="name">
|
|
|
<el-input
|
|
|
v-model="replaceForm.name"
|
|
|
@@ -108,18 +91,8 @@
|
|
|
</el-form-item>
|
|
|
|
|
|
<el-form-item label="分类" prop="classId">
|
|
|
- <el-select
|
|
|
- v-model="replaceForm.className"
|
|
|
- size="small"
|
|
|
- placeholder="请选择分类"
|
|
|
- @change="selClassFn"
|
|
|
- >
|
|
|
- <el-option
|
|
|
- v-for="(item, index) in itemClassList"
|
|
|
- :key="index"
|
|
|
- :value="item.name"
|
|
|
- >{{ item.name }}</el-option
|
|
|
- >
|
|
|
+ <el-select v-model="replaceForm.className" size="small" placeholder="请选择分类" @change="selClassFn" >
|
|
|
+ <el-option v-for="(item, index) in itemClassList" :key="index" :value="item.name" >{{ item.name }}</el-option >
|
|
|
</el-select>
|
|
|
</el-form-item>
|
|
|
|
|
|
@@ -185,9 +158,8 @@
|
|
|
</template>
|
|
|
<script>
|
|
|
import { mapGetters } from 'vuex';
|
|
|
-
|
|
|
export default {
|
|
|
- name: 'item_list',
|
|
|
+ name: 'list',
|
|
|
components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
@@ -195,17 +167,11 @@ export default {
|
|
|
sortLink: '',
|
|
|
operateData: {},
|
|
|
tabIndex: '0',
|
|
|
- tabsData: [
|
|
|
- {
|
|
|
- text: '花材列表',
|
|
|
- key: '0',
|
|
|
- },
|
|
|
- ],
|
|
|
+ tabsData: [{text:'花材列表',key:'0'}],
|
|
|
selects: {},
|
|
|
- sort: {
|
|
|
- status: false,
|
|
|
- },
|
|
|
+ sort: { status: false, },
|
|
|
classId: 0,
|
|
|
+ cpId:0,
|
|
|
addDialog: false,
|
|
|
replaceForm: {
|
|
|
name: '',
|
|
|
@@ -262,15 +228,26 @@ export default {
|
|
|
message: '排序不能为空',
|
|
|
}
|
|
|
},
|
|
|
- //分类列表
|
|
|
itemClassList: [],
|
|
|
unitList: [],
|
|
|
ratioTypeList:[{name:'固定比例',id:0},{name:'模糊比例',id:1}],
|
|
|
- currentItemId: 0
|
|
|
+ currentItemId: 0,
|
|
|
+ currentCpClassName:'',
|
|
|
+ currentItemClassName:'',
|
|
|
+ cpClassData:[],
|
|
|
+ cpClassStyle:"-1"
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
|
methods: {
|
|
|
+ getCpClass(e){
|
|
|
+ this.cpId = e
|
|
|
+ this.app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
+ },
|
|
|
+ getItemClass(e){
|
|
|
+ this.classId = e
|
|
|
+ this.app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
+ },
|
|
|
selClassFn(val) {
|
|
|
let index = this.itemClassList.findIndex((e) => e.name == val);
|
|
|
this.replaceForm.classId = this.itemClassList[index].id;
|
|
|
@@ -396,7 +373,7 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
tabClick(tab, e) {
|
|
|
- this.app.refresh({ classId: this.classId });
|
|
|
+ this.app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
},
|
|
|
onLoad({ ctx, app }) {
|
|
|
this.app = app;
|
|
|
@@ -482,26 +459,25 @@ export default {
|
|
|
})
|
|
|
.set('search', {
|
|
|
key: {
|
|
|
- placeholder: '请填写名称，支持拼音字母',
|
|
|
+ placeholder: '请填写名称',
|
|
|
},
|
|
|
})
|
|
|
.set('pagination', {
|
|
|
size: 50
|
|
|
})
|
|
|
.set('layout', [
|
|
|
- ['slot-tabs'],['search-key'],
|
|
|
- ['flex1', 'refresh-btn'],
|
|
|
+ ['slot-tabs'],
|
|
|
+ ['slot-cpClassStyle','slot-cp-class','slot-item-class','search-key','flex1', 'refresh-btn'],
|
|
|
['data-table'],
|
|
|
['flex1', 'pagination'],
|
|
|
])
|
|
|
.done();
|
|
|
- app.refresh({ classId: this.classId });
|
|
|
- },
|
|
|
-
|
|
|
- refresh(params) {
|
|
|
- this.app.refresh(params);
|
|
|
+ app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
+ this.$service.cpClass.getMenu().then(res=>{
|
|
|
+ this.cpClassData = res.list ? res.list : []
|
|
|
+ })
|
|
|
+ this.getAllClass()
|
|
|
},
|
|
|
-
|
|
|
showSort(e) {
|
|
|
this.sort.status = true;
|
|
|
},
|
|
|
@@ -509,7 +485,6 @@ export default {
|
|
|
hideSort(e) {
|
|
|
this.sort.status = false;
|
|
|
},
|
|
|
-
|
|
|
changeSort(d) {
|
|
|
this.$service.goods
|
|
|
.sort({
|
|
|
@@ -518,7 +493,7 @@ export default {
|
|
|
})
|
|
|
.then(() => {
|
|
|
this.$message.success('修改成功');
|
|
|
- this.refresh();
|
|
|
+ this.app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
})
|
|
|
.catch((err) => {
|
|
|
this.$message.error(err);
|
|
|
@@ -549,8 +524,8 @@ export default {
|
|
|
host().then((res) => {
|
|
|
this.$message.success('操作成功!')
|
|
|
this.resetForm()
|
|
|
- this.app.refresh({ classId: this.classId })
|
|
|
- });
|
|
|
+ this.app.refresh({ classId: this.classId,cpId:this.cpId,cpClassStyle:this.cpClassStyle })
|
|
|
+ })
|
|
|
}
|
|
|
});
|
|
|
},
|
