factory_web/src/views/opm/opl.vue

256 lines
6.1 KiB
Vue

<template>
<el-container>
<el-header>
<div class="left-panel">
<el-button
icon="el-icon-plus"
style="margin: 3px 0px 0px 10px"
v-for="(item, index) in oplcateList"
:key="index"
:title="item.name"
type="primary"
@click="addFire(item.id)"
>
{{ item.name }}
</el-button>
</div>
<div class="right-panel">
<div class="right-panel-search">
<el-input
v-model="search.keyword"
placeholder="名称"
clearable
@click="upsearch"
></el-input>
<el-button
type="primary"
icon="el-icon-search"
@click="upsearch"
></el-button>
</div>
</div>
</el-header>
<el-main class="nopadding">
<scTable
ref="table"
:apiObj="apiObj"
row-key="id"
@selection-change="selectionChange"
stripe
@resetQuery="resetQuery"
>
<el-table-column label="#" type="index" width="50" fixed="left"></el-table-column>
<el-table-column
label="作业许可编号"
prop="number"
width="120"
fixed="left"
></el-table-column>
<el-table-column
label="作业级别"
prop="level"
width="120"
fixed="left"
></el-table-column>
<el-table-column
label="许可证种类"
prop="cate_name"
width="120"
fixed="left"
></el-table-column>
<el-table-column
label="作业开始时间"
prop="start_time"
width="180"
></el-table-column>
<el-table-column
label="作业结束时间"
prop="end_time"
width="180"
></el-table-column>
<el-table-column
label="作业部门"
prop="dept_do"
width="180"
></el-table-column>
<el-table-column
label="作业负责人"
prop="charger"
width="180"
></el-table-column>
<el-table-column
label="作业监护人"
prop="monitor"
width="180"
></el-table-column>
<el-table-column label="操作" fixed="right" align="right" width="170">
<template #default="scope">
<el-button-group>
<el-button
text
type="primary"
size="small"
@click="table_show(scope.row, scope.$index)"
>查看</el-button
>
<el-button
text
type="warning"
size="small"
@click="table_edit(scope.row, scope.$index)"
>编辑</el-button
>
</el-button-group>
</template>
</el-table-column>
</scTable>
</el-main>
</el-container>
</template>
<script>
export default {
name: "opl",
components: {},
data() {
return {
dialog: {
save: false,
permission: false,
},
apiObj: this.$API.opm.opl.list,
query: {},
selection: [],
search: {
keyword: null,
},
oplcateList: {},
};
},
mounted() {
this.getoplcate();
},
methods: {
//作业许可证列表
getoplcate() {
this.$API.opm.oplcate.list.req({ page: 0 }).then((res) => {
this.oplcateList = res;
console.log(res);
});
},
//点击作业类型,创建作业许可证添加
addFire(id) {
this.$router.push({
name: "fire",
query: {
operationid: this.$route.query.id,//作业ID
oplcateId:id,//许可证类型ID
oplId:"",//许可证ID
},
});
},
//编辑
table_edit(row) {
if(row.cate_name=="动火")
{
this.$router.push({
name: "fire",
query: {
oplId:row.id,//许可证ID
},
});
}
},
//查看
table_show(row) {
this.dialog.save = true;
this.$nextTick(() => {
this.$refs.saveDialog.open("show").setData(row);
});
},
//权限设置
permission() {
this.dialog.permission = true;
this.$nextTick(() => {
this.$refs.permissionDialog.open();
});
},
//删除
async table_del(row) {
var reqData = { id: row.id };
var res = await this.$API.demo.post.post(reqData);
if (res.code == 200) {
this.$refs.table.refresh();
this.$message.success("删除成功");
} else {
this.$alert(res.message, "提示", { type: "error" });
}
},
//批量删除
async batch_del() {
this.$confirm(
`确定删除选中的 ${this.selection.length} 项吗?如果删除项中含有子集将会被一并删除`,
"提示",
{
type: "warning",
}
)
.then(() => {
const loading = this.$loading();
this.$refs.table.refresh();
loading.close();
this.$message.success("操作成功");
})
.catch(() => {});
},
//表格选择后回调事件
selectionChange(selection) {
this.selection = selection;
},
//表格内开关
changeSwitch(val, row) {
row.status = row.status == "1" ? "0" : "1";
row.$switch_status = true;
setTimeout(() => {
delete row.$switch_status;
row.status = val;
this.$message.success("操作成功");
}, 500);
},
//搜索
upsearch() {},
//根据ID获取树结构
filterTree(id) {
var target = null;
function filter(tree) {
tree.forEach((item) => {
if (item.id == id) {
target = item;
}
if (item.children) {
filter(item.children);
}
});
}
filter(this.$refs.table.tableData);
return target;
},
//本地更新数据
handleSaveSuccess(data, mode) {
if (mode == "add") {
this.$refs.table.refresh();
} else if (mode == "edit") {
this.$refs.table.refresh();
}
},
resetQuery() {
this.query = {};
},
},
};
</script>