<!--
|
* @Date: 2024-06-23 19:58:50
|
* @LastEditors: Sneed
|
* @LastEditTime: 2024-06-23 21:07:31
|
* @FilePath: /belleson-frontend/Users/mache/Documents/demo/cps-web/src/views/console/basic-data/tpmComp1.vue
|
-->
|
<template>
|
<el-conatiner>
|
<el-header>
|
<el-button type="primary" @click="addNew">新建</el-button>
|
<!-- <el-button type="primary">导入</el-button> -->
|
<import-table style="margin:0 8px" :exportUrl="exportUrlTpl" :uploadUrl="uploadUrl"></import-table>
|
<el-button type="primary" @click="exportData">导出</el-button>
|
<el-popconfirm width="220" cancel-button-text="停用" confirm-button-text="删除"
|
title="删除数据会影响已关联的业务 ,若您想在已关联的业务中依然显示这些数据, 您可以选择 停用 操作。停用后此数据将不能再被新业务使用。"
|
@confirm="table_del(selection, '0')" @cancel="table_del(selection, '1')">
|
<template #reference>
|
<el-button :disabled="selection.length == 0" type="danger" plain icon="el-icon-delete"></el-button>
|
</template>
|
</el-popconfirm>
|
<el-select v-model="params.status" placeholder="请选择" style="width: 240px;margin-left: auto;">
|
<template #prefix><span style="margin-right: 6px;">状态</span></template>
|
<el-option key="0" label="停用" :value="0" />
|
<el-option key="1" label="启用" :value="1" />
|
</el-select>
|
<el-input style="width: 240px;margin-left: 8px;" v-model="params.keyWord" placeholder="请输入检索内容"></el-input>
|
<el-button @click="search" style="margin-left: 8px;" type="primary" icon="el-icon-search"></el-button>
|
<scDialog v-model="visible">
|
<scForm v-if="visible" ref="form" :config="config" :rules="rules" v-model="form" @submit="submit">
|
</scForm>
|
</scDialog>
|
</el-header>
|
<el-main>
|
<scTable ref="table" @selection-change="handleSelectionChange" row-key="id" border :apiObj="apiObj" stripe
|
@dataChange="dataChange">
|
<el-table-column type="selection" width="55" />
|
<el-table-column prop="code" label="点检编号" />
|
<el-table-column prop="name" label="点检项目" />
|
<el-table-column prop="remark" label="点检备注" />
|
<el-table-column prop="statusName" label="点检状态" />
|
<el-table-column label="操作" fixed="right" align="left" width="160">
|
<template #default="scope">
|
<el-button-group>
|
<el-button text type="primary" size="small"
|
@click="view(scope.row, scope.$index)">查看点检项</el-button>
|
<el-button text type="primary" size="small"
|
@click="table_edit(scope.row, scope.$index)">编辑</el-button>
|
<el-popconfirm width="220" cancel-button-text="停用" confirm-button-text="删除"
|
title="删除数据会影响已关联的业务 ,若您想在已关联的业务中依然显示这些数据, 您可以选择 停用 操作。停用后此数据将不能再被新业务使用。"
|
@confirm="table_del([scope.row], '0')" @cancel="table_del([scope.row], '1')">
|
<template #reference>
|
<el-button type="danger" text size="small">删除</el-button>
|
</template>
|
</el-popconfirm>
|
</el-button-group>
|
</template>
|
</el-table-column>
|
</scTable>
|
</el-main>
|
<scDialog v-model="visibleCheck">
|
<scFormTable ref="table1" v-model="tabledata" stripe hideDelete :addTemplate="addTemplate">
|
<el-table-column label="点检项" prop="name">
|
<template #default="scope">
|
<el-input v-if="scope.row.isEdit" v-model="scope.row.name"></el-input>
|
<span v-else>{{ scope.row.name }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="数值类型" prop="valueType">
|
<template #default="scope">
|
<el-select v-if="scope.row.isEdit" v-model="scope.row.valueType" style="width: 100%;"
|
@change="change($event, scope.row)">
|
<el-option v-for="(item, index) in options" :key="index" :label="item"
|
:value="item"></el-option>
|
</el-select>
|
<span v-else>{{ scope.row.valueType }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="点检要求" prop="requirement">
|
<template #default="scope">
|
<el-input v-if="scope.row.isEdit" v-model="scope.row.requirement"></el-input>
|
<span v-else>{{ scope.row.requirement }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="标准数值" prop="standardValue" width="180">
|
<template #default="scope">
|
<el-input v-if="scope.row.isEdit && scope.row.valueType === 'Text'"
|
v-model="scope.row.standardValue"></el-input>
|
<el-input-number v-model="scope.row.standardValue"
|
v-else-if="scope.row.isEdit && scope.row.valueType === 'Number'" :min="0" />
|
|
<el-date-picker style="width: 150px" value-format="YYYY-MM-DD" v-model="scope.row.standardValue"
|
v-else-if="scope.row.isEdit && scope.row.valueType === 'Date'" type="date" />
|
<span v-else>{{ scope.row.standardValue }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" prop="state">
|
<template #default="scope">
|
<el-button-group>
|
<el-button v-show="!scope.row.id || scope.row.isEdit" text type="primary" size="small"
|
@click="add(scope.row)">保存</el-button>
|
<el-button v-show="!scope.row.id || scope.row.isEdit" text type="primary" size="small"
|
@click="cancel(scope.row)">取消</el-button>
|
<el-button v-show="!scope.row.isEdit" text type="primary" size="small"
|
@click="edit(scope.row)">编辑</el-button>
|
<el-popconfirm width="220" title="确定将选择的数据删除" @confirm="del(scope.row)">
|
<template #reference>
|
<el-button v-show="!scope.row.isEdit" text type="primary"
|
size="small">删除</el-button>
|
</template>
|
</el-popconfirm>
|
</el-button-group>
|
|
</template>
|
</el-table-column>
|
</scFormTable>
|
</scDialog>
|
</el-conatiner>
|
</template>
|
|
<script>
|
import importTable from '@/layout/components/importTable.vue'
|
export default {
|
components: {
|
importTable,
|
},
|
data() {
|
return {
|
params: {
|
status: 1,
|
key: ''
|
},
|
form: {},
|
selection: [],
|
visible: false,
|
exportUrlTpl: '/api/smis/check-project/excel/template',
|
uploadUrl: '/api/smis/check-project/excel/import',
|
config: {
|
labelWidth: 120,
|
formItems: [
|
{
|
component: 'input',
|
label: '点检编号',
|
name: 'code',
|
options: {
|
placeholder: '',
|
maxlength: 100,
|
}
|
},
|
{
|
component: 'input',
|
label: '点检项目',
|
name: 'name',
|
options: {
|
multiple: false,
|
data: []
|
},
|
disabled: false
|
},
|
{
|
component: 'input',
|
label: '备注',
|
name: 'remark',
|
type: 'textarea',
|
options: {
|
multiple: false,
|
data: []
|
},
|
disabled: false
|
},
|
{
|
component: 'select',
|
label: '状态',
|
name: 'status',
|
options: {
|
multiple: false,
|
items: [
|
{
|
value: 1,
|
label: '启用'
|
},
|
{
|
value: 0,
|
label: '停用'
|
},
|
]
|
},
|
disabled: false
|
}
|
]
|
},
|
rules: {
|
code: [
|
{ required: true, message: '请输入' },
|
],
|
name: [
|
{ required: true, message: '请输入' },
|
]
|
},
|
apiObj: {
|
get: async (data) => {
|
let params = {
|
...data,
|
...this.params
|
}
|
return await this.$HTTP.get(`/api/smis/check-project/page`, {}, { params }).then(res => {
|
res.data.records = res?.data?.records.map(v => {
|
return {
|
...v,
|
statusName: v.status ? '启用' : '禁用'
|
}
|
})
|
return res
|
})
|
}
|
},
|
visibleCheck: false,
|
tabledata: [],
|
options: ['Text', 'Number', 'Date'],
|
addTemplate: {
|
isEdit: true,
|
name: '',
|
requirement: '',
|
standardValue: '',
|
valueType: ''
|
}
|
}
|
},
|
methods: {
|
handleSelectionChange(selection) {
|
this.selection = selection
|
},
|
addNew() {
|
this.config.formItems[0].disabled = false
|
this.config.formItems[1].disabled = false
|
this.form = {
|
status: 1,
|
}
|
this.visible = true
|
},
|
table_edit(row) {
|
this.config.formItems[0].disabled = true
|
this.config.formItems[1].disabled = true
|
this.form = {
|
...row
|
}
|
this.visible = true
|
},
|
submit() {
|
if (!this.form.id) {
|
this.$HTTP.post(`/api/smis/check-project`, this.form).then(res => {
|
if (res.success) {
|
this.visible = false
|
this.search()
|
}
|
})
|
} else {
|
this.$HTTP.put(`/api/smis/check-project`, this.form).then(res => {
|
if (res.success) {
|
this.visible = false
|
this.search()
|
}
|
})
|
}
|
|
},
|
exportData() {
|
this.$HTTP.post(`/api/smis/check-project/excel/export`, {}, { params: this.params }).then(res => {
|
if (res.success) {
|
window.open(res.data.link)
|
}
|
})
|
},
|
search() {
|
this.$refs.table.reload()
|
},
|
table_del(selection, type) {
|
this.$HTTP.delete(`/api/smis/check-project?type=${type}`, {}, {
|
data: {
|
ids: selection.map(v => v.id),
|
}
|
}).then(res => {
|
if (res.success) {
|
this.search()
|
} else {
|
this.$message.error(res.msg)
|
}
|
})
|
},
|
view(row) {
|
this.selectRow = row
|
this.getList().then(() => {
|
this.visibleCheck = true
|
})
|
},
|
getList() {
|
let row = this.selectRow
|
return this.$HTTP.get(`/api/smis/check-item/list?projectId=${row.id}`).then(res => {
|
if (res.success) {
|
this.tabledata = res.data
|
}
|
})
|
},
|
del(row) {
|
this.$HTTP.delete(`/api/smis/check-item`, {}, {
|
data: {
|
ids: [row.id]
|
}
|
}).then(res => {
|
if (res.success) {
|
this.getList()
|
}
|
})
|
},
|
edit(row) {
|
row.isEdit = true
|
},
|
change(e, row) {
|
row.standardValue = ''
|
},
|
cancel(row) {
|
row.isEdit = false
|
},
|
add(row) {
|
if (!row.id) {
|
this.$HTTP.post(`/api/smis/check-item`, {
|
checkProjectId: this.selectRow.id,
|
items: [{
|
...row,
|
name: row.name,
|
requirement: row.requirement,
|
standardValue: row.standardValue,
|
valueType: row.valueType,
|
status: 1,
|
editable: true
|
}]
|
}).then(res => {
|
this.getList()
|
})
|
} else {
|
this.$HTTP.put(`/api/smis/check-item`, {
|
...row,
|
name: row.name,
|
requirement: row.requirement,
|
standardValue: row.standardValue,
|
valueType: row.valueType,
|
status: 1,
|
}).then(res => {
|
this.getList()
|
})
|
}
|
}
|
},
|
}
|
</script>
|
|
<style lang="scss" scoped></style>
|
