计划管理

lijinlong
杜函宇 1 year ago
parent 7e3e719643
commit 5085d718e0

@ -79,12 +79,12 @@ export default {
icon1: require("../assets/images/zhifa.png"),
icon2: require("../assets/images/zhifa-change.png"),
},
// {
// path: "/enterprise",
// name: "",
// icon1: require("../assets/images/qiye.png"),
// icon2: require("../assets/images/qiye-change.png"),
// },
{
path: "/enterprise",
name: "企业名录",
icon1: require("../assets/images/qiye.png"),
icon2: require("../assets/images/qiye-change.png"),
},
{
path: "/focusEnter",
name: "省重点企业",

@ -13,7 +13,8 @@ const whiteList = [
'/focusEnter',
'/enforcing',
"/planManage",
"/home"
"/home",
'/enterprise'
];

@ -96,17 +96,17 @@ export const constantRoutes = [
name: "enforcing",
meta:{index:2}
},
// {
// path: "/enterprise",
// component: () => import("@/views/yingji/enterprise.vue"),
// name: "enterprise",
// meta:{index:3}
// },
{
path: "/enterprise",
component: () => import("@/views/yingji/enterprise.vue"),
name: "enterprise",
meta:{index:3}
},
{
path: "/focusEnter",
component: () => import("@/views/yingji/focusEnter.vue"),
name: "focusEnter",
meta:{index:3}
meta:{index:4}
},
],

