suzhou-jichuang-lanhai
/
suzhouyingjiPC
10
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更新

Browse Source
lijinlong
杜函宇 2 years ago
parent 231ffc4b45
commit 345d2974e1
7 changed files with 1213 additions and 528 deletions
Show Stats Download Patch File Download Diff File

2
.env.development
Unescape View File

@ -13,7 +13,7 @@ ENV = 'development'
# 苏州应急执法计划管理系统/开发环境 # 苏州应急执法计划管理系统/开发环境
# VUE_APP_BASE_API = 'http://localhost:9028' # VUE_APP_BASE_API = 'http://localhost:9028'
VUE_APP_BASE_API = 'http://221.229.220.83:9028' VUE_APP_BASE_API = '/api'
# 路由懒加载 # 路由懒加载

19
src/api/yingji/home.js
Unescape View File

@ -1,19 +0,0 @@
import request from '@/utils/request'
// 根据字段查询字典信息
export function listDist(query) {
return request({
url: '/dictdata',
method: 'get',
params: query
})
}
// 行政区划树结构
export function xzTree(id) {
return request({
url: '/administrative/tree',
method: 'get',
})
}

43
src/api/yingji/keyEnterprise.js
Unescape View File

@ -30,7 +30,7 @@ export function deleteEnterprise(data) {
return request({ return request({
url: '/bKeyEnterprise', url: '/bKeyEnterprise',
method: 'delete', method: 'delete',
data params: data
}) })
} }
//导入省重点企业 //导入省重点企业
@ -38,7 +38,10 @@ export function exportEnterprise(data) {
return request({ return request({
url: '/bKeyEnterprise/common/importExcel', url: '/bKeyEnterprise/common/importExcel',
method: 'post', method: 'post',
data data,
headers: {
'Content-Type': 'application/x-www-form-urlencoded'
}
}) })
} }
//通过主键查询单条省重点企业 //通过主键查询单条省重点企业
@ -47,4 +50,38 @@ export function getEnterprise(id) {
url: `/bKeyEnterprise/${id}`, url: `/bKeyEnterprise/${id}`,
method: 'get', method: 'get',
}) })
} }
//查询企业信息列表
export function businessList(data) {
return request({
url: `/info/list`,
method: 'get',
params: data
})
}
//查询单条企业信息执法详情
export function enforcingDetail(data) {
return request({
url: `/bPlanEnterprise/getZhifa`,
method: 'get',
params: data
})
}
// 根据字段查询字典信息
export function listDist(query) {
return request({
url: '/dictdata',
method: 'get',
params: query
})
}
// 行政区划树结构
export function xzTree(id) {
return request({
url: '/administrative/tree',
method: 'get',
})
}

50
src/api/yingji/planManage.js
Unescape View File

@ -1,50 +0,0 @@
import request from '@/utils/request'
// 分页条件查询企业基本信息列表
export function listMsgEnterprise(query) {
return request({
url: '/info/list',
method: 'get',
params: query
})
}
// 分页条件查询计划管理
export function listPlanGL(query) {
return request({
url: '/bPlanManage',
method: 'get',
params: query
})
}
// 新增计划管理
export function addPlanGL(data) {
return request({
url: '/bPlanManage',
method: 'post',
data
})
}
//修改计划管理
export function updatePlanGL(data) {
return request({
url: '/bPlanManage',
method: 'put',
data
})
}
//删除计划管理
export function deletePlanGL(data) {
return request({
url: '/bPlanManage',
method: 'delete',
data
})
}
//通过主键查询单条计划管理
export function getPlanGL(id) {
return request({
url: `/bPlanManage/${id}`,
method: 'get',
})
}

919
src/views/yingji/enforcing.vue
Unescape View File

