Skip to content

liangzhen / framework-tools-web

Go to a project
Commit a4fc00eb by 史敦盼
Options

收集资料配置修改

1 parent 7e8a916e
Expand all
Inline Side-by-side
Showing with 183 additions and 145 deletions
src/components/TableConfig.vue
......@@ -4,7 +4,7 @@
* @Autor: pan
* @Date: 2024-03-11 14:53:40
* @LastEditors: pan
* @LastEditTime: 2024-06-19 17:25:07
* @LastEditTime: 2024-06-24 09:39:43
-->
<!-- 示例
columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => {
......@@ -81,18 +81,28 @@
v-for="items in item.actionButtons"
:key="items.title"
v-bind="items"
:icon="typeof items.icon == 'function' ? items.icon(scope.row) : items.icon"
:icon="
typeof items.icon == 'function'
? items.icon(scope.row)
: items.icon
"
:disabled="
items.disabledCallback
? items.disabledCallback(scope.row, items.title)
: false
"
@click="item.callback(scope.row, items.title ? items.title : 'titleChange')"
>
<span v-if="items.titleChange">{{items.titleChange(scope.row, items)}}</span>
<span v-else-if="!items.circle">{{ items.title }}</span>
</el-button
@click="
item.callback(
scope.row,
items.title ? items.title : 'titleChange',
)
"
>
<span v-if="items.titleChange">{{
items.titleChange(scope.row, items)
}}</span>
<span v-else-if="!items.circle">{{ items.title }}</span>
</el-button>
</template>
</el-table-column>
<!-- 普通渲染 -->
......@@ -206,9 +216,13 @@ export default {
return [10, 20, 50, 100, 200]
},
},
queryImmediate: {
type: Boolean,
default: true,
},
},
components: {
Functional
Functional,
},
data() {
return {
......@@ -235,7 +249,9 @@ export default {
},
},
created() {
this.queryData()
if (this.queryImmediate) {
this.queryData()
}
},
methods: {
indexMethod(index) {
......
src/views/collectDataConfiguration/Detail.vue
<template>
<el-dialog
:title="title"
:visible.sync="showDialog"
width="80%"
@close="handleClose()"
>
<el-dialog
:title="title"
:visible.sync="showDialog"
width="80%"
@close="handleClose()"
@open="handleOpen()"
>
<table-config
ref="searchTable"
:query="query"
:columns="columns"
id-key="elementId"
@selection-change="selectionChange"
ref="searchTable"
:query="query"
:columns="columns"
id-key="elementId"
@selection-change="selectionChange"
:query-immediate="false"
>
</table-config>
<span slot="footer" class="dialog-footer">
<el-button v-if="title == '督查清单'" type="primary" @click="handleSubmit" size="mini" >保 存</el-button >
<el-button
v-if="title == '督查清单'"
type="primary"
@click="handleSubmit"
size="mini"
>保 存</el-button
>
<el-button @click="handleClose()" size="mini">取 消</el-button>
</span>
</el-dialog>
</el-dialog>
</template>
<script>
......@@ -25,98 +33,100 @@ import { collectDataConfiguration } from '@/api/architectureInspection'
import TableConfig from './TableConfig.vue'
export default {
components: { TableConfig },
props: {
prjCodeDetail: {
type: String,
default: '',
},
title: {
type: String,
default: '',
},
visible: {
type: Boolean,
default: false,
},
components: { TableConfig },
props: {
prjCodeDetail: {
type: String,
default: '',
},
watch: {
prjCodeDetail(v){
this.query.queryParam.prjCode = v
this.search()
},
title: {
type: String,
default: '',
},
data(){
return {
query: {
url: collectDataConfiguration,
method: 'post',
queryParam: {
prjCode: ''
},
},
selectId: ''
}
visible: {
type: Boolean,
default: false,
},
computed: {
columns() {
let arr = [
{ label: '序号', type: 'index', prop: '序号',width: '80px' },
{ label: '单位', prop: 'manageDeptName', width: '150px' },
{ label: '项目名称', prop: 'prjName', },
{ label: '项目经理', prop: 'projectManager', width: '200px' },
]
if(this.title != '督查清单'){
arr = [
{ label: '序号', type: 'index',prop: '序号', width: '80px' },
{ label: '单位', prop: 'manageDeptName', width: '150px' },
{ label: '项目名称', prop: 'prjName', },
{ label: '项目经理', prop: 'projectManager', width: '200px' },
]
}else{
arr = [
{ type: 'selection',prop: 'selection', width: '55px' },
...arr,
]
}
return [...arr]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
}
},
methods: {
handleClose() {
this.showDialog = false
},
async search(){
this.$nextTick(() => {
this.$refs.searchTable.queryData()
})
},
selectionChange(data) {
let idArr = []
data.forEach(item => {
idArr.push(item.prjCode)
})
this.selectId = idArr.join(',')
},
watch: {
// prjCodeDetail(v){
// this.query.queryParam.prjCode = v
// this.search()
// },
},
data() {
return {
query: {
url: collectDataConfiguration,
method: 'post',
queryParam: {
prjCode: '',
},
handleSubmit(){
this.$emit('selectTabel', this.selectId)
this.handleClose()
}
},
selectId: '',
}
},
computed: {
columns() {
let arr = [
{ label: '序号', type: 'index', prop: '序号', width: '80px' },
{ label: '单位', prop: 'manageDeptName', width: '150px' },
{ label: '项目名称', prop: 'prjName' },
{ label: '项目经理', prop: 'projectManager', width: '200px' },
]
if (this.title != '督查清单') {
arr = [
{ label: '序号', type: 'index', prop: '序号', width: '80px' },
{ label: '单位', prop: 'manageDeptName', width: '150px' },
{ label: '项目名称', prop: 'prjName' },
{ label: '项目经理', prop: 'projectManager', width: '200px' },
]
} else {
arr = [{ type: 'selection', prop: 'selection', width: '55px' }, ...arr]
}
return [...arr]
},
showDialog: {
get() {
return this.visible
},
set(value) {
this.$emit('update:visible', value)
},
},
},
methods: {
handleClose() {
this.showDialog = false
this.query.queryParam.prjCode = ''
},
handleOpen() {
this.query.queryParam.prjCode = this.prjCodeDetail
this.search()
},
async search() {
this.$nextTick(() => {
this.$refs.searchTable.queryData()
})
},
selectionChange(data) {
let idArr = []
data.forEach((item) => {
idArr.push(item.prjCode)
})
this.selectId = idArr.join(',')
},
handleSubmit() {
this.$emit('selectTabel', this.selectId)
this.handleClose()
},
},
}
</script>
<style lang="scss" scoped>
@import '@/styles/elementui.scss';
::v-deep .el-dialog__body{
height: 36vh;
::v-deep .el-dialog__body {
height: 36vh;
}
</style>
\ No newline at end of file
</style>
src/views/collectDataConfiguration/TableConfig.vue
......@@ -4,7 +4,7 @@
* @Autor: pan
* @Date: 2024-03-11 14:53:40
* @LastEditors: pan
* @LastEditTime: 2024-03-22 17:17:18
* @LastEditTime: 2024-06-24 09:40:41
-->
<!-- 示例
columns: [{ label: '头像', prop: 'avatar', align: 'center', __slotName: 'avatar',callback: (row, title) => {
......@@ -87,12 +87,18 @@
? items.disabledCallback(scope.row, items.title)
: false
"
@click="item.callback(scope.row, items.title ? items.title : 'titleChange')"
>
<span v-if="items.titleChange">{{items.titleChange(scope.row, items.title)}}</span>
<span v-else-if="!items.circle">{{ items.title }}</span>
</el-button
@click="
item.callback(
scope.row,
items.title ? items.title : 'titleChange',
)
"
>
<span v-if="items.titleChange">{{
items.titleChange(scope.row, items.title)
}}</span>
<span v-else-if="!items.circle">{{ items.title }}</span>
</el-button>
</template>
</el-table-column>
<!-- 普通渲染 -->
......@@ -196,6 +202,10 @@ export default {
return [10, 20, 50, 100, 200]
},
},
queryImmediate: {
type: Boolean,
default: true,
},
},
data() {
return {
......@@ -222,7 +232,9 @@ export default {
},
},
created() {
this.queryData()
if (this.queryImmediate) {
this.queryData()
}
},
methods: {
indexMethod(index) {
......@@ -233,24 +245,25 @@ export default {
clearSelection() {
this.$refs.tableConfig.clearSelection()
},
handleToText(item, state='') {
if(!state && typeof state != 'number') return
if(typeof state != 'number' && state.indexOf(',') > -1){
let stateVal = state.split(',')
let labelValue = ''
stateVal.forEach(valItem => {
const arr = item.options.find((v) => v.value == valItem) || {}
labelValue += `,${arr.label}`
});
return labelValue.slice(1, labelValue.length)
}{
let val = state
// if (!val) {
// val = item.emptyToNum || 0
// }
// let obj = item.options.find(item => item.value == val)
const obj = item.options.find((v) => v.value == val) || {}
return obj['label']
handleToText(item, state = '') {
if (!state && typeof state != 'number') return
if (typeof state != 'number' && state.indexOf(',') > -1) {
let stateVal = state.split(',')
let labelValue = ''
stateVal.forEach((valItem) => {
const arr = item.options.find((v) => v.value == valItem) || {}
labelValue += `,${arr.label}`
})
return labelValue.slice(1, labelValue.length)
}
{
let val = state
// if (!val) {
// val = item.emptyToNum || 0
// }
// let obj = item.options.find(item => item.value == val)
const obj = item.options.find((v) => v.value == val) || {}
return obj['label']
}
},
/**
......@@ -301,17 +314,17 @@ export default {
} finally {
this.loading = false
// console.log('result', result)
if(result.data){
if (result.data) {
const { data } = result
if (result && result.code === 200) {
if(data instanceof Array){
// this.pagination.totalRow = data.total
this.tableData = data
}else{
this.pagination.totalRow = data.total
this.tableData = data.records
}
this.$emit('fetchData', data)
if (data instanceof Array) {
// this.pagination.totalRow = data.total
this.tableData = data
} else {
this.pagination.totalRow = data.total
this.tableData = data.records
}
this.$emit('fetchData', data)
} else {
this.$message({
type: 'warning',
......@@ -321,7 +334,7 @@ export default {
this.pagination.current = 1
this.pagination.totalRow = 0
}
}else{
} else {
const data = result
this.pagination.totalRow = data.total
this.tableData = data.records
......@@ -344,9 +357,9 @@ export default {
}
}
},
tableRowClass(val){
tableRowClass(val) {
// console.log(val, 'tableRowClass');
if(val.row.remind && val.row.remind == '1'){
if (val.row.remind && val.row.remind == '1') {
return 'remindRed'
}
},
......@@ -366,7 +379,7 @@ export default {
margin-top: 20px;
margin-bottom: 30px;
}
/deep/ .remindRed{
/deep/ .remindRed {
color: red !important;
}
}
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!