@ -29,7 +29,7 @@
</div>
<div v-if="!nextStep">
<div class="filtrate">
<div class="select-input">
<!-- <div class="select-input">
<div class="select-span">行政区划:</div>
<el-cascader
v-model="form.compartment"
@ -41,8 +41,8 @@
children: 'children',
}"
></el-cascader>
</div>
<div class="select-input">
</div> -->
<!-- <div class="select-input">
<div class="select-span">企业类型:</div>
<el-select v-model="form.frimType" placeholder="请选择">
<el-option
@ -53,16 +53,16 @@
>
</el-option>
</el-select>
</div>
<div class="select-input">
</div> -->
<!-- <div class="select-input">
<div class="select-span">经济类型:</div>
<el-cascader
v-model="form.economicsType"
:options="zhEconomicType"
:show-all-levels="false"
></el-cascader>
</div>
<div class="select-input">
</div> -->
<!-- <div class="select-input">
<div class="select-span">行业类型:</div>
<el-select v-model="form.industryType" placeholder="请选择">
<el-option
@ -73,12 +73,24 @@
>
</el-option>
</el-select>
</div> -->
<div class="select-input">
<div class="select-span">是否重点:</div>
<el-select v-model="form.isPoint" placeholder="请选择">
<el-option
v-for="item in hasPoint"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="select-input">
<div class="select-span">重大危险源等级:</div>
<el-select v-model="form.riskGrade" placeholder="请选择">
<div class="select-span">企业分色:</div>
<el-select v-model="form.entprColor" placeholder="请选择">
<el-option
v-for="item in otherDict.major_hazard_level"
v-for="item in otherDict.entpr_color"
:key="item.dictLabel"
:label="item.dictLabel"
:value="item.dictValue"
@ -87,10 +99,10 @@
</el-select>
</div>
<div class="select-input">
<div class="select-span">企业分色:</div>
<el-select v-model="form.frimColor" placeholder="请选择">
<div class="select-span">重大危险源等级:</div>
<el-select v-model="form.majorHazardLevel" placeholder="请选择">
<el-option
v-for="item in otherDict.entpr_color"
v-for="item in otherDict.major_hazard_level"
:key="item.dictLabel"
:label="item.dictLabel"
:value="item.dictValue"
@ -98,28 +110,31 @@
</el-option>
</el-select>
</div>
<div class="input-input">
<div class="select-input">
<div class="select-span">统一社会信用代码:</div>
<el-input
v-model="form.frimName"
placeholder="请输入企业名称/统一信用代码"
v-model="form.uscCode"
placeholder="请输入统一信用代码"
></el-input>
</div>
<div class="select-btn">搜索</div>
<div class="select-btn select-btn1">导入</div>
<div style="display: flex">
<div class="select-btn" @click="searchListInqy"></div>
<div class="select-btn" @click="reset"></div>
<div class="select-btn select-btn1" @click="exportData"></div>
</div>
</div>
<div class="tables">
<el-table
v-loading="tableLoad"
:data="tableData"
style="width: 100%"
:border="false"
@selection-change="handleSelectionChange"
@select="handleSelectionChange"
:row-class-name="tableRowClassName"
ref="multipleTable"
>
<el-table-column
type="selection"
width="55"
header-align="center"
>
<el-table-column prop="is" header-align="center" type="selection">
</el-table-column>
<el-table-column
prop="entprName"
@ -128,40 +143,36 @@
>
</el-table-column>
<el-table-column
prop="name"
label="行政区划"
prop="bizAddr"
label="地址"
width="180"
header-align="center"
>
</el-table-column>
<el-table-column
<!-- <el-table-column
prop="address"
label="企业类型"
header-align="center"
>
</el-table-column>
</el-table-column> -->
<el-table-column
prop="address"
prop="uscCode"
label="统一社会信用代码"
header-align="center"
>
</el-table-column>
<el-table-column prop="is" label="是否重点" header-align="center">
<el-table-column
prop="isPoint"
label="是否重点"
header-align="center"
>
<template slot-scope="scope">
<div
style="font-family: 'Alibaba PuHuiTi'"
@click="checkBox(scope.row)"
:class="scope.row.is == 1 ? 'isStyle' : ''"
:class="scope.row.isPoint == 1 ? 'isStyle' : ''"
>
<span v-if="scope.row.is == 1"></span>
<span v-if="scope.row.is == 2"></span>
</div>
</template>
</el-table-column>
<el-table-column prop="is" label="选择" header-align="center">
<template slot-scope="scope">
<div class="look" @click="chec(scope.row)">
<el-checkbox v-model="scope.row.is"></el-checkbox>
<span v-if="scope.row.isPoint == 1"></span>
<span v-else></span>
</div>
</template>
</el-table-column>
@ -169,7 +180,7 @@
</div>
<div class="pagination">
<my-pagination
:total="28"
:total="total"
@pagesChange="pagesChange"
></my-pagination>
</div>
@ -177,21 +188,32 @@
<div v-else class="release-planning">
<div class="inputs centered">
<div class="inputs-span">计划年份:</div>
<el-select v-model="form2.year" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
<el-date-picker
v-model="form2.plannedYear"
type="year"
placeholder="选择年"
value-format="yyyy"
>
</el-date-picker>
</div>
<div class="inputs centered">
<div class="inputs-span">行政区划:</div>
<el-cascader
v-model="form2.district"
:options="compartment"
:show-all-levels="false"
:props="{
value: 'subdistrict', //id
label: 'institutionName', //name
children: 'children',
}"
></el-cascader>
</div>
<div class="inputs centered">
<div class="inputs-span">计划标题:</div>
<div class="input">
<el-input
v-model="form2.title"
v-model="form2.planName"
:maxlength="50"
placeholder="请输入计划标题"
></el-input>
@ -201,7 +223,7 @@
<div class="inputs-span">计划内容:</div>
<div class="input">
<el-input
v-model="form2.content"
v-model="form2.planContent"
type="textarea"
resize="none"
placeholder="请输入计划内容"
@ -242,7 +264,8 @@
import myPagination from "@/views/components/myPagination/index.vue";
//====
import { xzTree, listDist } from "@/api/yingji/home.js";
import { listMsgEnterprise } from "@/api/yingji/planManage.js";
// ,
import { listMsgEnterprise, addPlanGL } from "@/api/yingji/planManage.js";
export default {
components: { myPagination },
data() {
@ -254,39 +277,45 @@ export default {
selected: 0,
nextStep: false,
nextText: "下一步",
form: {
compartment: "",
frimType: "",
economicsType: "",
industryType: "",
riskGrade: "",
frimColor: "",
frimName: "",
},
form2: {
uscCode: "",
current: 1,
size: 10,
},
//
basicMsg: {
//
economicSubcategory: "",
form: {
//
entprColor: "",
//
isPoint: "",
//
majorHazardLevel: "",
//
subdistrict: "",
//
//
uscCode: "",
},
//
form2: {
//
planName: "",
//
planContent: "",
//
// planNumb:'',
//
// planState:'',
//
plannedYear: "",
//
remark: "",
//id
enterpriseId: "",
//
district: "",
},
//
tableLoad: true,
//
searchBefore: {
pageNum: 1,
pageSize: 10,
},
//
total: 0,
//
compartment: [],
//
@ -304,6 +333,19 @@ export default {
],
//
otherDict: {},
//
checkList: [],
//
hasPoint: [
{
value: 1,
label: "是",
},
{
value: 0,
label: "否",
},
],
};
},
created() {
@ -314,34 +356,81 @@ export default {
//
xzTree().then((res) => {
this.compartment = res.data;
});
//
listDist({
list: "major_hazard_level,entpr_color,economic_categories,economic_subcategory",
}).then((res) => {
this.otherDict = res.data;
res.data.economic_categories.forEach((value, index) => {
this.zhEconomicType[0].children.push({
value: value.dictValue,
label: value.dictLabel,
this.filterComparment(this.compartment);
console.log(this.compartment);
}),
//
listDist({
list: "major_hazard_level,entpr_color,economic_categories,economic_subcategory",
}).then((res) => {
this.otherDict = res.data;
res.data.economic_categories.forEach((value, index) => {
this.zhEconomicType[0].children.push({
value: value.dictValue,
label: value.dictLabel,
});
});
});
res.data.economic_subcategory.forEach((value, index) => {
this.zhEconomicType[1].children.push({
value: value.dictValue,
label: value.dictLabel,
res.data.economic_subcategory.forEach((value, index) => {
this.zhEconomicType[1].children.push({
value: value.dictValue,
label: value.dictLabel,
});
});
});
this.epMsg();
},
filterComparment(e) {
e.forEach((value, index) => {
if (value.children.length >= 1) {
this.filterComparment(value.children);
} else {
delete value.children;
}
});
//
},
//
epMsg() {
this.tableLoad = true;
listMsgEnterprise(this.searchBefore).then((res) => {
this.tableData = res.data.list;
console.log(res);
this.tableData = res.data
this.total = res.data.total;
this.tableLoad = false;
this.tableData.forEach((row) => {
this.multipleSelection.forEach((rows) => {
if (row.uscCode == rows) {
this.$nextTick(() => {
this.$refs.multipleTable.toggleRowSelection(row, true);
});
}
});
});
});
},
checkBox(e) {},
//
searchListInqy() {
this.searchBefore = Object.assign(this.searchBefore, this.form);
this.epMsg();
},
//
reset() {
this.form = {
//
entprColor: "",
//
isPoint: "",
//
majorHazardLevel: "",
//
uscCode: "",
};
this.searchListInqy();
},
//
exportData() {},
open() {
this.dialogVisible = true;
this.epMsg();
},
Close() {
this.dialogVisible = false;
@ -350,11 +439,21 @@ export default {
},
//
pagesChange(pages) {
console.log(pages);
this.searchBefore.pageSize = pages.size;
this.searchBefore.pageNum = pages.current;
this.epMsg();
},
//
handleSelectionChange(val) {
this.multipleSelection = val;
handleSelectionChange(val, row) {
console.log(row);
if (this.multipleSelection.indexOf(row.uscCode) == -1) {
this.multipleSelection.push(row.uscCode);
} else {
this.multipleSelection.splice(
this.multipleSelection.indexOf(row.uscCode),
1
);
}
this.selected = this.multipleSelection.length;
},
//
@ -363,8 +462,11 @@ export default {
this.nextStep = true;
this.nextText = "发布计划";
} else {
console.log(form2);
// console.log('')
this.form2.enterpriseId = this.multipleSelection.join(',')
this.form2.district = this.form2.district[this.form2.district.length-1]
addPlanGL(this.form2).then((res) => {
console.log(res);
});
}
},
tableRowClassName({ row, rowIndex }) {
@ -377,28 +479,6 @@ export default {
};
</script>
<style lang="scss" scoped>
::v-deep .el-cascader {
background-color: transparent;
width: 190px;
.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%);
}
}
.isStyle {
color: #f71052;
}
@ -501,10 +581,11 @@ export default {
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
line-height: 40px;
// line-height: 40px;
margin-right: 10px;
}
::v-deep .el-select {
::v-deep .el-select,
.el-cascader {
background-color: transparent;
width: 180px;
.el-input__inner {
@ -528,8 +609,7 @@ export default {
}
}
}
.input-input {
margin: 20px 40px 0 0;
.select-input {
width: 250px;
::v-deep .el-input {
.el-input__inner {
@ -551,6 +631,7 @@ export default {
font-weight: 500;
color: #ffffff;
cursor: pointer;
margin-right: 10px;
}
.select-btn1 {
background: #28b384;

@ -130,8 +130,8 @@ export default {
},
},
created() {
this.getCode();
this.getCookie();
// this.getCode();
// this.getCookie();
},
methods: {
getCode() {
@ -159,30 +159,31 @@ export default {
this.$refs.loginForm.validate((valid) => {
if (valid) {
this.loading = true;
if (this.loginForm.rememberMe) {
Cookies.set("username", this.loginForm.username, { expires: 30 });
Cookies.set("password", encrypt(this.loginForm.password), {
expires: 30,
});
Cookies.set("rememberMe", this.loginForm.rememberMe, {
expires: 30,
});
} else {
Cookies.remove("username");
Cookies.remove("password");
Cookies.remove("rememberMe");
}
this.$store
.dispatch("Login", this.loginForm)
.then(() => {
this.$router.push({ path: this.redirect || "/" }).catch(() => {});
})
.catch(() => {
this.loading = false;
if (this.captchaEnabled) {
this.getCode();
}
});
this.$router.push({ path: this.redirect || "/" }).catch(() => {});
// if (this.loginForm.rememberMe) {
// Cookies.set("username", this.loginForm.username, { expires: 30 });
// Cookies.set("password", encrypt(this.loginForm.password), {
// expires: 30,
// });
// Cookies.set("rememberMe", this.loginForm.rememberMe, {
// expires: 30,
// });
// } else {
// Cookies.remove("username");
// Cookies.remove("password");
// Cookies.remove("rememberMe");
// }
// this.$store
// .dispatch("Login", this.loginForm)
// .then(() => {
// this.$router.push({ path: this.redirect || "/" }).catch(() => {});
// })
// .catch(() => {
// this.loading = false;
// if (this.captchaEnabled) {
// this.getCode();
// }
// });
}
});
},

@ -24,9 +24,15 @@
</div>
</div>
<div style="display: flex">
<div class="export" @click="addkeys">
<span>新增</span>
</div>
<div class="export" @click="exportFile">
<span>搜索</span>
</div>
<div class="export" @click="exportFile">
<span>重置</span>
</div>
<div class="export export1" @click="exportFile">
<span>导入</span>
</div>
@ -36,32 +42,186 @@
<el-table
:data="tableData"
style="width: 100%"
v-loading="loading"
:height="484"
:border="false"
:row-class-name="tableRowClassName"
:cell-style="columnStyle"
>
<el-table-column prop="year" label="计划年份" header-align="center">
<template slot-scope="scope">
{{ parseTime(scope.row.year, "{y}") }}
</template>
</el-table-column>
<el-table-column prop="year1" label="企业名称" header-align="center">
</el-table-column>
<el-table-column prop="entCode" label="统一社会信用代理" header-align="center">
<el-table-column
prop="entCode"
label="统一社会信用代理"
header-align="center"
>
</el-table-column>
<el-table-column prop="type" label="企业类别" header-align="center" >
<el-table-column prop="type" label="企业类别" header-align="center">
</el-table-column>
<!-- <el-table-column label="操作" header-align="center">
<el-table-column label="操作" header-align="center">
<template slot-scope="scope">
<div class="tabs-btns">
<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>
</template>
</el-table-column> -->
</el-table-column>
</el-table>
</div>
<div class="pagination">
<my-pagination :total="28" @pagesChange="pagesChange"></my-pagination>
</div>
<!-- 新增 -->
<el-dialog
:visible.sync="dialogVisible"
: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">{{ headerText }}省重点企业</div>
</div>
<img src="@/assets/images/close.png" alt="" @click="Close" />
</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="12">
<el-form-item label="企业名称" prop="name">
<el-input v-model="form.a1"></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-MM-dd HH:mm:ss"
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">取消</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="企业名称"></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>
</template>
@ -82,9 +242,34 @@ export default {
return {
tableData: [],
options: [],
form: {},
checkList: ["全部"],
checkListTwo: [],
loading: false,
headerText: "",
//
dialogVisible: false,
//
form: {
//
entCode: "",
//
remark: "",
//
type: "",
//
year: "",
},
addShow: false,
//
details: {},
rules: {
entCode: [
{ required: true, message: "请输入企业代码", trigger: "blur" },
],
remark: [{ required: true, message: "请输入备注", trigger: "change" }],
type: [{ required: true, message: "请输入大类", trigger: "change" }],
year: [{ required: true, message: "请选择年份", trigger: "change" }],
},
};
},
// watch: {
@ -101,12 +286,70 @@ export default {
this.getList();
},
methods: {
reset(){
this.form={
}
},
getList() {
this.loading = true;
listEnterprise().then((res) => {
console.log(res);
this.tableData = res.data.records
this.tableData = res.data.records;
this.loading = false;
});
},
//
shutDownDetail() {
this.addShow = false;
},
//
addkeys() {
this.headerText = "新增";
this.dialogVisible = true;
},
//
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;
});
},
//
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(e) {},
//
Close() {
this.dialogVisible = false;
},
//
setmealSelect() {
this.checkList = this.checkList.slice(-1);
@ -159,6 +402,53 @@ export default {
};
</script>
<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 {
// height: calc(100vh - 84px);
overflow: hidden;
@ -227,6 +517,7 @@ export default {
justify-content: center;
padding: 6px 19px;
background-color: #2378ec;
margin-right: 10px;
cursor: pointer;
img {
width: 22px;
@ -241,29 +532,12 @@ export default {
}
.export1 {
background-color: #28b384;
margin-left: 20px;
}
}
.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);
@ -296,5 +570,120 @@ export default {
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>

@ -7,210 +7,169 @@
* @LastEditTime: 2023-09-06 15:59:41
-->
<template>
<div class="plan-management">
<div class="plan-topBox">
<div class="drup-downs">
<div class="year">
<div class="year-span">年份:</div>
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
<div class="area">
<div class="area-span">区划:</div>
<el-select v-model="value2" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
<div class="plan-management">
<div class="plan-topBox">
<div class="drup-downs">
<div class="year">
<div class="year-span">年份:</div>
<el-select v-model="value" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
<div class="btns">
<div class="export" @click="exportFile">
<img src="@/assets/images/export.png" alt="">
<span>导出excel</span>
</div>
<div class="newProject" @click="newProject">
<img src="@/assets/images/newProject.png" alt="">
<span>新增计划</span>
</div>
<div class="area">
<div class="area-span">区划:</div>
<el-select v-model="value2" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</div>
</div>
<div class="plan-bottomBox">
<div class="tables">
<el-table
:data="tableData"
:border="false"
:height="484"
@selection-change="handleSelectionChange"
:row-class-name="tableRowClassName"
>
<el-table-column
type="selection"
width="55"
header-align="center"
>
</el-table-column>
<el-table-column
prop="date"
label="计划年份"
width="180"
header-align="center"
>
</el-table-column>
<el-table-column
prop="name"
label="行政区划"
width="180"
header-align="center"
>
</el-table-column>
<el-table-column
prop="address"
label="计划企业数量"
header-align="center"
>
</el-table-column>
<el-table-column
prop="address"
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)">
<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>
</template>
</el-table-column>
</el-table>
<div class="btns">
<div class="export" @click="exportFile">
<img src="@/assets/images/export.png" alt="" />
<span>导出excel</span>
</div>
<div class="pagination">
<my-pagination :total="28" @pagesChange="pagesChange"></my-pagination>
<div class="newProject" @click="newProject">
<img src="@/assets/images/newProject.png" alt="" />
<span>新增计划</span>
</div>
</div>
<my-dialog ref="myDialog"></my-dialog>
</div>
</template>
<div class="plan-bottomBox">
<div class="tables">
<el-table
:data="tableData"
:border="false"
:height="484"
@selection-change="handleSelectionChange"
:row-class-name="tableRowClassName"
>
<el-table-column type="selection" width="55" header-align="center">
</el-table-column>
<el-table-column
prop="date"
label="计划年份"
width="180"
header-align="center"
>
</el-table-column>
<el-table-column
prop="name"
label="行政区划"
width="180"
header-align="center"
>
</el-table-column>
<el-table-column
prop="address"
label="计划企业数量"
header-align="center"
>
</el-table-column>
<el-table-column
prop="address"
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)">
<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>
</template>
</el-table-column>
</el-table>
</div>
<div class="pagination">
<my-pagination :total="28" @pagesChange="pagesChange"></my-pagination>
</div>
</div>
<my-dialog ref="myDialog"></my-dialog>
</div>
</template>
<script>
import myPagination from "@/views/components/myPagination/index.vue"
import myDialog from "@/views/components/dialog/index.vue"
export default {
components:{myPagination,myDialog},
data() {
return {
options:[
],
value:'2022',
value2:'苏州',
tableData: [{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},{
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-08',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-06',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}, {
date: '2016-05-07',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
}],
multipleSelection: [],
import myPagination from "@/views/components/myPagination/index.vue";
import myDialog from "@/views/components/dialog/index.vue";
import {
listPlanGL,
addPlanGL,
updatePlanGL,
deletePlanGL,
getPlanGL,
} from "@/api/yingji/planManage.js";
export default {
components: { myPagination, myDialog },
data() {
return {
options: [],
value: "2022",
value2: "苏州",
tableData: [],
multipleSelection: [],
//
queryParms:{
pageNum:1,
pageSize:10
}
};
},
created() {
this.getList()
},
methods: {
getList() {
listPlanGL(this.queryParms).then((res) => {
console.log(res);
});
},
methods:{
//
pagesChange(pages){
console.log(pages)
},
//
handleSelectionChange(val) {
this.multipleSelection = val;
},
//
exportFile(){
console.log(this.multipleSelection)
},
//
newProject(){
this.$refs.myDialog.open()
},
//
look(row){
},
//
change(row){
},
//
deleteItem(row){
this.$modal.confirm("你确认要删除所选数据吗?", "提示", {
//
pagesChange(pages) {
console.log(pages);
},
//
handleSelectionChange(val) {
this.multipleSelection = val;
},
//
exportFile() {
console.log(this.multipleSelection);
},
//
newProject() {
this.$refs.myDialog.open();
},
//
look(row) {},
//
change(row) {},
//
deleteItem(row) {
this.$modal
.confirm("你确认要删除所选数据吗?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
@ -220,183 +179,189 @@
// console.log(response);
// });
// this.getList();
console.log(row)
console.log('确定删除')
console.log(row);
console.log("确定删除");
})
.catch(() => {
console.log('取消删除')
console.log("取消删除");
});
},
tableRowClassName({row, rowIndex}) {
if (rowIndex % 2 !== 0) {
return 'success-row';
}
return '';
},
},
created() {
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
// console.log(this.main.height)
// })
tableRowClassName({ row, rowIndex }) {
if (rowIndex % 2 !== 0) {
return "success-row";
}
return "";
},
}
</script>
},
created() {
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
// console.log(this.main.height)
// })
},
};
</script>
<style lang="scss" scoped>
.plan-management {
padding: 0 20px;
background-color: #fff;
height: 100%;
.plan-topBox {
.plan-management {
padding: 0 20px;
background-color: #fff;
height: 100%;
.plan-topBox {
display: flex;
justify-content: space-between;
padding: 31px 0 12px 0;
// background-color: yellow;
.drup-downs {
display: flex;
justify-content: space-between;
padding: 31px 0 12px 0;
// background-color: yellow;
.drup-downs {
align-items: center;
.year {
display: flex;
align-items: center;
.year {
display: flex;
align-items: center;
margin-right: 81px;
.year-span {
font-size: 14px;
font-family: 'Alibaba PuHuiTi';
font-weight: 400;
color: #525966;
line-height: 40px;
margin-right: 10px;
}
margin-right: 81px;
.year-span {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
line-height: 40px;
margin-right: 10px;
}
.area {
display: flex;
align-items: center;
.area-span {
font-size: 14px;
font-family: 'Alibaba PuHuiTi';
font-weight: 400;
color: #525966;
line-height: 40px;
margin-right: 10px;
}
}
.area {
display: flex;
align-items: center;
.area-span {
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
color: #525966;
line-height: 40px;
margin-right: 10px;
}
::v-deep .el-select {
background-color: transparent;
width: 276px;
.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%);
}
::v-deep .el-select {
background-color: transparent;
width: 276px;
.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%);
}
}
}
.btns {
display: flex;
align-items: center;
.export,
.newProject {
display: flex;
align-items: center;
justify-content: center;
padding: 6px 19px;
cursor: pointer;
img {
width: 22px;
margin-right: 10px;
}
span {
color: #ffffff;
font-size: 14px;
font-family: "Alibaba PuHuiTi";
font-weight: 400;
}
}
.export {
background-color: #2378ec;
margin-right: 30px;
}
.newProject {
background-color: #28b384;
}
}
}
.plan-bottomBox {
margin-top: 10px;
.tables {
::v-deep .el-table {
.success-row {
background-color: rgba(234, 242, 253, 0.25);
}
td {
height: 42px;
box-sizing: border-box;
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;
}
}
}
.btns {
::v-deep .el-table::before {
height: 0;
}
.tabs-btns {
display: flex;
align-items: center;
.export,.newProject {
justify-content: center;
.look,
.change,
.delete {
display: flex;
align-items: center;
justify-content: center;
padding: 6px 19px;
margin-right: 30px;
cursor: pointer;
img {
width: 22px;
margin-right: 10px;
width: 20px;
margin-right: 5px;
}
span {
color: #ffffff;
font-size: 14px;
font-family: 'Alibaba PuHuiTi';
font-weight: 400;
}
}
.export {
background-color: #2378EC;
margin-right: 30px;
}
.newProject {
background-color: #28B384;
}
}
}
.plan-bottomBox {
margin-top: 10px;
.tables {
::v-deep .el-table {
.success-row {
background-color: rgba(234, 242, 253, 0.25);
}
td {
height: 42px;
box-sizing: border-box;
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;
}
font-family: Alibaba PuHuiTi;
font-weight: 400;
color: #045ffd;
}
}
::v-deep .el-table::before {
height: 0;
}
.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;
}
.delete {
margin-right: 0;
span {
color: #f71052;
}
}
}
.pagination {
margin-top: 40px;
}
}
.pagination {
margin-top: 40px;
}
}
</style>
}
</style>
Loading…
Cancel
Save