You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

670 lines
34 KiB
Vue

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<div class="app-container">
<!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="类型" prop="type">
<el-input
v-model="queryParams.type"
placeholder="请输入类型"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="安装柜体名称" prop="installationCabinetName">
<el-input
v-model="queryParams.installationCabinetName"
placeholder="请输入安装柜体名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="位置描述" prop="locationDescription">
<el-input
v-model="queryParams.locationDescription"
placeholder="请输入位置描述"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="来源" prop="source">
<el-input
v-model="queryParams.source"
placeholder="请输入来源"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="取电" prop="powerSource">
<el-input
v-model="queryParams.powerSource"
placeholder="请输入取电"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="图片地址" prop="imageAddress">
<el-input
v-model="queryParams.imageAddress"
placeholder="请输入图片地址"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第1次" prop="firstInstance">
<el-input
v-model="queryParams.firstInstance"
placeholder="请输入第1次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第2次" prop="secondInstance">
<el-input
v-model="queryParams.secondInstance"
placeholder="请输入第2次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第3次" prop="thirdInstance">
<el-input
v-model="queryParams.thirdInstance"
placeholder="请输入第3次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第4次" prop="fourthInstance">
<el-input
v-model="queryParams.fourthInstance"
placeholder="请输入第4次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第5次" prop="fifthInstance">
<el-input
v-model="queryParams.fifthInstance"
placeholder="请输入第5次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第6次" prop="sixthInstance">
<el-input
v-model="queryParams.sixthInstance"
placeholder="请输入第6次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第7次" prop="seventhInstance">
<el-input
v-model="queryParams.seventhInstance"
placeholder="请输入第7次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第8次" prop="eighthInstance">
<el-input
v-model="queryParams.eighthInstance"
placeholder="请输入第8次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第9次" prop="ninthInstance">
<el-input
v-model="queryParams.ninthInstance"
placeholder="请输入第9次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第10次" prop="tenthInstance">
<el-input
v-model="queryParams.tenthInstance"
placeholder="请输入第10次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第11次" prop="eleventhInstance">
<el-input
v-model="queryParams.eleventhInstance"
placeholder="请输入第11次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="第12次" prop="twelfthInstance">
<el-input
v-model="queryParams.twelfthInstance"
placeholder="请输入第12次"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form> -->
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:add']"
>新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:edit']"
>修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:remove']"
>删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="el-icon-download"
size="mini"
@click="handleExport"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:export']"
>导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="info"
plain
icon="el-icon-upload2"
size="mini"
@click="handleImport"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:add']"
>导入</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="plcBufferBatteryLifecycleList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="主键自增ID" align="center" prop="objid" v-if="columns[0].visible"/>
<el-table-column label="类型" align="center" prop="type" v-if="columns[1].visible"/>
<el-table-column label="安装柜体名称" align="center" prop="installationCabinetName" v-if="columns[2].visible"/>
<el-table-column label="位置描述" align="center" prop="locationDescription" v-if="columns[3].visible"/>
<el-table-column label="来源" align="center" prop="source" v-if="columns[4].visible"/>
<el-table-column label="取电" align="center" prop="powerSource" v-if="columns[5].visible"/>
<el-table-column label="图片地址" align="center" prop="imageAddress" width="100" v-if="columns[6].visible">
<template slot-scope="scope">
<image-preview :src="scope.row.imageAddress" :width="50" :height="50"/>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remarks" v-if="columns[7].visible"/>
<el-table-column label="第1次" align="center" prop="firstInstance" v-if="columns[8].visible"/>
<el-table-column label="第2次" align="center" prop="secondInstance" v-if="columns[9].visible"/>
<el-table-column label="第3次" align="center" prop="thirdInstance" v-if="columns[10].visible"/>
<el-table-column label="第4次" align="center" prop="fourthInstance" v-if="columns[11].visible"/>
<el-table-column label="第5次" align="center" prop="fifthInstance" v-if="columns[12].visible"/>
<el-table-column label="第6次" align="center" prop="sixthInstance" v-if="columns[13].visible"/>
<el-table-column label="第7次" align="center" prop="seventhInstance" v-if="columns[14].visible"/>
<el-table-column label="第8次" align="center" prop="eighthInstance" v-if="columns[15].visible"/>
<el-table-column label="第9次" align="center" prop="ninthInstance" v-if="columns[16].visible"/>
<el-table-column label="第10次" align="center" prop="tenthInstance" v-if="columns[17].visible"/>
<el-table-column label="第11次" align="center" prop="eleventhInstance" v-if="columns[18].visible"/>
<el-table-column label="第12次" align="center" prop="twelfthInstance" v-if="columns[19].visible"/>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:edit']"
>修改</el-button>
<el-button
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['ems/info:plcBufferBatteryLifecycle:remove']"
>删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改行李系统PLC缓冲电池生命周期对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item label="类型" prop="type">
<el-input v-model="form.type" placeholder="请输入类型" />
</el-form-item>
<el-form-item label="安装柜体名称" prop="installationCabinetName">
<el-input v-model="form.installationCabinetName" placeholder="请输入安装柜体名称" />
</el-form-item>
<el-form-item label="位置描述" prop="locationDescription">
<el-input v-model="form.locationDescription" placeholder="请输入位置描述" />
</el-form-item>
<el-form-item label="来源" prop="source">
<el-input v-model="form.source" placeholder="请输入来源" />
</el-form-item>
<el-form-item label="取电" prop="powerSource">
<el-input v-model="form.powerSource" placeholder="请输入取电" />
</el-form-item>
<el-form-item label="图片地址" prop="imageAddress">
<image-upload v-model="form.imageAddress"/>
</el-form-item>
<el-form-item label="备注" prop="remarks">
<el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" />
</el-form-item>
<el-form-item label="第1次" prop="firstInstance">
<el-date-picker
v-model="form.firstInstance"
type="date"
placeholder="请选择第1次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第2次" prop="secondInstance">
<el-date-picker
v-model="form.secondInstance"
type="date"
placeholder="请选择第2次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第3次" prop="thirdInstance">
<el-date-picker
v-model="form.thirdInstance"
type="date"
placeholder="请选择第3次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第4次" prop="fourthInstance">
<el-date-picker
v-model="form.fourthInstance"
type="date"
placeholder="请选择第4次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第5次" prop="fifthInstance">
<el-date-picker
v-model="form.fifthInstance"
type="date"
placeholder="请选择第5次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第6次" prop="sixthInstance">
<el-date-picker
v-model="form.sixthInstance"
type="date"
placeholder="请选择第6次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第7次" prop="seventhInstance">
<el-date-picker
v-model="form.seventhInstance"
type="date"
placeholder="请选择第7次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第8次" prop="eighthInstance">
<el-date-picker
v-model="form.eighthInstance"
type="date"
placeholder="请选择第8次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第9次" prop="ninthInstance">
<el-date-picker
v-model="form.ninthInstance"
type="date"
placeholder="请选择第9次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第10次" prop="tenthInstance">
<el-date-picker
v-model="form.tenthInstance"
type="date"
placeholder="请选择第10次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第11次" prop="eleventhInstance">
<el-date-picker
v-model="form.eleventhInstance"
type="date"
placeholder="请选择第11次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
<el-form-item label="第12次" prop="twelfthInstance">
<el-date-picker
v-model="form.twelfthInstance"
type="date"
placeholder="请选择第12次日期"
value-format="yyyy/MM/dd"
format="yyyy/MM/dd"
/>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<!-- 导入对话框 -->
<el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
<el-upload
ref="upload"
:limit="1"
accept=".xlsx, .xls"
:headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport"
:disabled="upload.isUploading"
:on-progress="handleFileUploadProgress"
:on-success="handleFileSuccess"
:auto-upload="false"
drag
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
<div class="el-upload__tip text-center" slot="tip">
<!-- <div class="el-upload__tip" slot="tip">-->
<!-- <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的数据-->
<!-- </div>-->
<span>仅允许导入xls、xlsx格式文件。</span>
<!-- <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>-->
</div>
</el-upload>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitFileForm">确 定</el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listPlcBufferBatteryLifecycle, getPlcBufferBatteryLifecycle, delPlcBufferBatteryLifecycle, addPlcBufferBatteryLifecycle, updatePlcBufferBatteryLifecycle } from "@/api/ems/info/plcBufferBatteryLifecycle";
export default {
name: "PlcBufferBatteryLifecycle",
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 行李系统PLC缓冲电池生命周期表格数据
plcBufferBatteryLifecycleList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
type: null,
installationCabinetName: null,
locationDescription: null,
source: null,
powerSource: null,
imageAddress: null,
remarks: null,
firstInstance: null,
secondInstance: null,
thirdInstance: null,
fourthInstance: null,
fifthInstance: null,
sixthInstance: null,
seventhInstance: null,
eighthInstance: null,
ninthInstance: null,
tenthInstance: null,
eleventhInstance: null,
twelfthInstance: null
},
// 表单参数
form: {},
// 表单校验
rules: {
installationCabinetName: [
{ required: true, message: "安装柜体名称不能为空", trigger: "blur" }
],
locationDescription: [
{ required: true, message: "位置描述不能为空", trigger: "blur" }
],
},
columns: [
{ key: 0, label: `主键自增ID`, visible: false },
{ key: 1, label: `类型`, visible: true },
{ key: 2, label: `安装柜体名称`, visible: true },
{ key: 3, label: `位置描述`, visible: true },
{ key: 4, label: `来源`, visible: true },
{ key: 5, label: `取电`, visible: true },
{ key: 6, label: `图片地址`, visible: true },
{ key: 7, label: `备注`, visible: true },
{ key: 8, label: `第1次`, visible: true },
{ key: 9, label: `第2次`, visible: true },
{ key: 10, label: `第3次`, visible: true },
{ key: 11, label: `第4次`, visible: true },
{ key: 12, label: `第5次`, visible: true },
{ key: 13, label: `第6次`, visible: true },
{ key: 14, label: `第7次`, visible: true },
{ key: 15, label: `第8次`, visible: true },
{ key: 16, label: `第9次`, visible: true },
{ key: 17, label: `第10次`, visible: true },
{ key: 18, label: `第11次`, visible: true },
{ key: 19, label: `第12次`, visible: true },
],
upload: {
title: "导入行李系统PLC缓冲电池生命周期",
open: false,
url: "",
updateSupport: false,
isUploading: false,
headers: {}
}
};
},
created() {
this.getList();
this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/plcBufferBatteryLifecycle/importData";
this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
},
methods: {
/** 查询行李系统PLC缓冲电池生命周期列表 */
getList() {
this.loading = true;
listPlcBufferBatteryLifecycle(this.queryParams).then(response => {
this.plcBufferBatteryLifecycleList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
objid: null,
type: null,
installationCabinetName: null,
locationDescription: null,
source: null,
powerSource: null,
imageAddress: null,
remarks: null,
firstInstance: null,
secondInstance: null,
thirdInstance: null,
fourthInstance: null,
fifthInstance: null,
sixthInstance: null,
seventhInstance: null,
eighthInstance: null,
ninthInstance: null,
tenthInstance: null,
eleventhInstance: null,
twelfthInstance: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.objid)
this.single = selection.length!==1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.open = true;
this.title = "添加行李系统PLC缓冲电池生命周期";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const objid = row.objid || this.ids
getPlcBufferBatteryLifecycle(objid).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改行李系统PLC缓冲电池生命周期";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.objid != null) {
updatePlcBufferBatteryLifecycle(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addPlcBufferBatteryLifecycle(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
}
});
},
/** 删除按钮操作 */
handleDelete(row) {
const objids = row.objid || this.ids;
this.$modal.confirm('是否确认删除行李系统PLC缓冲电池生命周期编号为"' + objids + '"的数据项?').then(function() {
return delPlcBufferBatteryLifecycle(objids);
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
this.download('ems/info/plcBufferBatteryLifecycle/export', {
...this.queryParams
}, `plcBufferBatteryLifecycle_${new Date().getTime()}.xlsx`)
},
/** 导入按钮操作 */
handleImport() {
this.upload.title = "导入行李系统PLC缓冲电池生命周期";
this.upload.open = true;
},
/** 下载模板操作 */
importTemplate() {
this.download('ems/info/plcBufferBatteryLifecycle/importTemplate', {
}, `PLC缓冲电池生命周期数据模板_${new Date().getTime()}.xlsx`)
},
// 文件上传中处理
handleFileUploadProgress(event, file, fileList) {
this.upload.isUploading = true;
},
// 文件上传成功处理
handleFileSuccess(response, file, fileList) {
this.upload.open = false;
this.upload.isUploading = false;
this.$refs.upload.clearFiles();
this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
this.getList();
},
// 提交上传文件
submitFileForm() {
this.$refs.upload.submit();
}
}
};
</script>