|
@@ -1,32 +1,10 @@
|
|
|
<template>
|
|
|
- <div class="container normal-panel">
|
|
|
- <div class="flex-align-center">
|
|
|
- </div>
|
|
|
- <el-table
|
|
|
- :data="list"
|
|
|
- style="width: 100%"
|
|
|
- border
|
|
|
- :row-key='getRowKeys'
|
|
|
- :expand-row-keys="expands"
|
|
|
- @expand-change="handleExpandChange">
|
|
|
- <el-table-column type="expand">
|
|
|
- <template slot-scope="props">
|
|
|
- <div class="container">
|
|
|
- <el-tag style="margin:0 10px 10px 0" type="danger" v-for="item in optionmxlist" :key="item.index" @close="deleteRow(item)" closable>{{item.value}}</el-tag>
|
|
|
- <slot name="add" :data="props.row"></slot>
|
|
|
- </div>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- label="分类描述"
|
|
|
- prop="remarks"
|
|
|
- width="180">
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- label="分类名称"
|
|
|
- prop="typename">
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
+ <div class="container normal-panel" >
|
|
|
+ <tableLayout :layout="tablecols" :data="list" :opwidth="200" :custom="true" :height="tableHieght" @rowClick="rowShow">
|
|
|
+ <template v-slot:customcol="scope" >
|
|
|
+ <p>{{scope.column.data[scope.column.columnname]}}</p>
|
|
|
+ </template>
|
|
|
+ </tableLayout>
|
|
|
<div style="margin-top:16px;text-align:right">
|
|
|
<el-pagination
|
|
|
background
|
|
@@ -43,6 +21,7 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import add from './add'
|
|
|
export default {
|
|
|
data () {
|
|
|
return {
|
|
@@ -50,27 +29,36 @@ export default {
|
|
|
"id": 20220901092401,
|
|
|
"content": {
|
|
|
"pageNumber": 1,
|
|
|
- "pageSize": 2,
|
|
|
+ "pageSize": 20,
|
|
|
"where":{
|
|
|
"condition":""
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
+ tableHieght:560,
|
|
|
tablecols:[],
|
|
|
- optionmxlist:[],
|
|
|
- expands: [],
|
|
|
+ // optionmxlist:[],
|
|
|
+ // expands: [],
|
|
|
list:[],
|
|
|
total:0,
|
|
|
currentPage:0,
|
|
|
- optiontypeid:0,
|
|
|
+ row:[]
|
|
|
+ // optiontypeid:0,
|
|
|
}
|
|
|
},
|
|
|
+ components:{
|
|
|
+ add
|
|
|
+ },
|
|
|
methods:{
|
|
|
async queryOptions () {
|
|
|
const res = await this.$api.requested(this.param)
|
|
|
this.list = res.data
|
|
|
this.total = res.total
|
|
|
this.currentPage = res.pageNumber
|
|
|
+ console.log(res)
|
|
|
+ },
|
|
|
+ rowShow(row){
|
|
|
+ this.$emit('rowShow',row)
|
|
|
},
|
|
|
handleSizeChange(val) {
|
|
|
// console.log(`每页 ${val} 条`);
|
|
@@ -82,45 +70,48 @@ export default {
|
|
|
this.param.content.pageNumber = val
|
|
|
this.queryOptions()
|
|
|
},
|
|
|
- async queryoptionmx (id) {
|
|
|
- const res = await this.$api.requested({
|
|
|
- "id": 20220901092501,
|
|
|
- "content": {
|
|
|
- "optiontypeid":id
|
|
|
- }
|
|
|
- })
|
|
|
- this.optionmxlist = res.data
|
|
|
- },
|
|
|
- getRowKeys: function (row) {
|
|
|
- return row.optiontypeid
|
|
|
- },
|
|
|
- handleExpandChange (row, expandedRows) {
|
|
|
- var that = this
|
|
|
- this.queryoptionmx(row.optiontypeid)
|
|
|
- this.optiontypeid = row.optiontypeid
|
|
|
- if (expandedRows.length) {
|
|
|
- that.expands = []
|
|
|
- if (row) {
|
|
|
- that.expands.push(row.optiontypeid)
|
|
|
- }
|
|
|
- } else {
|
|
|
- that.expands = []
|
|
|
- }
|
|
|
- },
|
|
|
- async deleteRow (item) {
|
|
|
- const res = await this.$api.requested({
|
|
|
- "id":20220901092701,
|
|
|
- "content": {
|
|
|
- "optiontypemxid": item.optiontypemxid
|
|
|
- }
|
|
|
- })
|
|
|
- this.tool.showMessage(res,()=>{
|
|
|
- this.queryoptionmx (this.optiontypeid)
|
|
|
- })
|
|
|
- }
|
|
|
+ // async queryoptionmx (id) {
|
|
|
+ // const res = await this.$api.requested({
|
|
|
+ // "id": 20220901092501,
|
|
|
+ // "content": {
|
|
|
+ // "optiontypeid":id
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // this.optionmxlist = res.data
|
|
|
+ // },
|
|
|
+ // getRowKeys: function (row) {
|
|
|
+ // return row.optiontypeid
|
|
|
+ // },
|
|
|
+ // handleExpandChange (row, expandedRows) {
|
|
|
+ // var that = this
|
|
|
+ // this.queryoptionmx(row.optiontypeid)
|
|
|
+ // this.optiontypeid = row.optiontypeid
|
|
|
+ // if (expandedRows.length) {
|
|
|
+ // that.expands = []
|
|
|
+ // if (row) {
|
|
|
+ // that.expands.push(row.optiontypeid)
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // that.expands = []
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ // async deleteRow (item) {
|
|
|
+ // const res = await this.$api.requested({
|
|
|
+ // "id":20220901092701,
|
|
|
+ // "content": {
|
|
|
+ // "optiontypemxid": item.optiontypemxid
|
|
|
+ // }
|
|
|
+ // })
|
|
|
+ // this.tool.showMessage(res,()=>{
|
|
|
+ // this.queryoptionmx (this.optiontypeid)
|
|
|
+ // })
|
|
|
+ // }
|
|
|
},
|
|
|
mounted () {
|
|
|
this.queryOptions()
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).optiontTable.tablecols
|
|
|
}
|
|
|
}
|
|
|
|