Merge remote-tracking branch 'origin/dev2.0' into dev2.0
commit
fb3996cc57
@ -0,0 +1,10 @@
|
|||||||
|
import axios from '@/utils/request'
|
||||||
|
|
||||||
|
|
||||||
|
export function getHeadSet(query) {
|
||||||
|
return axios({
|
||||||
|
url: "/udiwms/sys/table/head/find",
|
||||||
|
method: "get",
|
||||||
|
params: query
|
||||||
|
});
|
||||||
|
}
|
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,107 @@
|
|||||||
|
<template>
|
||||||
|
<div class="table-head">
|
||||||
|
<p class="tip">
|
||||||
|
<i class="el-icon-s-opportunity"></i>
|
||||||
|
<span> 可拖动行排序</span>
|
||||||
|
</p>
|
||||||
|
<el-table
|
||||||
|
row-key="prop"
|
||||||
|
:data="tableShowList">
|
||||||
|
<el-table-column prop="label" label="表头名称" align="center"></el-table-column>
|
||||||
|
<el-table-column label="是否显示" width="120" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<el-checkbox v-model="scope.row.isShow"></el-checkbox>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="调整顺序" width="120" align="center">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<i class="el-icon-rank"></i>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="调整表头宽度">
|
||||||
|
<template slot-scope="scope">
|
||||||
|
<div class="flex-col">
|
||||||
|
<div>
|
||||||
|
<el-radio v-model="scope.row.isAuto" :label="true">自适应</el-radio>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-radio v-model="scope.row.isAuto" :label="false">固定宽度</el-radio>
|
||||||
|
<el-input-number v-show="!scope.row.isAuto" v-model="scope.row.width" size="mini"
|
||||||
|
controls-position="right" :min="100" :max="300"></el-input-number>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
<div slot="footer" class="dialog-footer tc">
|
||||||
|
<el-button size="medium" class="btn-wh" @click="isTableHead = false">关闭</el-button>
|
||||||
|
<el-button size="medium" class="btn-blue" type="primary" @click="saveTableHead()">保存</el-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import Sortable from 'sortablejs';
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "tableHead",
|
||||||
|
props: {
|
||||||
|
tableShowList: Array
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isTableHead: false
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
rowDrop() {
|
||||||
|
debugger
|
||||||
|
const tbody = document.querySelector('.table-head .el-table__body-wrapper tbody');
|
||||||
|
const _this = this;
|
||||||
|
Sortable.create(tbody, {
|
||||||
|
onEnd({newIndex, oldIndex}) {
|
||||||
|
const currRow = _this.tableShowList.splice(oldIndex, 1)[0];
|
||||||
|
_this.tableShowList.splice(newIndex, 0, currRow);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
saveTableHead() {
|
||||||
|
this.isTableHead = false;
|
||||||
|
this.$emit('saveTableHead', this.tableShowList);
|
||||||
|
},
|
||||||
|
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
debugger
|
||||||
|
this.rowDrop();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.table-head {
|
||||||
|
|
||||||
|
.tip {
|
||||||
|
|
||||||
|
i {
|
||||||
|
color: #E6A23C;
|
||||||
|
}
|
||||||
|
|
||||||
|
font-size: 14px;
|
||||||
|
padding-bottom: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.el-icon-rank {
|
||||||
|
font-size: 18px;
|
||||||
|
margin-left: 20px;
|
||||||
|
cursor: move;
|
||||||
|
}
|
||||||
|
|
||||||
|
.point {
|
||||||
|
color: #66b1ff;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
color: #1A3679;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
@ -0,0 +1,13 @@
|
|||||||
|
<template>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "AddHeadData"
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
|
||||||
|
</style>
|
Loading…
Reference in New Issue