@ -7,367 +7,656 @@
* @LastEditTime: 2023-09-06 11:07:37 * @LastEditTime: 2023-09-06 11:07:37
--> -->
<template> <template>
<div class="container-main" ref="main"> <div class="container-main" ref="main">
<div class="enforce-the-law-title"> <div class="enforce-the-law-title">
<div class="filtrate-condition"> <div class="filtrate-condition">
<div class="select-input"> <div class="select-input">
<div class="select-span">年份:</div> <div class="select-span">年份:</div>
<el-select v-model="form.year" placeholder="请选择"> <el-date-picker
<el-option v-model="form.plannedYear"
v-for="item in options" type="month"
:key="item.value" placeholder="请选择"
:label="item.label" value-format="yyyy-MM"
:value="item.value"> size="small"
</el-option> >
</el-select> </el-date-picker>
</div> </div>
<div class="select-input"> <div class="select-input">
<div class="select-span">区划:</div> <div class="select-span">区划:</div>
<el-select v-model="form.compartment" placeholder="请选择">
<el-option <el-cascader
v-for="item in options" v-model="form.district"
:key="item.value" :options="compartment"
:label="item.label" :show-all-levels="false"
:value="item.value"> :props="{
</el-option> value: 'subdistrict', //匹配响应数据中的id
</el-select> label: 'institutionName', //匹配响应数据中的name
</div> children: 'children',
<div class="my-checkbox"> }"
<el-checkbox-group v-model="checkList" @change="setmealSelect"> ></el-cascader>
<el-checkbox label="全部"></el-checkbox> </div>
<el-checkbox label="已执法"></el-checkbox> <div class="my-checkbox">
<el-checkbox label="未执法"></el-checkbox> <el-checkbox-group v-model="checkList" @change="setmealSelect">
</el-checkbox-group> <el-checkbox label="全部"></el-checkbox>
</div> <el-checkbox label="已执法"></el-checkbox>
<el-checkbox label="未执法"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<div style="display: flex">
<div class="export" @click="searchList" style="margin-right: 10px">
<span>搜索</span>
</div> </div>
<div class="export" @click="exportFile"> <div class="export" @click="exportFile">
<img src="@/assets/images/export.png" alt=""> <img src="@/assets/images/export.png" alt="" />
<span>导出excel</span> <span>导出excel</span>
</div> </div>
</div> </div>
<div class="tables"> </div>
<el-table <div class="tables">
:data="tableData" <el-table
style="width: 100%" :data="tableData"
:height="484" style="width: 100%"
:border="false" :height="484"
:row-class-name="tableRowClassName" :border="false"
:cell-style="columnStyle" v-loading="loads"
:row-class-name="tableRowClassName"
:cell-style="columnStyle"
>
<el-table-column
prop="plannedYear"
label="计划年份"
width="180"
header-align="center"
> >
<el-table-column </el-table-column>
prop="date" <el-table-column
label="计划年份" prop="district"
width="180" label="行政区划"
header-align="center" width="180"
> header-align="center"
</el-table-column> >
<el-table-column </el-table-column>
prop="address" <el-table-column
label="行政区划" prop="entprName"
width="180" label="企业名称"
header-align="center" header-align="center"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="state" label="状态" header-align="center">
prop="frim" </el-table-column>
label="企业名称" <el-table-column label="操作" header-align="center">
header-align="center" <template slot-scope="scope">
> <div class="tabs-btns">
</el-table-column> <div class="look" @click="look(scope.row)">
<el-table-column <span>查看执法详情</span>
prop="state"
label="状态"
header-align="center"
>
</el-table-column>
<el-table-column
label="操作"
header-align="center"
>
<template slot-scope="scope">
<div class="tabs-btns">
<div class="look" @click="look(scope.row)">
<span>查看执法详情</span>
</div>
</div> </div>
</template> </div>
</el-table-column> </template>
</el-table> </el-table-column>
</div> </el-table>
<div class="pagination">
<my-pagination :total="28" @pagesChange="pagesChange"></my-pagination>
</div>
</div> </div>
</template> <div class="pagination">
<my-pagination :total="total" @pagesChange="pagesChange"></my-pagination>
</div>
<!-- 查看 -->
<el-dialog
:visible.sync="addShow"
:show-close="false"
:destroy-on-close="true"
:close-on-click-modal="false"
append-to-body
custom-class="dialog-boxed"
width="50%"
>
<div class="dialog-slot">
<div class="closeClick">
<div class="newplan">
<div class="line"></div>
<div class="span">执法详情</div>
</div>
<img src="@/assets/images/close.png" alt="" @click="shutDownDetail" />
</div>
<div class="content">
<div class="filtrate">
<el-descriptions :column="2" border v-loading="detailLoad">
<el-descriptions-item
:label="item.label"
v-for="(item, index) in listDes"
:key="index"
>
{{ item.value }}
</el-descriptions-item>
</el-descriptions>
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script> <script>
import myPagination from "@/views/components/myPagination/index.vue" import myPagination from "@/views/components/myPagination/index.vue";
export default { import {
components:{myPagination}, businessList,
name: "Article", enforcingDetail,
data() { xzTree,
return { } from "@/api/yingji/keyEnterprise.js";
tableData: [{ export default {
date: '2022年', components: { myPagination },
name: '王小虎', name: "Article",
address: '苏州', data() {
frim:'扬子石化有限公司', return {
state:'未执法' tableData: [],
}, { loads: true,
date: '2022年', total: 0,
name: '王小虎', options: [],
address: '张家港市', form: {
frim:'扬子石化有限公司', district: "",
state:'未执法' plannedYear: "",
}, { //检测状态
date: '2022年', checkStatus: "",
name: '王小虎', },
address: '常熟市', checkList: ["全部"],
frim:'扬子石化有限公司', checkListTwo: [],
state:'未执法' listDes: [
}, { {
date: '2022年', eng: "bizAddr",
name: '王小虎', label: "生产经营地址",
address: '太仓市', value: "",
frim:'扬子石化有限公司', },
state:'未执法' {
}, { eng: "bossEmail",
date: '2022年', label: "主要负责人电子邮箱",
name: '王小虎', value: "",
address: '昆山市', },
frim:'扬子石化有限公司', {
state:'未执法' eng: "bossMobtel",
}, { label: "主要负责人移动电话",
date: '2022年', value: "",
name: '王小虎', },
address: '吴江区', {
frim:'扬子石化有限公司', eng: "bossTel",
state:'已执法' label: "主要负责人固定电话",
}, { value: "",
date: '2022年', },
name: '王小虎', {
address: '吴中区', eng: "cseNum",
frim:'扬子石化有限公司', label: "注册安全工程师人员数量",
state:'已执法' value: "",
}, { },
date: '2022年',
name: '王小虎', {
address: '姑苏区', eng: "doublePreven",
frim:'扬子石化有限公司', label: "是否开展双重预防机制",
state:'已执法' value: "",
}, { },
date: '2022年', {
name: '王小虎', eng: "ecoTypeLarge",
address: '相城区', label: "经济类型大类",
frim:'扬子石化有限公司', value: "",
state:'已执法'
}, {
date: '2022年',
name: '王小虎',
address: '工业园区',
frim:'扬子石化有限公司',
state:'已执法'
}],
options:[],
form:{
year:'',
compartment:'',
}, },
checkList: ['全部'], {
checkListTwo: [], eng: "ecoTypeSmall",
}; label: "经济类型小类",
value: "",
},
{
eng: "employeeNum",
label: "从业人员数量",
value: "",
},
{
eng: "enterColorChart",
label: "企业分色图",
value: "",
},
{
eng: "entprName",
label: "企业名称",
value: "",
},
{
eng: "floorArea",
label: "占地面积",
value: "",
},
{
eng: "fullEmegNum",
label: "专职应急管理人员数量",
value: "",
},
{
eng: "fullSafety",
label: "是否有专职安全人员",
value: "",
},
{
eng: "fullSafetyNum",
label: "专职安全生产管理人员数量",
value: "",
},
{
eng: "gridCode",
label: "网格编码",
value: "",
},
{
eng: "infoYear",
label: "数据年份",
value: "",
},
{
eng: "isPoint",
label: "是否重点",
value: "",
},
{
eng: "legalPerson",
label: "法定代表人",
value: "",
},
{
eng: "majorHazardInstallations",
label: "是否存在重大危险源",
value: "",
},
{
eng: "majorHazardLevel",
label: "重大危险源等级",
value: "",
},
{
eng: "operatingStatus",
label: "经营状态",
value: "",
},
{
eng: "regAddr",
label: "注册地址",
value: "",
},
{
eng: "uscCode",
label: "统一社会信用代码",
value: "",
},
],
searchBefore: {
pageSize: 10,
pageNum: 1,
},
details: {},
addShow: false,
detailLoad: true,
compartment: [],
};
},
created() {
this.getList();
this.xzList();
},
methods: {
xzList() {
xzTree().then((res) => {
console.log(res);
this.compartment = res.data;
this.filterComparment(this.compartment);
});
}, },
// watch: { filterComparment(e) {
// checkListTwo:{ e.forEach((value, index) => {
// handler(newArray,oldArray){ if (value.children.length >= 1) {
// console.log(newArray,'newArray') this.filterComparment(value.children);
// console.log(oldArray,'oldArray')
// },
// deep:true,
// immediate:true,
// }
// },
methods: {
// 多选框变化事件
setmealSelect(){
this.checkList = this.checkList.slice(-1);
if(this.checkList.length > 0) {
this.checkListTwo = this.checkList;
this.changeList()
} else { } else {
this.checkList = this.checkListTwo delete value.children;
} return
},
changeList(){
console.log(this.checkList[0]) // 拿到需要筛选的值
},
// tabs不同行给不同class
tableRowClassName({row, rowIndex}) {
if (rowIndex % 2 !== 0) {
return 'success-row';
} }
return ''; });
}, },
// 根据状态数据修改字体颜色
columnStyle({ row, column, rowIndex, columnIndex }) { shutDownDetail() {
if (columnIndex == 3) { this.addShow = false;
if(row.state == '未执法') { },
return "color: #F71052" look(e) {
} else if(row.state == '已执法') { this.addShow = true;
return "color: #23B06C" this.detailLoad = true;
businessList({ uscCode: e.enterpriseId, ...this.searchBefore }).then(
(res) => {
this.details = res.data.list[0];
this.detailLoad = false;
for (let key in this.details) {
this.listDes.forEach((value1, index1) => {
if (key == value1.eng) {
this.listDes[index1].value = this.details[key];
return;
}
});
} }
} }
}, );
// 页码，当前页切换事件 },
pagesChange(pages){ searchList() {
console.log(pages) this.form.district = this.form.district[this.form.district.length-1]
}, this.searchBefore = Object.assign(this.searchBefore, this.form);
// 导出 this.getList();
exportFile(){ },
// console.log(this.multipleSelection) getList() {
}, this.loads = true;
enforcingDetail(this.searchBefore).then((res) => {
console.log(res);
this.tableData = res.data.list;
this.total = res.data.total;
this.loads = false;
});
},
// 多选框变化事件
setmealSelect() {
this.checkList = this.checkList.slice(-1);
if (this.checkList.length > 0) {
this.checkListTwo = this.checkList;
this.changeList();
} else {
this.checkList = this.checkListTwo;
}
},
changeList() {
console.log(this.checkList[0]); // 拿到需要筛选的值
}, },
mounted() { // tabs不同行给不同class
this.checkListTwo = this.checkList; tableRowClassName({ row, rowIndex }) {
// this.$nextTick(()=>{ if (rowIndex % 2 !== 0) {
// let dom = document.getElementsByClassName('tables'); return "success-row";
// let height = dom[0].getBoundingClientRect(); }
// let windowHeight = window.innerHeight; return "";
// let relativeHeight = windowHeight - height.top },
// this.main.height = relativeHeight - 80 // 根据状态数据修改字体颜色
// }) columnStyle({ row, column, rowIndex, columnIndex }) {
if (columnIndex == 3) {
if (row.state == "未执法") {
return "color: #F71052";
} else if (row.state == "已执法") {
return "color: #23B06C";
}
}
},
// 页码，当前页切换事件
pagesChange(pages) {
console.log(pages);
this.searchBefore.pageNum = pages.current;
this.searchBefore.pageSize = pages.size;
this.getList();
}, },
}; // 导出
</script> exportFile() {
// console.log(this.multipleSelection)
},
},
mounted() {
this.checkListTwo = this.checkList;
// this.$nextTick(()=>{
// let dom = document.getElementsByClassName('tables');
// let height = dom[0].getBoundingClientRect();
// let windowHeight = window.innerHeight;
// let relativeHeight = windowHeight - height.top
// this.main.height = relativeHeight - 80
// })
},
};
</script>
<style lang="scss" scoped> <style lang="scss" scoped>
.container-main { .dialog-slot {
// height: calc(100vh - 84px); .closeClick {
overflow: hidden; position: absolute;
padding: 0 20px; top: 0;
height: 100%; right: 0;
background-color: #fff; padding: 10px 20px;
.enforce-the-law-title { width: 100%;
z-index: 1000;
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
background: #f8f9fa;
box-shadow: 0px 1px 0px 0px #dbe0e8;
background-color: #e0eaf8;
img {
width: 18px;
height: 18px;
cursor: pointer;
}
.newplan {
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between; .line {
padding: 31px 0 12px 0; margin-right: 10px;
.filtrate-condition { width: 5px;
height: 16px;
background-color: #1e70de;
}
.span {
font-size: 16px;
font-family: "Alibaba PuHuiTi";
font-weight: bold;
color: #1e70de;
}
}
}
.content {
// padding: 15px 10px;
.filtrate {
padding-bottom: 10px;
.select-input {
// margin-right: 10px;
margin-top: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
.select-input { .select-span {
margin-right: 20px; font-size: 13px;
display: flex; font-family: "Alibaba PuHuiTi";
align-items: center; font-weight: 400;
.select-span { color: #525966;
font-size: 14px; // line-height: 40px;
font-family: 'Alibaba PuHuiTi'; margin-right: 10px;
font-weight: 400; }
color: #525966; ::v-deep .el-select,
line-height: 40px; .el-cascader {
margin-right: 10px; background-color: transparent;
width: 180px;
.el-input__inner {
height: 33px;
} }
::v-deep .el-select { // border-radius: 2px;
background-color: transparent; .el-input
width: 210px; .el-input__suffix
.el-input__inner { .el-input__suffix-inner
height: 33px; .el-icon-arrow-up::before {
} content: "";
// border-radius: 2px; background: url(../../assets/images/down2.png) center center
.el-input .el-input__suffix .el-input__suffix-inner .el-icon-arrow-up::before { no-repeat;
content: ""; background-size: cover;
background: url(../../assets/images/down2.png) center center no-repeat; position: absolute;
background-size: cover; width: 10px;
position: absolute; height: 7px;
width: 10px; top: 50%;
height: 7px; left: 50%;
top: 50%; transform: translate(-50%, -50%);
left: 50%;
transform: translate(-50%, -50%);
}
} }
} }
.my-checkbox { }
margin-left: 50px; .select-input {
::v-deep .el-checkbox-group { width: 45%;
.el-checkbox__label { ::v-deep .el-input {
font-size: 14px; .el-input__inner {
font-family: 'Alibaba PuHuiTi'; height: 33px;
font-weight: 400;
color: #525966;
}
} }
} }
} }
.export { .select-btn {
width: 80px;
height: 33px;
background: #2378ec;
border-radius: 2px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
padding: 6px 19px; font-size: 15px;
background-color: #2378EC; font-family: Alibaba PuHuiTi;
font-weight: 500;
color: #ffffff;
cursor: pointer; cursor: pointer;
img { margin-right: 10px;
width: 22px; }
margin-right: 10px; .select-btn1 {
} background: #28b384;
span {
color: #ffffff;
font-size: 14px;
font-family: 'Alibaba PuHuiTi';
font-weight: 400;
}
} }
} }
.tables { }
margin-top: 10px; }
background-color: #EAF2FD; ::v-deep .el-descriptions-row th {
.tabs-btns { width: 20% !important;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
::v-deep .el-descriptions-row td {
width: 30% !important;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
.container-main {
// height: calc(100vh - 84px);
overflow: hidden;
padding: 0 20px;
height: 100%;
background-color: #fff;
.enforce-the-law-title {
display: flex;
align-items: center;
justify-content: space-between;
padding: 31px 0 12px 0;
.filtrate-condition {
display: flex;
align-items: center;
.select-input {
margin-right: 20px;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; .select-span {
.look {
display: flex;
align-items: center;
cursor: pointer;
span {
font-size: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #045FFD;
text-decoration: underline;
}
}
}
::v-deep .el-table {
.success-row {
background-color: rgba(234, 242, 253, 0.25);
}
td {
height: 42px;
text-align: center;
font-size: 14px; font-size: 14px;
font-family: 'Alibaba PuHuiTi'; font-family: "Alibaba PuHuiTi";
font-weight: 400; font-weight: 400;
color: #525966; color: #525966;
line-height: 40px;
margin-right: 10px;
} }
th { ::v-deep .el-select {
height: 45px; background-color: transparent;
background-color: #EAF2FD; width: 210px;
font-size: 15px; .el-input__inner {
font-family: 'Alibaba PuHuiTi'; height: 33px;
font-weight: bold; }
color: #525966; // border-radius: 2px;
.el-checkbox { .el-input
display: none; .el-input__suffix
.el-input__suffix-inner
.el-icon-arrow-up::before {
content: "";
background: url(../../assets/images/down2.png) center center
no-repeat;
background-size: cover;
position: absolute;
width: 10px;
height: 7px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
} }
} }
} }
::v-deep .el-table::before { .my-checkbox {
height: 0; margin-left: 50px;
::v-deep .el-checkbox-group {
.el-checkbox__label {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
}
}
} }
} }
.pagination { .export {
margin-top: 40px; display: flex;
align-items: center;
justify-content: center;
padding: 6px 19px;
background-color: #2378ec;
cursor: pointer;
img {
width: 22px;
margin-right: 10px;
}
span {
color: #ffffff;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
} }
} }
</style> .tables {
margin-top: 10px;
background-color: #eaf2fd;
.tabs-btns {
display: flex;
align-items: center;
justify-content: center;
.look {
display: flex;
align-items: center;
cursor: pointer;
span {
font-size: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #045ffd;
text-decoration: underline;
}
}
}
::v-deep .el-table {
.success-row {
background-color: rgba(234, 242, 253, 0.25);
}
td {
height: 42px;
text-align: center;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
}
th {
height: 45px;
background-color: #eaf2fd;
font-size: 15px;
font-family: "Alibaba PuHuiTi";
font-weight: bold;
color: #525966;
.el-checkbox {
display: none;
}
}
}
::v-deep .el-table::before {
height: 0;
}
}
.pagination {
margin-top: 40px;
}
}
</style>

694
src/views/yingji/focusEnter.vue
Unescape View File

@ -12,179 +12,429 @@
<div class="filtrate-condition"> <div class="filtrate-condition">
<div class="select-input"> <div class="select-input">
<div class="select-span">年份:</div> <div class="select-span">年份:</div>
<el-select v-model="form.year" placeholder="请选择"> <div>
<el-option <el-date-picker
v-for="item in options" v-model="queryParms.year"
:key="item.value" type="year"
:label="item.label" placeholder="请选择"
:value="item.value" value-format="yyyy"
size="small"
> >
</el-option> </el-date-picker>
</el-select> </div>
</div> </div>
</div> </div>
<div style="display: flex"> <div style="display: flex">
<div class="export" @click="exportFile"> <div class="export" @click="addkeys">
<span>新增</span>
</div>
<div class="export" @click="searchList">
<span>搜索</span> <span>搜索</span>
</div> </div>
<div class="export export1" @click="exportFile"> <div class="export" @click="chongzhiList">
<span>导入</span> <span>重置</span>
</div>
<div class="export" style="background: #f71052" @click="deleteItem">
<span>删除</span>
</div> </div>
<el-upload
class="upload-demo"
action="1"
ref="uploadOver"
:http-request="exportFile"
:on-success="handleSuccess"
:multiple="false"
:show-file-list="false"
:limit="1"
:file-list="fileList"
>
<div class="export export1">
<span>导入</span>
</div>
</el-upload>
</div> </div>
</div> </div>
<div class="tables"> <div class="tables">
<el-table <el-table
:data="tableData" :data="tableData"
style="width: 100%" style="width: 100%"
v-loading="loading"
:height="484" :height="484"
:border="false" :border="false"
:row-class-name="tableRowClassName" :row-class-name="tableRowClassName"
:cell-style="columnStyle" :cell-style="columnStyle"
@selection-change="handleSelectionChange"
> >
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="year" label="计划年份" header-align="center">
</el-table-column>
<el-table-column <el-table-column
prop="date" prop="enterpriseName"
label="计划年份" label="企业名称"
header-align="center" header-align="center"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="address" prop="entCode"
label="企业名称" label="统一社会信用代码"
header-align="center" header-align="center"
> >
</el-table-column> </el-table-column>
<el-table-column prop="frim" label="企业类别" header-align="center"> <el-table-column prop="type" label="企业类别" header-align="center">
</el-table-column> </el-table-column>
<!-- <el-table-column label="操作" header-align="center"> <el-table-column label="操作" header-align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="tabs-btns"> <div class="tabs-btns">
<div class="look" @click="look(scope.row)"> <div class="look" @click="look(scope.row)">
<span>查看执法详情</span> <img src="@/assets/images/look.png" alt="" />
<span>查看</span>
</div>
<div class="change" @click="change(scope.row)">
<img src="@/assets/images/change.png" alt="" />
<span>修改</span>
</div>
<div class="delete" @click="deleteItem(scope.row)">
<img src="@/assets/images/delete.png" alt="" />
<span>删除</span>
</div> </div>
</div> </div>
</template> </template>
</el-table-column> --> </el-table-column>
</el-table> </el-table>
</div> </div>
<div class="pagination"> <div class="pagination">
<my-pagination :total="28" @pagesChange="pagesChange"></my-pagination> <my-pagination :total="total" @pagesChange="pagesChange"></my-pagination>
</div> </div>
<!-- 新增修改 -->
<el-dialog
:visible.sync="dialogVisible"
custom-class="dialog-boxed"
append-to-body
width="50%"
>
<div class="dialog-slot">
<div class="closeClick">
<div class="newplan">
<div class="line"></div>
<div class="span">{{ headerText }}省重点企业</div>
</div>
<img src="@/assets/images/close.png" alt="" @click="closeDetail" />
</div>
<div class="content">
<div class="filtrate">
<el-form
:model="form"
label-width="100px"
class="demo-ruleForm"
ref="form1"
:rules="rules"
>
<el-row>
<el-col :span="24">
<el-form-item label="企业名称" prop="enterpriseName">
<el-input
v-model="form.enterpriseName"
size="small"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="企业代码:" prop="entCode">
<el-input
v-model="form.entCode"
size="small"
placeholder="请输入企业代码"
></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="年份:" prop="year">
<el-date-picker
v-model="form.year"
type="year"
placeholder="请选择年份"
value-format="yyyy"
size="small"
>
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="大类:" prop="type">
<el-input
v-model="form.type"
size="small"
placeholder="请输入大类"
></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="备注:" prop="remark">
<el-input
type="textarea"
v-model="form.remark"
size="small"
:rows="5"
placeholder="请输入备注"
></el-input>
</el-form-item>
</el-col>
</el-row>
<div
style="
display: flex;
align-items: center;
justify-content: center;
"
>
<div class="select-btn" @click="confirm">确认</div>
<div class="select-btn" @click="closeDetail">取消</div>
</div>
</el-form>
</div>
</div>
</div>
</el-dialog>
<!-- 查看 -->
<el-dialog
:visible.sync="addShow"
:show-close="false"
:destroy-on-close="true"
:close-on-click-modal="false"
append-to-body
custom-class="dialog-boxed"
width="50%"
>
<div class="dialog-slot">
<div class="closeClick">
<div class="newplan">
<div class="line"></div>
<div class="span">查看省重点企业详细</div>
</div>
<img src="@/assets/images/close.png" alt="" @click="shutDownDetail" />
</div>
<div class="content">
<div class="filtrate">
<el-descriptions :column="2" border>
<el-descriptions-item label="计划年份">
{{ parseTime(details.year, "{y}") }}
</el-descriptions-item>
<el-descriptions-item label="企业名称">
{{ details.enterpriseName }}
</el-descriptions-item>
<el-descriptions-item label="企业代码">{{
details.entCode
}}</el-descriptions-item>
<el-descriptions-item label="企业大类">{{
details.type
}}</el-descriptions-item>
<el-descriptions-item label="备注">{{
details.remark
}}</el-descriptions-item>
</el-descriptions>
</div>
</div>
</div>
</el-dialog>
</div> </div>
</template> </template>
<script> <script>
import myPagination from "@/views/components/myPagination/index.vue"; import myPagination from "@/views/components/myPagination/index.vue";
import { Loading } from "element-ui";
import {
listEnterprise,
addEnterprise,
updateEnterprise,
deleteEnterprise,
exportEnterprise,
getEnterprise,
} from "@/api/yingji/keyEnterprise.js";
export default { export default {
components: { myPagination }, components: { myPagination },
name: "Article", name: "Article",
data() { data() {
return { return {
tableData: [ tableData: [],
{
date: "2022年",
name: "王小虎",
address: "苏州",
frim: "扬子石化有限公司",
state: "未执法",
},
{
date: "2022年",
name: "王小虎",
address: "张家港市",
frim: "扬子石化有限公司",
state: "未执法",
},
{
date: "2022年",
name: "王小虎",
address: "常熟市",
frim: "扬子石化有限公司",
state: "未执法",
},
{
date: "2022年",
name: "王小虎",
address: "太仓市",
frim: "扬子石化有限公司",
state: "未执法",
},
{
date: "2022年",
name: "王小虎",
address: "昆山市",
frim: "扬子石化有限公司",
state: "未执法",
},
{
date: "2022年",
name: "王小虎",
address: "吴江区",
frim: "扬子石化有限公司",
state: "已执法",
},
{
date: "2022年",
name: "王小虎",
address: "吴中区",
frim: "扬子石化有限公司",
state: "已执法",
},
{
date: "2022年",
name: "王小虎",
address: "姑苏区",
frim: "扬子石化有限公司",
state: "已执法",
},
{
date: "2022年",
name: "王小虎",
address: "相城区",
frim: "扬子石化有限公司",
state: "已执法",
},
{
date: "2022年",
name: "王小虎",
address: "工业园区",
frim: "扬子石化有限公司",
state: "已执法",
},
],
options: [], options: [],
checkList: ["全部"],
checkListTwo: [],
loading: false,
headerText: "",
ids: null,
//是否显示弹出框
dialogVisible: false,
queryParms: {
year: "",
},
searchBefore: {
pageSize: 10,
pageNum: 1,
},
//新增修改的参数
form: { form: {
//企业名称
enterpriseName: "",
//企业代码
entCode: "",
//备注
remark: "",
//大类
type: "",
//年份
year: "", year: "",
compartment: "",
}, },
checkList: ["全部"], addShow: false,
checkListTwo: [], //详情
details: {},
rules: {
enterpriseName: [
{ required: true, message: "请输入企业名称", trigger: "blur" },
],
entCode: [
{ required: true, message: "请输入企业代码", trigger: "blur" },
],
remark: [{ required: true, message: "请输入备注", trigger: "blur" }],
type: [{ required: true, message: "请输入大类", trigger: "blur" }],
year: [{ required: true, message: "请选择年份", trigger: "blur" }],
},
//总数
total: 0,
fileList: [],
}; };
}, },
// watch: { created() {
// checkListTwo:{ this.getList();
// handler(newArray,oldArray){ },
// console.log(newArray,'newArray')
// console.log(oldArray,'oldArray')
// },
// deep:true,
// immediate:true,
// }
// },
methods: { methods: {
// 多选框变化事件 handleRemove() {},
setmealSelect() { searchList() {
this.checkList = this.checkList.slice(-1); this.searchBefore = Object.assign(this.searchBefore, this.queryParms);
if (this.checkList.length > 0) { this.getList();
this.checkListTwo = this.checkList; },
this.changeList(); reset() {
} else { this.form = {
this.checkList = this.checkListTwo; enterpriseName: "",
//企业代码
entCode: "",
//备注
remark: "",
//大类
type: "",
//年份
year: "",
};
},
//重置列表
chongzhiList() {
this.searchBefore = {
pageSize: 10,
pageNum: 1,
};
this.queryParms.year = "";
this.getList();
},
//获取列表
getList() {
this.loading = true;
listEnterprise(this.searchBefore).then((res) => {
this.tableData = res.data.list;
this.loading = false;
this.total = res.data.total;
});
},
//关闭省重点详情
shutDownDetail() {
this.addShow = false;
},
//新增打开
addkeys() {
this.reset();
this.headerText = "新增";
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.form1.clearValidate();
});
},
//关闭新增修改弹窗
closeDetail() {
this.reset();
this.dialogVisible = false;
},
//查看详情
look(e) {
getEnterprise(e.id).then((res) => {
this.details = res.data;
this.addShow = true;
});
},
//修改数据
change(e) {
this.headerText = "修改";
getEnterprise(e.id).then((res) => {
this.form = res.data;
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs.form1.clearValidate();
});
});
},
//保存
confirm() {
this.$refs.form1.validate((valid) => {
if (valid) {
if (this.form.id != null) {
updateEnterprise(this.form).then((response) => {
this.$model.msgSuccess("修改成功");
this.dialogVisible = false;
this.getList();
});
} else {
addEnterprise(this.form).then((res) => {
this.$model.msgSuccess("新增成功");
this.dialogVisible = false;
this.getList();
});
}
}
});
},
//删除数据
deleteItem(row) {
/** 删除按钮操作 */
const ids = row.id || this.ids;
if (!ids) {
this.$model.msgError("请选择数据");
return;
} }
this.$confirm("是否确认删除该数据?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(function () {
return deleteEnterprise({ idList: ids });
})
.then(() => {
this.$model.msgSuccess("删除成功");
this.getList();
})
.catch(() => {});
}, },
changeList() { // 多选框变化事件
console.log(this.checkList[0]); // 拿到需要筛选的值 handleSelectionChange(rows) {
let arr = rows.map((item) => item.id);
this.ids = arr.join(",");
}, },
// tabs不同行给不同class // tabs不同行给不同class
tableRowClassName({ row, rowIndex }) { tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 !== 0) { if (rowIndex % 2 !== 0) {
@ -204,11 +454,35 @@ export default {
}, },
// 页码，当前页切换事件 // 页码，当前页切换事件
pagesChange(pages) { pagesChange(pages) {
console.log(pages); this.searchBefore.pageSize = pages.size;
this.searchBefore.pageNum = pages.current;
this.getList();
}, },
// 导出 handleSuccess() {},
exportFile() { // 导入
// console.log(this.multipleSelection) exportFile(e) {
let downloadLoadingInstance = Loading.service({
text: "正在导入数据，请稍候",
spinner: "el-icon-loading",
background: "rgba(0, 0, 0, 0.7)",
});
let a = new FormData();
a.append("file", e.file);
exportEnterprise(a)
.then((res) => {
downloadLoadingInstance.close();
this.queryParms.year = "";
this.searchBefore = {
pageSize: 10,
pageNum: 1,
};
this.getList();
this.$refs.uploadOver.clearFiles();
})
.catch(() => {
downloadLoadingInstance.close();
this.$model.msgError("导入失败");
});
}, },
}, },
mounted() { mounted() {
@ -224,6 +498,53 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
::v-deep .el-descriptions-row th {
width: 20% !important;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
::v-deep .el-descriptions-row td {
width: 30% !important;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
.tabs-btns {
display: flex;
align-items: center;
justify-content: center;
.look,
.change,
.delete {
display: flex;
align-items: center;
margin-right: 30px;
cursor: pointer;
img {
width: 20px;
margin-right: 5px;
}
span {
font-size: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #045ffd;
}
}
.delete {
margin-right: 0;
span {
color: #f71052;
}
}
}
::v-deep .el-date-editor {
width: 100%;
}
::v-deep .el-dialog__body {
padding-bottom: 10px;
}
.container-main { .container-main {
// height: calc(100vh - 84px); // height: calc(100vh - 84px);
overflow: hidden; overflow: hidden;
@ -292,6 +613,7 @@ export default {
justify-content: center; justify-content: center;
padding: 6px 19px; padding: 6px 19px;
background-color: #2378ec; background-color: #2378ec;
margin-right: 10px;
cursor: pointer; cursor: pointer;
img { img {
width: 22px; width: 22px;
@ -306,29 +628,12 @@ export default {
} }
.export1 { .export1 {
background-color: #28b384; background-color: #28b384;
margin-left: 20px;
} }
} }
.tables { .tables {
margin-top: 10px; margin-top: 10px;
background-color: #eaf2fd; background-color: #eaf2fd;
.tabs-btns {
display: flex;
align-items: center;
justify-content: center;
.look {
display: flex;
align-items: center;
cursor: pointer;
span {
font-size: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #045ffd;
text-decoration: underline;
}
}
}
::v-deep .el-table { ::v-deep .el-table {
.success-row { .success-row {
background-color: rgba(234, 242, 253, 0.25); background-color: rgba(234, 242, 253, 0.25);
@ -361,5 +666,120 @@ export default {
margin-top: 40px; margin-top: 40px;
} }
} }
.dialog-slot {
.closeClick {
position: absolute;
top: 0;
right: 0;
padding: 10px 20px;
width: 100%;
z-index: 1000;
display: flex;
justify-content: space-between;
align-items: center;
text-align: center;
background: #f8f9fa;
box-shadow: 0px 1px 0px 0px #dbe0e8;
background-color: #e0eaf8;
img {
width: 18px;
height: 18px;
cursor: pointer;
}
.newplan {
display: flex;
align-items: center;
.line {
margin-right: 10px;
width: 5px;
height: 16px;
background-color: #1e70de;
}
.span {
font-size: 16px;
font-family: "Alibaba PuHuiTi";
font-weight: bold;
color: #1e70de;
}
}
}
.content {
// padding: 15px 10px;
.filtrate {
padding-bottom: 10px;
.select-input {
// margin-right: 10px;
margin-top: 20px;
display: flex;
align-items: center;
.select-span {
font-size: 13px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
// line-height: 40px;
margin-right: 10px;
}
::v-deep .el-select,
.el-cascader {
background-color: transparent;
width: 180px;
.el-input__inner {
height: 33px;
}
// border-radius: 2px;
.el-input
.el-input__suffix
.el-input__suffix-inner
.el-icon-arrow-up::before {
content: "";
background: url(../../assets/images/down2.png) center center
no-repeat;
background-size: cover;
position: absolute;
width: 10px;
height: 7px;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
}
}
.select-input {
width: 45%;
::v-deep .el-input {
.el-input__inner {
height: 33px;
}
}
}
.select-btn {
width: 80px;
height: 33px;
background: #2378ec;
border-radius: 2px;
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
font-family: Alibaba PuHuiTi;
font-weight: 500;
color: #ffffff;
cursor: pointer;
margin-right: 10px;
}
.select-btn1 {
background: #28b384;
}
}
}
}
::v-deep .el-form-item__label {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
// line-height: 40px;
}
</style> </style>

14
vue.config.js
Unescape View File

@ -41,13 +41,21 @@ module.exports = {
open: true, open: true,
proxy: { proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy // detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: { // [process.env.VUE_APP_BASE_API]: {
target: `http://192.168.0.117:9028`, // target: `http://192.168.0.117:9028`,
// changeOrigin: true,
// pathRewrite: {
// ["^" + process.env.VUE_APP_BASE_API]: "",
// },
// },
'/api': {
target: `http://192.168.0.105:9033/pharmaceuticals`,
changeOrigin: true, changeOrigin: true,
pathRewrite: { pathRewrite: {
["^" + process.env.VUE_APP_BASE_API]: "", '^/api': ''
}, },
}, },
}, },
disableHostCheck: true, disableHostCheck: true,
}, },

Write Preview
Loading…
Cancel
Save