|
@@ -1,190 +1,216 @@
|
|
|
<template>
|
|
|
<div class="data-list">
|
|
|
-
|
|
|
-
|
|
|
- <el-table
|
|
|
- :data="dataList"
|
|
|
- stripe
|
|
|
- lazy
|
|
|
- :load="loadData"
|
|
|
- row-key="id"
|
|
|
- :tree-props="{ children: 'children' }"
|
|
|
- show-overflow-tooltip
|
|
|
- style="width: 100%"
|
|
|
- header-row-class-name="headerBg"
|
|
|
- empty-text="没有分类信息"
|
|
|
+ <el-table
|
|
|
+ :data="dataList"
|
|
|
+ stripe
|
|
|
+ lazy
|
|
|
+ :load="loadData"
|
|
|
+ row-key="id"
|
|
|
+ :tree-props="{ children: 'children', hasChildren: 'hasChildren' }"
|
|
|
+ show-overflow-tooltip
|
|
|
+ style="width: 100%"
|
|
|
+ header-row-class-name="headerBg"
|
|
|
+ empty-text="没有分类信息"
|
|
|
+ >
|
|
|
+ <el-table-column prop="id" label="ID" align="center" width="80" />
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="分类名称"
|
|
|
+ align="left"
|
|
|
+ min-width="180"
|
|
|
+ />
|
|
|
+ <!-- <el-table-column prop="intro" label="分类介绍" align="left" min-width="180"/> -->
|
|
|
+ <el-table-column
|
|
|
+ prop="createTime"
|
|
|
+ label="创建时间"
|
|
|
+ align="center"
|
|
|
+ width="180"
|
|
|
+ />
|
|
|
+ <el-table-column
|
|
|
+ prop="status"
|
|
|
+ label="分类状态"
|
|
|
+ align="center"
|
|
|
+ width="180"
|
|
|
>
|
|
|
- <el-table-column prop="id" label="ID" align="center" width="80"/>
|
|
|
- <el-table-column prop="name" label="分类名称" align="left" min-width="180"/>
|
|
|
-<!-- <el-table-column prop="intro" label="分类介绍" align="left" min-width="180"/> -->
|
|
|
- <el-table-column prop="createTime" label="创建时间" align="center" width="180"/>
|
|
|
- <el-table-column prop="status" label="分类状态" align="center" width="180">
|
|
|
- <template #default="scope">
|
|
|
- <div v-if="scope.row.status==5">启用</div>
|
|
|
- <div v-if="scope.row.status==6">停用</div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作" fixed="right" align="center" width="180">
|
|
|
- <template #default="scope">
|
|
|
- <div class="btns">
|
|
|
- <el-button type="primary" size="small" @click="btnEdit(scope.row)"><svg-icon icon-class="edit"/>编辑</el-button>
|
|
|
- <el-button type="danger" size="small" @click="btnDelete(scope.row.id)"><svg-icon icon-class="delete"/>删除</el-button>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
-
|
|
|
-
|
|
|
- <div class="page-info">
|
|
|
- <el-pagination
|
|
|
- v-model:currentPage="queryForm.page"
|
|
|
- :page-size="queryForm.pageSize"
|
|
|
- :total="recordCount"
|
|
|
- :page-count="pageTotal"
|
|
|
- background
|
|
|
- layout="prev, pager, next"
|
|
|
- @current-change="ChangePage"
|
|
|
- >
|
|
|
- </el-pagination>
|
|
|
- </div>
|
|
|
-
|
|
|
- <el-dialog :visible.sync="dialogVisible" append-to-body v-el-drag-dialog width="50%" custom-class="prod-verify" title="创建模板分类">
|
|
|
-
|
|
|
- <dataInfo :id="currentDataId" @onClose="onClose" ></dataInfo>
|
|
|
- </el-dialog>
|
|
|
-
|
|
|
+ <template #default="scope">
|
|
|
+ <div v-if="scope.row.status == 5">启用</div>
|
|
|
+ <div v-if="scope.row.status == 6">停用</div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" fixed="right" align="center" width="180">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="btns">
|
|
|
+ <el-button type="primary" size="small" @click="btnEdit(scope.row)"
|
|
|
+ ><svg-icon icon-class="edit" />编辑</el-button
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="danger"
|
|
|
+ size="small"
|
|
|
+ @click="btnDelete(scope.row.id)"
|
|
|
+ ><svg-icon icon-class="delete" />删除</el-button
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="page-info">
|
|
|
+ <el-pagination
|
|
|
+ v-model:currentPage="queryForm.page"
|
|
|
+ :page-size="queryForm.pageSize"
|
|
|
+ :total="recordCount"
|
|
|
+ :page-count="pageTotal"
|
|
|
+ background
|
|
|
+ layout="prev, pager, next"
|
|
|
+ @current-change="ChangePage"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ append-to-body
|
|
|
+ v-el-drag-dialog
|
|
|
+ width="50%"
|
|
|
+ custom-class="prod-verify"
|
|
|
+ title="创建模板分类"
|
|
|
+ >
|
|
|
+ <dataInfo :id="currentDataId" @onClose="onClose"></dataInfo>
|
|
|
+ </el-dialog>
|
|
|
</div>
|
|
|
-
|
|
|
-
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import{searchTemplateCategory,deleteTemplateCategory} from'@/api/template';
|
|
|
- import dataInfo from './dataInfo.vue';
|
|
|
- import elDragDialog from '@/directive/el-drag-dialog'
|
|
|
- export default{
|
|
|
- components:{
|
|
|
- dataInfo,
|
|
|
- },
|
|
|
- directives: { elDragDialog },
|
|
|
- props:{
|
|
|
- queryForm:{
|
|
|
- type:Object,
|
|
|
- default:()=>{
|
|
|
- return {
|
|
|
- page:1,
|
|
|
- pageSize:10,
|
|
|
- name:'',
|
|
|
- parent_id:'',
|
|
|
- sign:'',
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- watch:{
|
|
|
-
|
|
|
- 'queryForm': {
|
|
|
- handler: function(val) {
|
|
|
-
|
|
|
- this.search();
|
|
|
- },
|
|
|
- immediate: true,//立即执行
|
|
|
- deep: true
|
|
|
-
|
|
|
- },
|
|
|
+import { searchTemplateCategory, deleteTemplateCategory } from "@/api/template";
|
|
|
+import dataInfo from "./dataInfo.vue";
|
|
|
+import elDragDialog from "@/directive/el-drag-dialog";
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ dataInfo,
|
|
|
+ },
|
|
|
+ directives: { elDragDialog },
|
|
|
+ props: {
|
|
|
+ queryForm: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {
|
|
|
+ return {
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ name: "",
|
|
|
+ parent_id: 0,
|
|
|
+ sign: "",
|
|
|
+ };
|
|
|
+ },
|
|
|
},
|
|
|
- data(){
|
|
|
- return{
|
|
|
- dialogVisible:false,//控制产品审核
|
|
|
- currentDataId:0,
|
|
|
- recordCount:0,
|
|
|
- pageTotal:1,
|
|
|
- dataList:[],
|
|
|
- currentData:{},
|
|
|
- }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ queryForm: {
|
|
|
+ handler: function (val) {
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ immediate: true, //立即执行
|
|
|
+ deep: true,
|
|
|
},
|
|
|
- mounted() {
|
|
|
- this.search();
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dialogVisible: false, //控制产品审核
|
|
|
+ currentDataId: 0,
|
|
|
+ recordCount: 0,
|
|
|
+ pageTotal: 1,
|
|
|
+ dataList: [],
|
|
|
+ currentData: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.search();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ btnView(e) {
|
|
|
+ let _this = this;
|
|
|
+ _this.queryForm.parent_id = e;
|
|
|
+ _this.search();
|
|
|
+
|
|
|
+ // _this.$router.push({path:"/template/category/search",params:{parent_id:e}});
|
|
|
+ // location.href="?parent_id="+e;
|
|
|
},
|
|
|
- methods:{
|
|
|
-
|
|
|
- btnView(e){
|
|
|
- let _this=this;
|
|
|
- _this.queryForm.parent_id=e;
|
|
|
- _this.search();
|
|
|
-
|
|
|
- // _this.$router.push({path:"/template/category/search",params:{parent_id:e}});
|
|
|
- // location.href="?parent_id="+e;
|
|
|
- },
|
|
|
|
|
|
- loadData(row,node,resolve){
|
|
|
- setTimeout(()=>{
|
|
|
- resolve(row.children);
|
|
|
- },100);
|
|
|
- },
|
|
|
+ loadData(row, node, resolve) {
|
|
|
+ setTimeout(() => {
|
|
|
+ searchTemplateCategory({parent_id:row.id}).then(res=>{
|
|
|
+ if(res.data.length==0){
|
|
|
+ this.$message.warning('暂无数据!')
|
|
|
+ }
|
|
|
+ resolve(res.data)
|
|
|
+ })
|
|
|
+
|
|
|
+ /* resolve(row.children); */
|
|
|
+ }, 0);
|
|
|
+ },
|
|
|
|
|
|
- btnDelete(e){
|
|
|
- let _this=this;
|
|
|
- let par={
|
|
|
- id:e,
|
|
|
- }
|
|
|
- _this.$confirm("您是否确认删除该记录?","提示",{
|
|
|
- confirmButtonText: '确认',
|
|
|
- cancelButtonText: '取消',
|
|
|
- type: 'warning',
|
|
|
- }).then((res)=>{
|
|
|
+ btnDelete(e) {
|
|
|
+ let _this = this;
|
|
|
+ let par = {
|
|
|
+ id: e,
|
|
|
+ };
|
|
|
+ _this
|
|
|
+ .$confirm("您是否确认删除该记录?", "提示", {
|
|
|
+ confirmButtonText: "确认",
|
|
|
+ cancelButtonText: "取消",
|
|
|
+ type: "warning",
|
|
|
+ })
|
|
|
+ .then((res) => {
|
|
|
// console.log("AAA")
|
|
|
- deleteTemplateCategory(par).then(res=>{
|
|
|
- _this.search();
|
|
|
- })
|
|
|
- }).catch(()=>{
|
|
|
+ deleteTemplateCategory(par).then((res) => {
|
|
|
+ _this.search();
|
|
|
+ });
|
|
|
})
|
|
|
- },
|
|
|
-
|
|
|
-
|
|
|
- searchData(){
|
|
|
- let _this=this;
|
|
|
- _this.dialogVisible=false;
|
|
|
- _this.search();
|
|
|
- },
|
|
|
-
|
|
|
+ .catch(() => {});
|
|
|
+ },
|
|
|
|
|
|
- //编辑
|
|
|
- btnEdit(e){
|
|
|
- let _this=this;
|
|
|
- _this.currentDataId=e.id;
|
|
|
- _this.dialogVisible=true;
|
|
|
- },
|
|
|
+ searchData() {
|
|
|
+ let _this = this;
|
|
|
+ _this.dialogVisible = false;
|
|
|
+ _this.search();
|
|
|
+ },
|
|
|
|
|
|
- onClose(){
|
|
|
- let _this=this;
|
|
|
- _this.currentDataId=0;
|
|
|
- _this.dialogVisible=false;
|
|
|
- _this.search();
|
|
|
- },
|
|
|
+ //编辑
|
|
|
+ btnEdit(e) {
|
|
|
+ let _this = this;
|
|
|
+ _this.currentDataId = e.id;
|
|
|
+ _this.dialogVisible = true;
|
|
|
+ },
|
|
|
|
|
|
- //搜索
|
|
|
- search(){
|
|
|
- let _this=this;
|
|
|
+ onClose() {
|
|
|
+ let _this = this;
|
|
|
+ _this.currentDataId = 0;
|
|
|
+ _this.dialogVisible = false;
|
|
|
+ _this.search();
|
|
|
+ },
|
|
|
|
|
|
- searchTemplateCategory(_this.queryForm).then(res=>{
|
|
|
- if(!res)return;
|
|
|
- _this.dataList=res.data.dataList;
|
|
|
- _this.recordCount=res.data.totalRecord;
|
|
|
- _this.pageTotal=res.data.totalPage;
|
|
|
+ //搜索
|
|
|
+ search() {
|
|
|
+ let _this = this;
|
|
|
+ searchTemplateCategory(_this.queryForm).then((res) => {
|
|
|
+ if (!res) return;
|
|
|
+ res.data.dataList.map(el=>{
|
|
|
+ el.hasChildren=true
|
|
|
})
|
|
|
- },
|
|
|
- //修改分页
|
|
|
- ChangePage(e){
|
|
|
- let _this=this;
|
|
|
- _this.queryForm.page=e;
|
|
|
- _this.search();
|
|
|
- },
|
|
|
- }
|
|
|
- }
|
|
|
+ _this.dataList = res.data.dataList;
|
|
|
+ _this.recordCount = res.data.totalRecord;
|
|
|
+ _this.pageTotal = res.data.totalPage;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //修改分页
|
|
|
+ ChangePage(e) {
|
|
|
+ let _this = this;
|
|
|
+ _this.queryForm.page = e;
|
|
|
+ _this.search();
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
-@import './dataList.scss';
|
|
|
+@import "./dataList.scss";
|
|
|
</style>
|