|
|
<template>
|
|
|
<div class="activityBox">
|
|
|
<div class="uploadForm">
|
|
|
<div class="noteBox">
|
|
|
<h3 class="lableBox">活动名称：</h3>
|
|
|
<el-input
|
|
|
class="noteClass"
|
|
|
v-model="activityForm.title"
|
|
|
placeholder="输入活动名称"
|
|
|
@focus="inputfocus"
|
|
|
></el-input>
|
|
|
<p class="redErr" v-if="titleFlag">*请输入活动名称</p>
|
|
|
</div>
|
|
|
<div class="upgradeBox">
|
|
|
<h3 class="lableBox">装置列表：</h3>
|
|
|
<el-input
|
|
|
type="textarea"
|
|
|
:rows="28"
|
|
|
placeholder="请输入装置列表"
|
|
|
v-model="activityForm.cmdidArr"
|
|
|
@focus="textfocus"
|
|
|
>
|
|
|
</el-input>
|
|
|
<p class="redErr" v-if="cmdidFlag">*请输入活动名称</p>
|
|
|
</div>
|
|
|
<el-button
|
|
|
class="uploadBtn"
|
|
|
size="small"
|
|
|
type="primary"
|
|
|
@click="submitUpload"
|
|
|
>上传活动列表</el-button
|
|
|
>
|
|
|
</div>
|
|
|
<div class="activityList">
|
|
|
<el-table
|
|
|
:data="activityData"
|
|
|
style="width: 100%"
|
|
|
border
|
|
|
stripe
|
|
|
height="calc(100% - 0px)"
|
|
|
v-loading="activityloading"
|
|
|
>
|
|
|
<el-table-column type="index" width="50" label="序号">
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
prop="createTime"
|
|
|
label="创建时间"
|
|
|
width="180"
|
|
|
></el-table-column>
|
|
|
<el-table-column prop="title" label="活动名称"> </el-table-column>
|
|
|
<el-table-column prop="termCount" label="装置数量"> </el-table-column>
|
|
|
<!-- <el-table-column prop="path" label="文件路径"> </el-table-column> -->
|
|
|
<el-table-column label="操作" width="300" class-name="editClass">
|
|
|
<template slot-scope="scope">
|
|
|
<el-link
|
|
|
type="primary"
|
|
|
@click="handleEditClick(scope.row)"
|
|
|
size="small"
|
|
|
icon="el-icon-document"
|
|
|
>详情</el-link
|
|
|
>
|
|
|
<el-link
|
|
|
type="danger"
|
|
|
@click="handleDeleteClick(scope.row)"
|
|
|
size="small"
|
|
|
icon="el-icon-delete"
|
|
|
>删除</el-link
|
|
|
>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
</div>
|
|
|
<el-dialog
|
|
|
class="termsDialog"
|
|
|
:title="activityName"
|
|
|
:visible.sync="termsShow"
|
|
|
:close-on-click-modal="false"
|
|
|
width="50%"
|
|
|
>
|
|
|
<el-table
|
|
|
:data="termsData"
|
|
|
style="width: 100%"
|
|
|
:header-cell-style="{ 'text-align': 'center' }"
|
|
|
:cell-style="{ 'text-align': 'center' }"
|
|
|
border
|
|
|
stripe
|
|
|
height="600px"
|
|
|
v-loading="activityloading"
|
|
|
>
|
|
|
<el-table-column type="index" width="50" label="序号">
|
|
|
</el-table-column>
|
|
|
|
|
|
<el-table-column prop="line_name" label="线路名称"> </el-table-column>
|
|
|
<el-table-column prop="tower_name" label="杆塔名称"> </el-table-column>
|
|
|
<el-table-column prop="protocol" label="规约">
|
|
|
<template slot-scope="scope">
|
|
|
{{ protocolMap[scope.row.protocol] }}
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
</el-table>
|
|
|
<div slot="footer" class="dialog-footer">
|
|
|
<el-button @click="termsShow = false">关闭</el-button>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { updActivityApi, getqueryActivityApi } from "@/utils/api/index";
|
|
|
|
|
|
export default {
|
|
|
name: "activity",
|
|
|
components: {},
|
|
|
data() {
|
|
|
return {
|
|
|
activityloading: true,
|
|
|
activityData: [], //活动列表
|
|
|
activityForm: {
|
|
|
title: "",
|
|
|
cmdidArr: "",
|
|
|
},
|
|
|
titleFlag: false, //title为空
|
|
|
cmdidFlag: false, //cmdid为空
|
|
|
termsShow: false,
|
|
|
termsData: [],
|
|
|
termsLoading: true,
|
|
|
activityName: "",
|
|
|
protocolMap: {
|
|
|
65280: "国网I1",
|
|
|
65296: "陕西",
|
|
|
65281: "安徽",
|
|
|
65282: "江苏",
|
|
|
65283: "湖南",
|
|
|
65284: "浙江",
|
|
|
65285: "河南全景",
|
|
|
65286: "河南郑州",
|
|
|
65290: "河南统一视频v2020",
|
|
|
},
|
|
|
};
|
|
|
},
|
|
|
computed: {},
|
|
|
mounted() {
|
|
|
this.getactivityList();
|
|
|
},
|
|
|
methods: {
|
|
|
//获取活动列表
|
|
|
getactivityList() {
|
|
|
this.activityloading = true;
|
|
|
this.activityData = [];
|
|
|
getqueryActivityApi({
|
|
|
act: "list",
|
|
|
})
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.activityData = res.data;
|
|
|
this.activityloading = false;
|
|
|
})
|
|
|
.catch((err) => {});
|
|
|
},
|
|
|
//活动详情
|
|
|
handleEditClick(row) {
|
|
|
this.termsShow = true;
|
|
|
this.termsLoading = true;
|
|
|
this.termsData = [];
|
|
|
getqueryActivityApi({
|
|
|
act: "detail",
|
|
|
id: row.id,
|
|
|
})
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.termsLoading = false;
|
|
|
this.activityName =
|
|
|
res.data.activity.title + "(" + res.data.activity.termCount + ")";
|
|
|
this.termsData = res.data.terms;
|
|
|
})
|
|
|
.catch((err) => {});
|
|
|
},
|
|
|
//删除该活动
|
|
|
handleDeleteClick(row) {
|
|
|
console.log(row);
|
|
|
updActivityApi({
|
|
|
act: "del",
|
|
|
id: row.id,
|
|
|
})
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
|
|
|
confirmButtonText: "确定",
|
|
|
cancelButtonText: "取消",
|
|
|
type: "warning",
|
|
|
})
|
|
|
.then(() => {
|
|
|
this.$message({
|
|
|
duration: 1500,
|
|
|
showClose: true,
|
|
|
message: "文件删除成功",
|
|
|
type: "success",
|
|
|
});
|
|
|
this.getactivityList();
|
|
|
})
|
|
|
.catch(() => {});
|
|
|
})
|
|
|
.catch((err) => {});
|
|
|
},
|
|
|
//title获取焦点时触发
|
|
|
inputfocus() {
|
|
|
this.titleFlag = false;
|
|
|
},
|
|
|
//text获取焦点时触发
|
|
|
textfocus() {
|
|
|
this.cmdidFlag = false;
|
|
|
},
|
|
|
//上传活动列表
|
|
|
submitUpload() {
|
|
|
if (this.activityForm.title == "") {
|
|
|
this.titleFlag = true;
|
|
|
return;
|
|
|
}
|
|
|
if (this.activityForm.cmdidArr == "") {
|
|
|
this.cmdidFlag = true;
|
|
|
return;
|
|
|
}
|
|
|
console.log(this.activityForm.title);
|
|
|
console.log(this.activityForm.cmdidArr);
|
|
|
//console.log(arrList);
|
|
|
updActivityApi({
|
|
|
title: this.activityForm.title,
|
|
|
cmdids: this.activityForm.cmdidArr,
|
|
|
act: "new",
|
|
|
})
|
|
|
.then((res) => {
|
|
|
console.log(res);
|
|
|
this.getactivityList();
|
|
|
this.activityForm.title = "";
|
|
|
this.activityForm.cmdidArr = "";
|
|
|
})
|
|
|
.catch((err) => {});
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="less">
|
|
|
.activityBox {
|
|
|
height: calc(100% - 24px);
|
|
|
width: calc(100% - 24px);
|
|
|
padding: 12px;
|
|
|
display: flex;
|
|
|
.uploadForm {
|
|
|
min-width: 300px;
|
|
|
margin-right: 20px;
|
|
|
|
|
|
.noteBox {
|
|
|
margin-bottom: 16px;
|
|
|
position: relative;
|
|
|
.noteClass {
|
|
|
width: 100%;
|
|
|
}
|
|
|
.lableBox {
|
|
|
font-size: 14px;
|
|
|
font-weight: normal;
|
|
|
width: 78px;
|
|
|
line-height: 32px;
|
|
|
}
|
|
|
.redErr {
|
|
|
position: absolute;
|
|
|
font-size: 12px;
|
|
|
color: red;
|
|
|
}
|
|
|
}
|
|
|
.upgradeBox {
|
|
|
position: relative;
|
|
|
.lableBox {
|
|
|
font-size: 14px;
|
|
|
font-weight: normal;
|
|
|
width: 78px;
|
|
|
line-height: 32px;
|
|
|
}
|
|
|
.redErr {
|
|
|
position: absolute;
|
|
|
font-size: 12px;
|
|
|
color: red;
|
|
|
}
|
|
|
}
|
|
|
.uploadBtn {
|
|
|
margin-top: 16px;
|
|
|
margin-left: auto;
|
|
|
display: flex;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.activityList {
|
|
|
height: calc(100% - 0px);
|
|
|
flex: 1;
|
|
|
min-width: 0;
|
|
|
.el-table {
|
|
|
.el-table__cell {
|
|
|
text-align: center;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
.editClass {
|
|
|
.el-link.el-link--primary {
|
|
|
margin-right: 14px;
|
|
|
}
|
|
|
}
|
|
|
.termsDialog {
|
|
|
.el-dialog {
|
|
|
margin-top: 0 !important;
|
|
|
position: absolute;
|
|
|
left: 50%;
|
|
|
top: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
}
|
|
|
.el-dialog__body {
|
|
|
padding: 12px;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
</style>
|