bns_zhgd_web/src/views/system/branchCompany/index.vue

175 lines
7.0 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<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="keyWord">
<el-input v-model="queryParams.keyWord" placeholder="请输入关键字" 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="['basic:branchCompany:add']">新增</el-button>
</el-col>
<!-- <el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:post:export']">导出</el-button>
</el-col> -->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="branchCompanyList" @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55" align="center" />
<el-table-column label="分公司名称" align="center" prop="companyName" />
<el-table-column label="分公司简称" align="center" prop="abbrName" />
<el-table-column label="状态" align="center" key="useStatus">
<template slot-scope="scope">
<el-switch v-model="scope.row.useStatus" active-value="1" inactive-value="0"
@change="handleStatusChange(scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="备注" align="center" prop="remark" />
<el-table-column label="更新人员" align="center" prop="updateUserName" />
<el-table-column label="更新时间" align="center" prop="updateTime" width="180"></el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
v-hasPermi="['basic:branchCompany:edit']">修改</el-button>
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['basic:branchCompany:del']">删除</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" />
<!-- 新增/编辑 -->
<BranchCompanypop v-if="isflag" :isAdd="isAdd" :rowData="row" @handleQuery="handleQuery" :title="title"
@closeDialog="closeDialog" @showColose="showColose" :dataForm="row" :disabled="loading" :width="600" />
</div>
</template>
<script>
import { queryBranchCompanyList, delDev,editBranchCompanyStatus } from "@/api/system/branchCompany";
import BranchCompanypop from "./prop/branchCompanypop.vue";
export default {
name: "BranchCompany",
dicts: ['video_device'],
components: {
BranchCompanypop
},
data() {
return {
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 岗位表格数据
branchCompanyList: [],
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
keyWord: '',
},
// 表单参数
form: {},
isflag: false,
row: {},
isAdd: ''
};
},
created() {
this.getList();
},
methods: {
/** 视频设备列表 */
getList() {
this.loading = true;
queryBranchCompanyList(this.queryParams).then(response => {
this.branchCompanyList = response.rows;
this.total = response.total;
this.loading = false;
});
},
closeDialog() {
this.isflag = false;
},
showColose() {
this.isflag = false;
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length != 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.title = "新增";
this.isAdd = 'add';
this.isflag = true;
},
/** 修改按钮操作 */
handleUpdate(row) {
this.title = "修改";
this.isAdd = 'edit';
this.row = row;
this.isflag = true;
},
/** 删除按钮操作 */
handleDelete(row) {
const id = row.id || this.ids;
this.$modal.confirm('是否确认删除分公司名称为"' + row.companyName + '"的数据项?').then(function () {
return delDev({ id: id });
}).then(() => {
this.getList();
this.$modal.msgSuccess("删除成功");
}).catch(() => { });
},
// 分公司状态修改
handleStatusChange(row) {
let text = row.useStatus === '1' ? '启用' : '禁用'
this.$modal.confirm('确认要"' + text + '""' + row.companyName + '"数据吗').then(function () {
return editBranchCompanyStatus({ id: row.id, useStatus: row.useStatus })
}).then(() => {
this.$modal.msgSuccess(text + '成功')
}).catch(function () {
row.useStatus = row.useStatus === '1' ? '0' : '1'
})
},
/** 导出按钮操作 */
handleExport() {
this.download('system/post/export', {
...this.queryParams
}, `post_${new Date().getTime()}.xlsx`)
}
}
};
</script>