update 质量类型

This commit is contained in:
lb 2023-07-31 17:04:07 +08:00
parent 3efb35d31d
commit 443ca29d3f

View File

@ -1,214 +1,351 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<!-- 搜索工作栏 -->
<el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="68px">
<el-form-item label="检测类型名称" prop="name">
<el-input
v-model="queryParams.name"
placeholder="请输入检测类型名称"
clearable
@keyup.enter.native="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" @click="handleQuery">
搜索
</el-button>
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<!-- 搜索工作栏 --> <div
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px"> class="s"
<el-form-item label="检测类型名称" prop="name"> style="
<el-input v-model="queryParams.name" placeholder="请输入检测类型名称" clearable @keyup.enter.native="handleQuery"/> margin: 8px 0;
</el-form-item> padding: 4px 12px;
<el-form-item> border: 1px solid #ccc;
<el-button type="primary" icon="el-icon-search" @click="handleQuery">搜索</el-button> background: #f3f3f3;
<el-button icon="el-icon-refresh" @click="resetQuery">重置</el-button> ">
</el-form-item> <SearchBar
</el-form> :formConfigs="searchBarFormConfig"
ref="search-bar"
@headBtnClick="handleSearchBarBtnClick" />
</div>
<!-- 操作工具栏 --> <!-- 操作工具栏 -->
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" <el-button
v-hasPermi="['base:quality-inspection-type:create']">新增</el-button> type="primary"
</el-col> plain
<el-col :span="1.5"> icon="el-icon-plus"
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" :loading="exportLoading" size="mini"
v-hasPermi="['base:quality-inspection-type:export']">导出</el-button> @click="handleAdd"
</el-col> v-hasPermi="['base:quality-inspection-type:create']">
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> 新增
</el-row> </el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
:loading="exportLoading"
v-hasPermi="['base:quality-inspection-type:export']">
导出
</el-button>
</el-col>
<right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"></right-toolbar>
</el-row>
<!-- 列表 --> <!-- 列表 -->
<el-table v-loading="loading" :data="list"> <el-table v-loading="loading" :data="list">
<el-table-column label="ID" align="center" prop="id" /> <el-table-column label="ID" align="center" prop="id" />
<el-table-column label="检测类型名称" align="center" prop="name" /> <el-table-column label="检测类型名称" align="center" prop="name" />
<el-table-column label="检测类型编码" align="center" prop="code" /> <el-table-column label="检测类型编码" align="center" prop="code" />
<el-table-column label="备注" align="center" prop="remark" /> <el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="创建时间" align="center" prop="createTime" width="180"> <el-table-column
<template v-slot="scope"> label="创建时间"
<span>{{ parseTime(scope.row.createTime) }}</span> align="center"
</template> prop="createTime"
</el-table-column> width="180">
<el-table-column label="操作" align="center" class-name="small-padding fixed-width"> <template v-slot="scope">
<template v-slot="scope"> <span>{{ parseTime(scope.row.createTime) }}</span>
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" </template>
v-hasPermi="['base:quality-inspection-type:update']">修改</el-button> </el-table-column>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" <el-table-column
v-hasPermi="['base:quality-inspection-type:delete']">删除</el-button> label="操作"
</template> align="center"
</el-table-column> class-name="small-padding fixed-width">
</el-table> <template v-slot="scope">
<!-- 分页组件 --> <el-button
<pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNo" :limit.sync="queryParams.pageSize" size="mini"
@pagination="getList"/> type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['base:quality-inspection-type:update']">
修改
</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['base:quality-inspection-type:delete']">
删除
</el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页组件 -->
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNo"
:limit.sync="queryParams.pageSize"
@pagination="getList" />
<!-- 对话框(添加 / 修改) --> <!-- 对话框(添加 / 修改) -->
<el-dialog :title="title" :visible.sync="open" width="500px" v-dialogDrag append-to-body> <el-dialog
<el-form ref="form" :model="form" :rules="rules" label-width="80px"> :title="title"
<el-form-item label="检测类型名称" prop="name"> :visible.sync="open"
<el-input v-model="form.name" placeholder="请输入检测类型名称" /> width="500px"
</el-form-item> v-dialogDrag
<el-form-item label="检测类型编码" prop="code"> append-to-body>
<el-input v-model="form.code" placeholder="请输入检测类型编码" /> <el-form ref="form" :model="form" :rules="rules" label-width="80px">
</el-form-item> <el-form-item label="检测类型名称" prop="name">
<el-form-item label="备注" prop="remark"> <el-input v-model="form.name" placeholder="请输入检测类型名称" />
<el-input v-model="form.remark" placeholder="请输入备注" /> </el-form-item>
</el-form-item> <el-form-item label="检测类型编码" prop="code">
</el-form> <el-input v-model="form.code" placeholder="请输入检测类型编码" />
<div slot="footer" class="dialog-footer"> </el-form-item>
<el-button type="primary" @click="submitForm"> </el-button> <el-form-item label="备注" prop="remark">
<el-button @click="cancel"> </el-button> <el-input v-model="form.remark" placeholder="请输入备注" />
</div> </el-form-item>
</el-dialog> </el-form>
</div> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button>
<el-button @click="cancel"> </el-button>
</div>
</el-dialog>
</div>
</template> </template>
<script> <script>
import { createQualityInspectionType, updateQualityInspectionType, deleteQualityInspectionType, getQualityInspectionType, getQualityInspectionTypePage, exportQualityInspectionTypeExcel } from "@/api/base/qualityInspectionType"; import {
createQualityInspectionType,
updateQualityInspectionType,
deleteQualityInspectionType,
getQualityInspectionType,
getQualityInspectionTypePage,
exportQualityInspectionTypeExcel,
} from '@/api/base/qualityInspectionType';
export default { export default {
name: "QualityInspectionType", name: 'QualityInspectionType',
components: { components: {},
}, data() {
data() { return {
return { //
// loading: true,
loading: true, //
// exportLoading: false,
exportLoading: false, //
// showSearch: true,
showSearch: true, //
// total: 0,
total: 0, //
// list: [],
list: [], //
// title: '',
title: "", //
// open: false,
open: false, //
// queryParams: {
queryParams: { pageNo: 1,
pageNo: 1, pageSize: 10,
pageSize: 10, name: null,
name: null, },
}, //
// form: {},
form: {}, //
// rules: {
rules: { name: [
name: [{ required: true, message: "检测类型名称不能为空", trigger: "blur" }], { required: true, message: '检测类型名称不能为空', trigger: 'blur' },
} ],
}; },
}, //
created() { //
this.getList(); //
}, searchBarFormConfig: [
methods: { {
/** 查询列表 */ type: 'input',
getList() { label: '检测类型',
this.loading = true; placeholder: '请输入检测类型',
// param: 'name',
getQualityInspectionTypePage(this.queryParams).then(response => { },
this.list = response.data.list; {
this.total = response.data.total; type: 'button',
this.loading = false; btnName: '查询',
}); name: 'search',
}, color: 'primary',
/** 取消按钮 */ },
cancel() { {
this.open = false; type: 'button',
this.reset(); btnName: '重置',
}, name: 'reset',
/** 表单重置 */ },
reset() { {
this.form = { type: 'button',
id: undefined, btnName: '新增',
name: undefined, name: 'add',
code: undefined, plain: true,
remark: undefined, color: 'primary',
}; },
this.resetForm("form"); {
}, type: 'button',
/** 搜索按钮操作 */ btnName: '导出',
handleQuery() { name: 'export',
this.queryParams.pageNo = 1; color: 'warning'
this.getList(); },
}, ],
/** 重置按钮操作 */ };
resetQuery() { },
this.resetForm("queryForm"); created() {
this.handleQuery(); this.getList();
}, },
/** 新增按钮操作 */ methods: {
handleAdd() { /** search bar related */
this.reset(); handleSearchBarBtnClick(btn) {
this.open = true; console.log('btn', btn)
this.title = "添加质量检测类型基础"; switch (btn.btnName) {
}, case 'search':
/** 修改按钮操作 */ this.getList();
handleUpdate(row) { break;
this.reset(); case 'reset':
const id = row.id; this.$refs['search-bar'].resetForm();
getQualityInspectionType(id).then(response => { this.$nextTick(() => {
this.form = response.data; this.getList();
this.open = true; });
this.title = "修改质量检测类型基础"; break;
}); }
}, },
/** 提交按钮 */
submitForm() { /** 查询列表 */
this.$refs["form"].validate(valid => { getList() {
if (!valid) { this.loading = true;
return; //
} getQualityInspectionTypePage(this.queryParams).then((response) => {
// this.list = response.data.list;
if (this.form.id != null) { this.total = response.data.total;
updateQualityInspectionType(this.form).then(response => { this.loading = false;
this.$modal.msgSuccess("修改成功"); });
this.open = false; },
this.getList(); /** 取消按钮 */
}); cancel() {
return; this.open = false;
} this.reset();
// },
createQualityInspectionType(this.form).then(response => { /** 表单重置 */
this.$modal.msgSuccess("新增成功"); reset() {
this.open = false; this.form = {
this.getList(); id: undefined,
}); name: undefined,
}); code: undefined,
}, remark: undefined,
/** 删除按钮操作 */ };
handleDelete(row) { this.resetForm('form');
const id = row.id; },
this.$modal.confirm('是否确认删除质量检测类型基础编号为"' + id + '"的数据项?').then(function() { /** 搜索按钮操作 */
return deleteQualityInspectionType(id); handleQuery() {
}).then(() => { this.queryParams.pageNo = 1;
this.getList(); this.getList();
this.$modal.msgSuccess("删除成功"); },
}).catch(() => {}); /** 重置按钮操作 */
}, resetQuery() {
/** 导出按钮操作 */ this.resetForm('queryForm');
handleExport() { this.handleQuery();
// },
let params = {...this.queryParams}; /** 新增按钮操作 */
params.pageNo = undefined; handleAdd() {
params.pageSize = undefined; this.reset();
this.$modal.confirm('是否确认导出所有质量检测类型基础数据项?').then(() => { this.open = true;
this.exportLoading = true; this.title = '添加质量检测类型基础';
return exportQualityInspectionTypeExcel(params); },
}).then(response => { /** 修改按钮操作 */
this.$download.excel(response, '质量检测类型基础.xls'); handleUpdate(row) {
this.exportLoading = false; this.reset();
}).catch(() => {}); const id = row.id;
} getQualityInspectionType(id).then((response) => {
} this.form = response.data;
this.open = true;
this.title = '修改质量检测类型基础';
});
},
/** 提交按钮 */
submitForm() {
this.$refs['form'].validate((valid) => {
if (!valid) {
return;
}
//
if (this.form.id != null) {
updateQualityInspectionType(this.form).then((response) => {
this.$modal.msgSuccess('修改成功');
this.open = false;
this.getList();
});
return;
}
//
createQualityInspectionType(this.form).then((response) => {
this.$modal.msgSuccess('新增成功');
this.open = false;
this.getList();
});
});
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id;
this.$modal
.confirm('是否确认删除质量检测类型基础编号为"' + id + '"的数据项?')
.then(function () {
return deleteQualityInspectionType(id);
})
.then(() => {
this.getList();
this.$modal.msgSuccess('删除成功');
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
//
let params = { ...this.queryParams };
params.pageNo = undefined;
params.pageSize = undefined;
this.$modal
.confirm('是否确认导出所有质量检测类型基础数据项?')
.then(() => {
this.exportLoading = true;
return exportQualityInspectionTypeExcel(params);
})
.then((response) => {
this.$download.excel(response, '质量检测类型基础.xls');
this.exportLoading = false;
})
.catch(() => {});
},
},
}; };
</script> </script>