Commit 72abe1c5 authored by 黄奎's avatar 黄奎

下载修改

parent 83747c65
<style>
.CarrierList {
border-bottom: 1px dashed #eee;
padding-bottom: 5px;
margin-bottom: 5px;
}
.CarrierList {
border-bottom: 1px dashed #eee;
padding-bottom: 5px;
margin-bottom: 5px;
}
.CarrierList span {
display: inline-block;
margin-right: 10px;
}
.CarrierList span {
display: inline-block;
margin-right: 10px;
}
</style>
<template>
<div class="VehicleManagement">
<div class="head-title">
载体管理
<!-- <el-button style="float:right;margin-top: -5px;" size="small" type="primary" @click="CommonJump('editVehicle')">
新增载体</el-button> -->
 
<div>
<el-button
@click="dialogVisible = true"
style="float: right; margin-top: -25px"
size="small"
type="primary"
>批量导出
<el-button @click="checkAll=false,dialogVisible = true" style="float: right; margin-top: -25px" size="small" type="primary">
批量导出
</el-button>
</div>
<div>
<el-button
type="primary"
style="float: right; margin: -25px 10px 0px 0px"
class="el-button--small"
@click="CommonJump('editVehicle')"
>新增载体</el-button
>
<el-button type="primary" style="float: right; margin: -25px 10px 0px 0px" class="el-button--small"
@click="CommonJump('editVehicle')">新增载体</el-button>
</div>
</div>
<div class="content">
<div>
<div class="searchInput" style="width: 250px; margin-bottom: 10px">
<el-input
@keyup.enter.native="(msg.pageIndex = 1), getList()"
@clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px"
placeholder="项目名称"
v-model="msg.CarrierName"
size="small"
clearable
>
<el-input @keyup.enter.native="(msg.pageIndex = 1), getList()" @clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px" placeholder="项目名称" v-model="msg.CarrierName"
size="small" clearable>
</el-input>
<span
@click="(msg.pageIndex = 1), getList()"
class="el-icon-search"
style="
<span @click="(msg.pageIndex = 1), getList()" class="el-icon-search" style="
color: #979dad;
font-size: 14px;
position: relative;
top: 1px;
"
></span>
"></span>
</div>
<div class="searchInput" style="width: 250px; margin-bottom: 10px">
<el-input
@keyup.enter.native="(msg.pageIndex = 1), getList()"
@clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px"
placeholder="开发商"
v-model="msg.Developers"
size="small"
clearable
>
<el-input @keyup.enter.native="(msg.pageIndex = 1), getList()" @clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px" placeholder="开发商" v-model="msg.Developers"
size="small" clearable>
</el-input>
<span
@click="(msg.pageIndex = 1), getList()"
class="el-icon-search"
style="
<span @click="(msg.pageIndex = 1), getList()" class="el-icon-search" style="
color: #979dad;
font-size: 14px;
position: relative;
top: 1px;
"
></span>
"></span>
</div>
<div class="searchInput" style="width: 250px; margin-bottom: 10px">
<el-input
@keyup.enter.native="(msg.pageIndex = 1), getList()"
@clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px"
@keyup.native="checkInteger(msg, 'MetroNum')"
placeholder="地铁线路"
v-model="msg.MetroNum"
size="small"
clearable
>
<el-input @keyup.enter.native="(msg.pageIndex = 1), getList()" @clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px" @keyup.native="checkInteger(msg, 'MetroNum')"
placeholder="地铁线路" v-model="msg.MetroNum" size="small" clearable>
</el-input>
<span
@click="(msg.pageIndex = 1), getList()"
class="el-icon-search"
style="
<span @click="(msg.pageIndex = 1), getList()" class="el-icon-search" style="
color: #979dad;
font-size: 14px;
position: relative;
top: 1px;
"
></span>
"></span>
</div>
<div class="searchInput" style="width: 250px; margin-bottom: 10px">
<el-input
@keyup.enter.native="(msg.pageIndex = 1), getList()"
@clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px"
placeholder="地铁站名称"
v-model="msg.MetroName"
size="small"
clearable
>
<el-input @keyup.enter.native="(msg.pageIndex = 1), getList()" @clear="(msg.pageIndex = 1), getList()"
style="display: inline-block; width: 225px; height: 30px" placeholder="地铁站名称" v-model="msg.MetroName"
size="small" clearable>
</el-input>
<span
@click="(msg.pageIndex = 1), getList()"
class="el-icon-search"
style="
<span @click="(msg.pageIndex = 1), getList()" class="el-icon-search" style="
color: #979dad;
font-size: 14px;
position: relative;
top: 1px;
"
></span>
"></span>
</div>
<div class="searchInput" style="width: 200px; margin-bottom: 10px">
<el-select size="small" v-model="msg.UserId" :filter-method="ChangeListName" filterable @change="(msg.pageIndex = 1), getList()"
placeholder="请选择">
<el-select size="small" v-model="msg.UserId" :filter-method="ChangeListName" filterable
@change="(msg.pageIndex = 1), getList()" placeholder="请选择">
<el-option label="不限" :value="0"></el-option>
<el-option v-for="item in userList" :key="item.Id" :label="item.Name" :value="item.Id">
</el-option>
</el-select>
</div>
<el-date-picker
class="indataPicker"
type="daterange"
v-model="dateStr"
range-separator="至"
start-placeholder="开业日期"
end-placeholder="开业日期"
size="small"
@change="getList"
value-format="yyyy-MM-dd"
>
<el-date-picker class="indataPicker" type="daterange" v-model="dateStr" range-separator="至"
start-placeholder="开业日期" end-placeholder="开业日期" size="small" @change="getList" value-format="yyyy-MM-dd">
</el-date-picker>
</div>
<el-table
:data="tableData"
v-loading="loading"
border
style="width: 100%; margin: 20px 0"
>
<el-table :data="tableData" v-loading="loading" border style="width: 100%; margin: 20px 0">
<el-table-column prop="CarrierName" width="200" label="项目名称">
</el-table-column>
<el-table-column prop="CarrierMetroList" label="地铁信息" width="200">
<template slot-scope="scope">
<div
v-for="(item, index) in scope.row.CarrierMetroList"
:key="index"
class="CarrierList"
>
<span>{{ item.MetroNum }}号线</span
><span>{{ item.MetroName }}</span
><span>{{ item.Distance }}</span>
<div v-for="(item, index) in scope.row.CarrierMetroList" :key="index" class="CarrierList">
<span>{{ item.MetroNum }}号线</span><span>{{ item.MetroName }}</span><span>{{ item.Distance }}</span>
</div>
</template>
</el-table-column>
<el-table-column prop="Logo" width="100" label="logo">
<template slot-scope="scope">
<el-image
:src="scope.row.Logo"
style="width: 50px"
:preview-src-list="scope.row.LogoList"
>
<el-image :src="scope.row.Logo" style="width: 50px" :preview-src-list="scope.row.LogoList">
</el-image>
</template>
</el-table-column>
......@@ -195,286 +119,305 @@
<el-table-column prop="UserName" width="100" label="认证用户"></el-table-column>
<el-table-column label="操作" width="100">
<template slot-scope="scope">
<el-tooltip
class="item"
effect="dark"
content="修改"
placement="top"
>
<img
@click="CommonJump('editVehicle', { ID: scope.row.ID })"
src="../../assets/img/userman/edit.png"
alt=""
/>
<el-tooltip class="item" effect="dark" content="修改" placement="top">
<img @click="CommonJump('editVehicle', { ID: scope.row.ID })" src="../../assets/img/userman/edit.png"
alt="" />
</el-tooltip>
<el-tooltip
class="item"
effect="dark"
content="删除"
placement="top"
>
<img
@click="delManage(scope.row)"
src="../../assets/img/userman/del.png"
alt=""
/>
<el-tooltip class="item" effect="dark" content="删除" placement="top">
<img @click="delManage(scope.row)" src="../../assets/img/userman/del.png" alt="" />
</el-tooltip>
</template>
</el-table-column>
</el-table>
<el-pagination
style="text-align: right"
background
@current-change="handleCurrentChange"
:page-size="msg.pageSize"
:current-page.sync="msg.pageIndex"
layout="total,prev, pager, next"
:total="total"
>
<el-pagination style="text-align: right" background @current-change="handleCurrentChange"
:page-size="msg.pageSize" :current-page.sync="msg.pageIndex" layout="total,prev, pager, next" :total="total">
</el-pagination>
</div>
<!-- 选择导出信息 -->
<el-dialog title="选择导出信息" :visible.sync="dialogVisible" width="960px">
<el-form
style="border: 1px solid #f0f2f7"
:model="addMsg"
ref="addMsg"
label-width="100px"
>
<div
style="
<div v-loading="downLoadLoading" :element-loading-text="loadingText">
<el-form style="border: 1px solid #f0f2f7" :model="addMsg" ref="addMsg" label-width="100px">
<div style="
box-sizing: border-box;
background-color: #f3f5f6;
width: 100%;
padding-left: 20px;
height: 50px;
line-height: 50px;
"
>
<el-checkbox
:indeterminate="isIndeterminate"
v-model="checkAll"
@change="handleCheckAllChange"
>全选
</el-checkbox>
</div>
<div style="margin: 15px 0"></div>
<div style="padding: 10px 25px 20px">
<el-checkbox-group
v-model="checkedCities"
@change="handleCheckedCitiesChange"
>
<el-checkbox
style="margin-bottom: 10px; width: 135px"
v-for="city in cities"
:label="city.Id"
:key="city.Name"
>
{{ city.Name }}</el-checkbox
>
</el-checkbox-group>
">
<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选
</el-checkbox>
</div>
<div style="margin: 15px 0"></div>
<div style="padding: 10px 25px 20px">
<el-checkbox-group v-model="checkedCities" @change="handleCheckedCitiesChange">
<el-checkbox style="margin-bottom: 10px; width: 135px" v-for="city in cities" :label="city.Id"
:key="city.Name">
{{ city.Name }}</el-checkbox>
</el-checkbox-group>
</div>
</el-form>
<div style="text-align: right; margin-top: 20px">
<el-button size="small" type="primary" @click="downLoadCarrier">导出</el-button>
</div>
</el-form>
<div style="text-align: right; margin-top: 20px">
<el-button size="small" type="primary" @click="Export">导出</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
return {
msg: {
MetroName: "", //地铁站名称
pageIndex: 1,
pageSize: 15,
CarrierName: "", //载体名称
MetroNum: "", //地铁线路
Developers: "", //开发商
StartOpenTime: "", //开业开始时间
EndOpenTime: "", // 开业截止时间
ExcelEnumIds: [],
UserId:0,
},
usermsg: {
pageIndex: 1,
pageSize: 20,
Name: '',
Source: 0,
MemberGrade: 0,
Id: 0,
Moblie: ''
},
userList:[],
addMsg: {},
dialogVisible: false,
dateStr: [], //日期
total: 0,
tableData: [], //数据列表
isShowAdd: false, //新增修改载体
ProjectTypeList: [], //项目类型
checkAll: false,
checkedCities: [],
cities: [],
cityOptions: [],
isIndeterminate: false,
};
},
created() {
this.getList();
this.getTypeEnumList();
this.getDown();
this.getuserList()
},
methods: {
ChangeListName(val) {
import {
setInterval,
clearInterval
} from 'timers';
export default {
data() {
return {
msg: {
MetroName: "", //地铁站名称
pageIndex: 1,
pageSize: 15,
CarrierName: "", //载体名称
MetroNum: "", //地铁线路
Developers: "", //开发商
StartOpenTime: "", //开业开始时间
EndOpenTime: "", // 开业截止时间
ExcelEnumIds: [],
UserId: 0,
},
usermsg: {
pageIndex: 1,
pageSize: 20,
Name: '',
Source: 0,
MemberGrade: 0,
Id: 0,
Moblie: ''
},
userList: [],
addMsg: {},
dialogVisible: false,
dateStr: [], //日期
total: 0,
tableData: [], //数据列表
isShowAdd: false, //新增修改载体
ProjectTypeList: [], //项目类型
checkAll: false,
checkedCities: [],
cities: [],
cityOptions: [],
isIndeterminate: false,
downLoadLoading: false, //导出Loading
download_timer: null, //下载文件timer
loadingText: "", //下载文件提示名称
};
},
created() {
this.getList();
this.getTypeEnumList();
this.getDown();
this.getuserList()
},
methods: {
ChangeListName(val) {
this.usermsg.Name = val;
this.getuserList();
},
getuserList() {
},
getuserList() {
this.apipost("/api/user/GetMemberUserDropDownList", this.usermsg, res => {
if (res.data.resultCode == 1) {
if (res.data.resultCode == 1) {
let pageData = res.data.data.pageData;
this.userList = pageData;
}
}
})
},
getList() {
this.loading = true;
if (this.dateStr && this.dateStr.length > 0) {
this.msg.StartOpenTime = this.dateStr[0];
this.msg.EndOpenTime = this.dateStr[1];
} else {
this.msg.StartOpenTime = "";
this.msg.EndOpenTime = "";
}
this.apipost("/api/Trade/GetCarrierPageList", this.msg, (res) => {
this.loading = false;
if (res.data.resultCode == 1) {
this.total = res.data.data.count;
let pageData = res.data.data.pageData;
this.tableData = pageData;
this.tableData.forEach((x) => {
x.LogoList = [];
x.LogoList.push(x.Logo);
});
}
});
},
handleCheckAllChange(val) {
this.checkedCities = val ? this.cityOptions : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.cities.length;
this.isIndeterminate =
checkedCount > 0 && checkedCount < this.cities.length;
},
Export() {
this.msg.ExcelEnumIds = this.checkedCities;
let msg = JSON.parse(JSON.stringify(this.msg));
if (!msg.Id || msg.Id == "") {
msg.Id = 0;
}
this.GetLocalFile(
"/api/Trade/GetCarrierListToExcel",
msg,
"载体信息.xls",
null,
() => {
this.checkedCities = [];
},
getList() {
this.loading = true;
if (this.dateStr && this.dateStr.length > 0) {
this.msg.StartOpenTime = this.dateStr[0];
this.msg.EndOpenTime = this.dateStr[1];
} else {
this.msg.StartOpenTime = "";
this.msg.EndOpenTime = "";
}
);
},
getDown() {
this.cityOptions = [];
this.apipost("/api/Trade/GetCarrierExportEnumList", {}, (res) => {
this.cities = res.data.data;
let data = res.data.data;
data.forEach((item) => {
this.cityOptions.push(item.Id);
this.apipost("/api/Trade/GetCarrierPageList", this.msg, (res) => {
this.loading = false;
if (res.data.resultCode == 1) {
this.total = res.data.data.count;
let pageData = res.data.data.pageData;
this.tableData = pageData;
this.tableData.forEach((x) => {
x.LogoList = [];
x.LogoList.push(x.Logo);
});
}
});
});
},
//删除
delManage(obj) {
let that = this;
that.Confirm("是否删除?", function () {
that.apipost(
"/api/Trade/RemoveCarrier",
{
CarrierId: obj.ID,
Status: 1,
},
},
handleCheckAllChange(val) {
this.checkedCities = val ? this.cityOptions : [];
this.isIndeterminate = false;
},
handleCheckedCitiesChange(value) {
let checkedCount = value.length;
this.checkAll = checkedCount === this.cities.length;
this.isIndeterminate =
checkedCount > 0 && checkedCount < this.cities.length;
},
//下载载体文件
downLoadCarrier() {
this.msg.ExcelEnumIds = this.checkedCities;
let msg = JSON.parse(JSON.stringify(this.msg));
if (!msg.Id || msg.Id == "") {
msg.Id = 0;
}
this.downLoadLoading = true;
this.loadingText = "正在生成载体文件,请勿关闭或刷新页面...";
var that = this;
this.download_timer = setInterval(function () {
that.checkCarrierFile(msg)
}, 2000);
},
checkCarrierFile(msg) {
var fileName = "载体信息.xls";
var that = this;
this.apipost(
"/api/Trade/CheckCarrierFile",
msg,
(res) => {
if (res.data.resultCode == 1) {
that.Success(res.data.message);
that.getList();
} else {
that.Error(res.data.message);
clearInterval(this.download_timer);
this.checkedCities = [];
this.loadingText = "正在下载载体文件,请勿关闭或刷新页面...";
var fileUrl = res.data.data.fileUrl;
var filepath = res.data.data.filePath;
var key = res.data.message;
var params = {
fileUrl: fileUrl
}
//删除缓存和Key
var deleteparams = {
key: key,
fileUrl: fileUrl,
filepath: filepath,
};
var apiurl = that.domainManager().DomainUrl + "/api/Trade/GetFile";
var postData = that.GetPostData("", params, "");
that.$http.post(apiurl, postData, {
responseType: 'arraybuffer',
onDownloadProgress: (progressEvent) => {
const progress = Math.round((progressEvent.loaded / progressEvent.total) * 100);
that.loadingText = `正在下载载体文件` + progress + `%,请勿关闭或刷新页面...`;
// 在这里处理下载进度, 如更新界面上的进度条
}
}).then((res) => {
let blob = new Blob([res.data], {
type: "application/vnd.ms-excel"
})
let url = URL.createObjectURL(blob);
let link = document.createElement('a');
link.href = url;
link.setAttribute("download", fileName);
document.body.appendChild(link);
link.click();
that.downLoadLoading = false;
that.loadingText = "";
that.apipost("/api/Trade/DeleteKey", deleteparams, (res) => {})
that.dialogVisible = false;
}).catch(function (res) {
console.log(res);
});
}
}
);
});
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
//获取项目类型
getTypeEnumList() {
this.apipost("/api/Trade/GetProjectTypeEnumList", {}, (res) => {
if (res.data.resultCode == 1) {
this.ProjectTypeList = res.data.data;
}
});
},
},
//获取项目类型
getProject(type) {
let str = "";
this.ProjectTypeList.forEach((x) => {
if (x.Id == type) {
str = x.Name;
}
});
return str;
getDown() {
this.cityOptions = [];
this.apipost("/api/Trade/GetCarrierExportEnumList", {}, (res) => {
this.cities = res.data.data;
let data = res.data.data;
data.forEach((item) => {
this.cityOptions.push(item.Id);
});
});
},
//删除
delManage(obj) {
let that = this;
that.Confirm("是否删除?", function () {
that.apipost(
"/api/Trade/RemoveCarrier", {
CarrierId: obj.ID,
Status: 1,
},
(res) => {
if (res.data.resultCode == 1) {
that.Success(res.data.message);
that.getList();
} else {
that.Error(res.data.message);
}
}
);
});
},
handleCurrentChange(val) {
this.msg.pageIndex = val;
this.getList();
},
//获取项目类型
getTypeEnumList() {
this.apipost("/api/Trade/GetProjectTypeEnumList", {}, (res) => {
if (res.data.resultCode == 1) {
this.ProjectTypeList = res.data.data;
}
});
},
//获取项目类型
getProject(type) {
let str = "";
this.ProjectTypeList.forEach((x) => {
if (x.Id == type) {
str = x.Name;
}
});
return str;
},
},
},
mounted() {},
};
mounted() {},
};
</script>
<style>
.VehicleManagement .content .searchInput {
border: 1px solid #dcdfe6;
border-radius: 4px;
}
.VehicleManagement .content .searchInput {
border: 1px solid #dcdfe6;
border-radius: 4px;
}
.VehicleManagement .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px;
line-height: 30px;
}
.VehicleManagement .content .searchInput .el-input__inner {
border: none;
outline: none;
height: 30px;
line-height: 30px;
}
.VehicleManagement .content .searchInput {
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width: 250px;
margin-right: 20px;
}
.VehicleManagement .content .searchInput {
line-height: normal;
display: inline-table;
width: 100%;
border-collapse: separate;
border-spacing: 0;
width: 250px;
margin-right: 20px;
}
.VehicleManagement .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
.VehicleManagement .content {
background: #fff;
margin-top: 10px;
padding: 20px;
box-sizing: border-box;
}
</style>
......@@ -196,10 +196,8 @@
<div style="text-align: right; margin-top: 20px">
<el-button size="small" type="primary" @click="downloadBrandFile">导出</el-button>
</div>
</div>
</el-dialog>
<a id="downloadLink" href="" download="品牌信息.xls" style="display:none">下载 Excel 文件</a>
</div>
</template>
<script>
......@@ -300,7 +298,7 @@
}
);
},
//批量导出
//下载品牌文件
downloadBrandFile() {
this.msg.ExcelEnumIds = this.checkedCities;
let msg = JSON.parse(JSON.stringify(this.msg));
......@@ -337,16 +335,6 @@
fileUrl: fileUrl,
filepath: filepath,
};
// that.downLoadLoading = false;
// that.loadingText = "";
// that.dialogVisible = false;
// var newUrl = that.domainManager().DomainUrl + fileUrl;
// var linkObj = document.getElementById("downloadLink");
// linkObj.href = newUrl;
// linkObj.setAttribute("download", fileName);
// linkObj.click();
var apiurl = that.domainManager().DomainUrl + "/api/Trade/GetFile";
var postData = that.GetPostData("", params, "");
that.$http.post(apiurl, postData, {
......@@ -383,10 +371,8 @@
var tempData = [];
let data = res.data.data;
data.forEach((item) => {
this.cityOptions.push(item.Id);
tempData.push(item);
this.cityOptions.push(item.Id);
tempData.push(item);
});
this.cities = tempData;
});
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment