动态引入js文件
Posted suixinyb
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了动态引入js文件相关的知识，希望对你有一定的参考价值。
<template>
<section class="idx-main">
<div v-show="templateIndex==1"
class="search-box">
<div class="row-box ">
<div class="title">
门店信息维护
</div>
</div>
<div class="row-box">
<div class="col-box">
<span class="lab">大区：</span>
<el-select v-model="districtVal"
filterable
placeholder="请选择"
@change="getAreaList()"
:disabled="orgLevelCode == 1 || orgLevelCode == 2 || orgLevelCode == 4">
<el-option v-if="districtList.length>0"
label="全部大区"
value="">
</el-option>
<el-option v-for="(item,index) in districtList"
:key="index"
:label=‘item.districtName+"-"+item.districtCode‘
:value="item.districtCode">
</el-option>
</el-select>
</div>
<div class="col-box">
<span class="lab">分公司：</span>
<el-select v-model="companyVal"
filterable
placeholder="请选择"
@change="queryDistrictCompanyList()"
:disabled="orgLevelCode == 1 || orgLevelCode == 4">
<el-option v-if="companyList.length>0"
label="全部分公司"
value="">
</el-option>
<el-option v-for="(item,index) in companyList"
:key="index"
:label=‘item.companyName+"-"+item.companyCode‘
:value="item.companyCode">
</el-option>
</el-select>
</div>
</div>
<div class="row-box">
<div class="col-box">
<span class="lab">门店：</span>
<el-select v-model="storeVal"
remote
filterable
clearable
placeholder="输入门店编码或门店名称"
:disabled="orgLevelCode == 4"
:remote-method="remoteMethod">
<el-option v-if="storeList.length>0"
label="全部门店"
value="">
</el-option>
<el-option v-for="(item,index) in newSiteList"
:key="index"
:label=‘item.siteName+"-"+item.siteCode‘
:value="item.siteCode">
</el-option>
</el-select>
</div>
<div class="col-box">
<span class="lab">门店类型：</span>
<el-select v-model="storeTypeVal"
placeholder="请选择">
<el-option v-if="storeTypeList.length>0"
label="全部类型"
value="">
</el-option>
<el-option v-for="(item,index) in storeTypeList"
:key="index"
:label="item.memo"
:value="item.cfgKey">
</el-option>
</el-select>
</div>
<div class="col-box">
<span class="lab">维护状态：</span>
<el-select v-model="maintenanceTypeVal"
placeholder="请选择">
<el-option v-for="(item,index) in maintenanceTypeList"
:key="index"
:label="item.name"
:value="item.code">
</el-option>
</el-select>
</div>
</div>
<div class="row-box">
<div class="col-box">
<el-button type="primary"
@click="searchList()">查询</el-button>
</div>
</div>
<el-table :data="tableData"
stripe
style="width: 100%">
<el-table-column prop="storeCode"
label="门店编码"></el-table-column>
<el-table-column prop="storeName"
label="门店名称"></el-table-column>
<el-table-column prop="siteTypeDesc"
label="门店类型"></el-table-column>
<el-table-column prop="largeAreaName"
label="所属大区"></el-table-column>
<el-table-column prop="companyName"
label="所属分公司"></el-table-column>
<el-table-column prop="modifyFlag"
label="维护状态">
<template scope="scope">{{scope.row.modifyFlag==0?"未维护":"已维护"}}
</template>
</el-table-column>
<el-table-column label="操作"
width="220"
align="center">
<template slot-scope="scope">
<span @click="lookStore(scope.row)"
class="green">查看门店</span>
<span @click="closeStore(scope.row)"
class="green">关闭门店</span>
<span @click="lookLog(scope.row)"
class="green">查看日志</span>
</template>
</el-table-column>
</el-table>
<el-pagination background
layout="prev, pager, next"
:page-size="pageSize"
:current-page="pageIndex"
:total="total"
@current-change="jumpPage"
v-show="total != 0"></el-pagination>
</div>
<!-- 详情页 -->
<div v-show="templateIndex==3"
class="search-box">
<div class="row-box ">
<div class="title">
<!-- {{新街口门店}}新街口门店 -->
<span v-show="orgLevelCode!=4"
class="big-title"
@click="templateIndex=1">门店信息维护/</span><span class="little-title">{{dataAll.storeName}}</span>
</div>
</div>
<div class="panel">
<div class="header-name">基本信息</div>
<div class="mult-line">
<div class="contain">
<div class="evn"><span>门店名称：</span><span>{{dataAll.storeName}}</span></div>
<div class="evn"><span>门店业态：</span><span>{{dataAll.industrySituationDesc}}</span></div>
<div class="evn"><span>业态细分：</span><span>{{dataAll.subSitetypeDesc}}</span></div>
<div class="evn"><span>门店类型：</span>
<span>
<el-select v-model="dataAll.siteTypeCode"
:change="changeSiteType"
:disabled="orgLevelCode==4||orgLevelCode==1||orgLevelCode==2"
placeholder="请选择">
<el-option v-for="(item,index) in storeTypeList"
:key="index"
:label="item.memo"
:value="item.cfgKey">
</el-option>
</el-select>
</span>
</div>
<div class="evn"><span>门店等级：</span><span>{{dataAll.storeLevel}}</span></div>
<div class="evn gab gabline"><span>门店介绍：</span><span>
<el-input type="textarea"
:cols="30"
maxlength="100"
:rows="3"
placeholder="请输入门店介绍"
v-model="dataAll.storeCondues"></el-input>
</span></div>
</div>
</div>
</div>
<div class="panel">
<div class="header-name">组织信息</div>
<div class="mult-line">
<div class="contain">
<div class="evn"><span>门店编码：</span><span>{{dataAll.storeCode}}</span></div>
<div class="evn"><span>大区编码：</span><span>{{dataAll.largeAreaCode}}</span></div>
<div class="evn"><span>分公司编码：</span><span>{{dataAll.companyCode}}</span></div>
</div>
<div class="contain">
<div class="evn"><span>门店名称：</span><span>{{dataAll.storeName}}</span></div>
<div class="evn"><span>大区名称：</span><span>{{dataAll.largeAreaName}}</span></div>
<div class="evn"><span>分公司名称：</span><span>{{dataAll.companyName}}</span></div>
</div>
</div>
</div>
<div class="panel">
<div class="header-name">基本信息</div>
<div class="mult-line">
<div class="contain">
<div class="evn">
<div class="img-up">
<div class="left">门店logo：</div>
<div class="right">
<!-- 上传门店logo -->
<div class="operate-state">
<div class="operate-state-right">
<div class="avatar-uploader">
<img v-if="dataAll.storeLogo"
:src="dataAll.storeLogo"
class="avatar">
<img v-if="!dataAll.storeLogo"
src="../../assets/logo.png"
class="avatar">
</div>
<!-- <el-upload
class="avatar-uploader"
action="/nsfbus-admin/ossImg/upLoadImg.htm"
:show-file-list="false"
:on-success="doneLogoUpload" :before-upload="beforeLogoUpload">
<p>请选择图片上传</p>
<img v-if="dataAll.storeLogo" :src="dataAll.storeLogo" class="avatar">
<i v-else class=" avatar-uploader-icon el-icon-upload"></i>
</el-upload> -->
</div>
</div>
<!-- 上传门店logo -->
</div>
</div>
</div>
<div class="evn gab">
<!-- 上传图片 -->
<div class="img-up">
<div class="left">门店图片：</div>
<div class="right">
<div class="upload-line">
<div class="operate"
v-for="(item,index) in imgList"
:key="index">
<div class="">
<file-upload :uploadIndex="index"
:imgLink="item.url"
@triggerEvent="doneListUpload">
</file-upload>
</div>
<div class="del"
v-if="index>0"><img src="../../assets/delete.png"
@click="deleteCarouse(index)"
width="100%"></div>
</div>
<div class="operate"
v-if="true">
<div class="add-img"
v-if="imgList.length<5">
<div class="img el-icon-plus"
@click="addCarouselFunction()"></div>
</div>
</div>
</div>
</div>
</div>
<!-- 上传图片 -->
</div>
<div class="evn ">
<div class="basic">
<div class="left"><span class="red-star">*</span>周中营业时间：</div>
<div class="right-time">
<el-time-select placeholder="起始时间"
v-model="startMidtime"
:editable="false"
:picker-options="{
start: ‘00:00‘,
step: ‘00:30‘,
end: ‘23:30‘
}">
</el-time-select>-
<el-time-select placeholder="结束时间"
v-model="endMidtime"
:editable="false"
:picker-options="{
start: ‘00:00‘,
step: ‘00:30‘,
end: ‘23:30‘,
}">
<!-- :picker-options="{
start: ‘00:30‘,
step: ‘00:30‘,
end: ‘24:00‘,
minTime: startMidtime
}" -->
</el-time-select>
</div>
</div>
</div>
<div class="evn">
<div class="basic">
<div class="left"><span class="red-star">*</span>周末营业时间：</div>
<div class="right-time">
<el-time-select placeholder="起始时间"
v-model="startWeektime"
:editable="false"
:picker-options="{
start: ‘00:00‘,
step: ‘00:30‘,
end: ‘23:30‘
}">
</el-time-select>-
<el-time-select placeholder="结束时间"
v-model="endWeektime"
:editable="false"
:picker-options="{
start: ‘00:00‘,
step: ‘00:30‘,
end: ‘23:30‘,
}">
</el-time-select>
</div>
</div>
</div>
<div class="evn">
<div class="basic">
<div class="left">是否有停车场：</div>
<div class="right">
<el-radio v-model="dataAll.depotFlag"
label="1">是</el-radio>
<el-radio v-model="dataAll.depotFlag"
label="0">否</el-radio>
</div>
</div>
</div>
<div class="evn"
v-show="dataAll.depotFlag==1">
<div class="basic">
<div class="left">停车信息：</div>
<div class="right">
<el-input style="border: none;"
v-model="dataAll.parkInfo"
maxlength="100"
placeholder="请输入停车信息"></el-input>
</div>
</div>
</div>
<div class="evn">
<div class="basic">
<div class="left">是否支持自提：</div>
<div class="right">
<el-radio v-model="dataAll.selfLiftFlag"
label="1">是</el-radio>
<el-radio v-model="dataAll.selfLiftFlag"
label="0">否</el-radio>
</div>
</div>
</div>
<div class="evn"
v-show="dataAll.selfLiftFlag==1">
<div class="basic">
<div class="left">自提信息：</div>
<div class="right">
<el-input style="border: none;"
v-model="dataAll.selfExtractingInfo"
maxlength="100"
placeholder="请输入自提信息"></el-input>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel">
<div class="header-name">位置信息</div>
<div class="mult-line">
<div class="contain">
<div class="evn">
<div class="basic">
<div class="left"><span class="red-star">*</span>所在省市区县：</div>
<div class="right"
@click="clickBottom">
<input class="input_out"
:value="locationName"
placeholder="选择省市区县" /><span class="el-icon-arrow-down icon-arrow"></span>
</div>
</div>
<!-- 省市县区 -->
<div class="rang_bottom"
v-show="displayFlag">
<el-tabs v-model="activeName"
@tab-click="handleClick">
<el-tab-pane label="省份"
name="first">
<div class="reginon_list">
<div class="item"
v-for="(item,index) in provinceList"
:key="index"
:class="{‘activeItem‘:(index+1)==clickIndex1}"
@click="selectProvince(item.regionalName,item.regionalCode,index)">{{item.regionalName}}</div>
</div>
</el-tab-pane>
<el-tab-pane label="城市"
name="second">
<div class="reginon_list">
<div class="item"
v-for="(item,index) in cityList"
:key="index"
:class="{‘activeItem‘:(index+1)==clickIndex2}"
@click="selectCity(item.regionalName,item.regionalCode,index)">{{item.regionalName}}</div>
</div>
</el-tab-pane>
<el-tab-pane label="县区"
name="third">
<div class="reginon_list">
<div class="item"
v-for="(item,index) in infodistrictList"
:key="index"
:class="{‘activeItem‘:(index+1)==clickIndex3}"
@click="selectDistrict(item.regionalName,item.regionalCode,index)">{{item.regionalName}}</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
<!-- 省市县区 -->
</div>
<div class="evn">
<div class="basic">
<div class="left"><span class="red-star">*</span>详细地址：</div>
<div class="right">
<!-- <input id="pickerInput" :value="name" placeholder="输入关键字选取地点" /> -->
<input id="pickerInput"
v-model="dataAll.address"
maxlength="80"
placeholder="输入关键字选取地点" />
</div>
</div>
<!-- <span class="lab"></span><span></span> -->
</div>
<div class="evn">
<div class="map_main">
<div class="left"><span class="red-star">*</span> 地图定位：</div>
<div class="right">
<div class="GD_map">
<div v-show="AMapFlag"
id="container"
tabindex="0"></div>
<!-- <div id="pickerBox">
</div> -->
<div v-show="!AMapFlag"> <img src="../../assets/QRcode.png"></div>
</div>
<div class="long-lat">
<div class="left1">
<div><span>经度：</span><span>
<el-input style="border: none;"
v-model="dataAll.shopLongitude"
maxlength="20"
placeholder="请输入经度"></el-input>
</span></div>
<div><span>纬度：</span><span>
<el-input style="border: none;"
v-model="dataAll.shopLatitude"
maxlength="20"
placeholder="请输入纬度"></el-input>
</span></div>
</div>
<div class="ii el-icon-location"
@click="addMarker()"></div>
</div>
</div>
</div>
</div>
<div class="evn">
<div class="basic">
<div class="left">所在商圈：</div>
<div class="right">
<el-input style="border: none;"
v-model="dataAll.marketArea"
maxlength="20"
placeholder="输入所在商圈"></el-input>
</div>
</div>
<!-- <span class="lab"></span><span><el-input style="border: none;" v-model="seatUrl1" maxlength="200" placeholder="请输入自提信息"></el-input></span> -->
</div>
<div class="evn">
<div class="basic">
<div class="left">周边建筑：</div>
<div class="right">
<el-input style="border: none;"
v-model="dataAll.surroundBuildings"
maxlength="50"
placeholder="请输入周边建筑"></el-input>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="panel">
<div class="header-name">联络信息</div>
<div class="mult-line">
<div class="contain">
<div class="evn">
<div class="basic">
<div class="left"><span class="red-star">*</span>店长姓名：</div>
<div class="right_name">
<el-input style="border: none;"
v-model="dataAll.shopownerName"
maxlength="10"
placeholder="请输入店长姓名"></el-input>
</div>
</div>
</div>
<div class="evn">
<div class="basic">
<div class="left"><span class="red-star">*</span>店长工号：</div>
<div class="right_name">
<el-input style="border: none;"
v-model="dataAll.shopowner"
maxlength="8"
placeholder="请输入店长工号"></el-input>
</div>
</div>
<!-- <span class="lab"></span><span> </span> -->
</div>
<!-- 电话号码 -->
<div class="evn">
<div class="phone">
<div class="left"><span><span class="red-star">*</span>门店电话：</span></div>
<div class="right">
<div class="telephone"
v-for="(item,index) in telephoneArr">
<span>
<el-input v-model="item.beforeCode"
maxlength="4"
placeholder="输入区号"></el-input>-<el-input style="border: none;"
v-model="item.afterCode"
maxlength="8"
placeholder="输入电话号码"></el-input>
</span>
<span class="green"
@click="addtel"
v-if="index==0&&telephoneArr.length<3">增加固话</span>
<span class="green"
@click="deltel(index)"
v-if="index>0">删除</span>
</div>
<div class="mobilephone"
v-for="(item,index) in mobilephoneArr">
<span>
<el-input v-model="item.code"
maxlength="11"
placeholder="输入手机号"></el-input>
</span>
<span class="green"
@click="addmoblie"
v-if="index==0&&mobilephoneArr.length<3">增加手机号码</span>
<span class=""
v-if="index==0">(至少填写一个手机号)</span>
<span class="green"
@click="delmoblie(index)"
v-if="index>0">删除</span>
</div>
</div>
</div>
</div>
<!-- 电话号码 -->
<div class="evn gab">
<div class="basic">
<div class="left">地铁/公交信息：</div>
<div class="right">
<el-input type="textarea"
:cols="30"
:rows="3"
placeholder="地铁/公交信息"
maxlength="300"
v-model="dataAll.transmissionLine"></el-input>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 按钮事件 -->
<div class="btn-center">
<div class="btn-left">
<el-button type="primary"
@click="updateStoreOperateInfo()">保存</el-button>
</div>
<div class="btn-right"
v-show="orgLevelCode!=4">
<el-button @click="goBack()">返回</el-button>
</div>
</div>
</div>
<!-- 操作日志页面 -->
<div v-show="templateIndex==2"
class="search-box">
<div class="row-box ">
<div class="title">
<span class="big-title"
@click="templateIndex=1">门店信息维护</span><span class="little-title">/操作日志</span>
</div>
</div>
<el-table :data="tableData2"
stripe
style="width: 100%">
<el-table-column prop="lastModified"
label="操作时间"></el-table-column>
<el-table-column prop="lastmodifier"
label="操作人"></el-table-column>
<el-table-column prop="operationLog"
label="操作内容"></el-table-column>
</el-table>
<el-pagination background
layout="prev, pager, next"
:page-size="pageSize2"
:current-page="pageIndex2"
:total2="total2"
@current-change="jumpPage2"
v-show="total2 != 0"></el-pagination>
</div>
</section>
</template>
<script>
import DI from "../../js/interface";
import DC from "../../js/common";
import FileUpload from "../../components/common/uploadImg.vue";
export default {
data() {
return {
myMaker: "",
paths: [],
newSiteList: [],
maintenanceTypeList: [
{ name: "全部", code: "" },
{ name: "未维护", code: "0" },
{ name: "已维护", code: "1" }
],
maintenanceTypeVal: "",
districtList: [],
districtVal: "",
companyList: [],
companyVal: "",
storeList: [],
authInfo: "",
storeVal: "",
storeTypeList: [],
storeTypeVal: "",
orgLevelCode: "",
tableData: [],
pageIndex: 1,
pageSize: 10,
total: 0,
templateIndex: 1,
// 详情页
AMapFlag: false,
startMidtime: "",
endMidtime: "",
startWeektime: "",
endWeektime: "",
displayFlag: false,
locationName: "",
name1: "",
name2: "",
name3: "",
activeName: "first",
clickIndex1: null,
clickIndex2: null,
clickIndex3: null,
provinceList: [],
cityList: [],
cityVal: "",
infodistrictList: "",
dataAll: {},
imagelink: "",
imgList: [{ url: "" }],
telephoneArr: [{ beforeCode: "", afterCode: "" }],
mobilephoneArr: [{ code: "" }],
map: "",
// longitude:0,
// latitude:0,
name: "",
ruleForm: {
name: "",
region: "",
content: "新增页面"
},
storeTypeList: [],
storeTypeVal: "",
upLoadImg: DI.upLoadImg,
mark_bs: require("../../assets/mark_bs.png"),
// 操作日志
tableData2: [],
pageIndex2: 1,
pageSize2: 10,
total2: 0,
localstoreCode: ""
};
},
components: {
FileUpload
},
methods: {
remoteMethod(query) {
if (query !== "") {
// 输入非空时
setTimeout(() => {
this.newSiteList = this.storeList.filter(item => {
return (
item.siteCode.includes(query) || item.siteName.includes(query)
);
});
}, 200);
} else {
// 输入为空时
this.storeVal = "";
this.newSiteList = []; // 数据为空
}
},
// 查询所有门店列表
querySiteInfoList() {
let params = {
authKey: this.authKey
// 葛晓星
// authKey:"cUJ0T2NWQUFuRmR3VlZsdGNydUoyVGJyOThpSUF0Ym5ZL28vRnd3V1daUmcwMzlBd1RhUkd6MWpzWjU5K1lad0FCQ1FpT1RFdXc0N2ZnMUVtWTcyTGhzWFBtWHoyODNOQ0orVVBPaUs4ZVhtMHpQN2tMeGIwYzFNUVJ4b2t1Y0xTNFE2TkZqR2Y0dUUrRGFWRmViTkhocndlZWlrdmxBS1RDOGZrT0JIcGZRQzJsSDFiTkx2Z0V6aHcwMzhKUTBpaitIZ3BWOUdWcXFzK2paSW8xRW1iLzh2Z3dPZnZ4ZFo3VnBTejhudkozZXlEbFBhdDRNbm1RPT0%3D"
// 门店
// authKey:"bkVwbTFMNnp2clZ1SVQ2WkV3RzRKVDlwZkJSd1Erbkk1a1oxK0psWEZ5eGcwMzlBd1RhUkcvL3I0Z2lYaXVtQTQ0VXRoMVlxSDVBN2ZnMUVtWTcyTHRaQU4wdVVYVFBmQ0orVVBPaUs4ZVZBRFovd2VPdHdmTzdUdlNqNzl5ZVdQeGJPSldGQ05rQmZYMU1IT294WktPeDFoR0krNk92YlM0UTZORmpHZjR0OFBDQSs0TytDTnhyd2VlaWt2bEFLNzhwQldZRGJlUkc5eUZwNXJrVE5MV2ZKejE0TFBkR2JBOWxDSzdKNGlWeU9kWGN3MWtZcmhRRVU2R3hPL2NTc254dzY1aUJpek0yYlh1QzNyeExFYTdhRzd3TXIzeDBVUE9sSVJtZUxOb0ZGUWZiZ25WcUg1NEYvNy9RSkRGTEpIOVhFaE0xcG5FNlpjU2FzbGpVelZBbEhuNU1FRm1BWTE3NmF2OWpGZnRNPQ%3D%3D"
// 分公司
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3eGIvdWtLUFRpLy9WMUJXZm5sZEVnTmcwMzlBd1RhUkd3UmFSRVl4cnVUMGJBbERFeWQvamdNN2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVZFU3l5WjgvYVZMdmJNVWl6a3p3aWNoWm9NNnJzZW1TOFVaUm8zdWJGVDk3TEVOU0ZQVmpJTlNYSUpGTmE0K0loTlhRc1gzYUlSc2NKV0oyc1VrdEkzd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw%3D%3D"
// 南京分公司
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3MnhLaS81SDF6K2xxRmhLckRSRHFSaGcwMzlBd1RhUkd3UmFSRVl4cnVUMGJBbERFeWQvamdNN2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVZFU3l5WjgvYVZMdmJNVWl6a3p3aWNoWm9NNnJzZW1TOFVaUm8zdWJGVDk3TEVOU0ZQVmpJTlNYSUpGTmE0K0loTlhRc1gzYUlSc2NKV0oyc1VrdEkzd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw"
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3MnhLaS81SDF6K2xSNWdIVGVaMUF5OWcwMzlBd1RhUkd3UmFSRVl4cnVUMDJiVjl4dmo0MjV3N2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVYraWdWcE15eVJVeUt4aFBuR0Z5RmloWm9NNnJzZW1TODd3alprdkdDSVExSmRmYzNHOWVkd1NYSUpGTmE0K0loSUEwaFNVYkNYaXJvSWVpSXRjTWRqd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw"
};
this.$http.get(DI.querySiteInfoList, { params: params }).then(
res => {
var data = res.data;
this.storeList = data;
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
// 查询门店信息修改记录
queryStoreOperationLogListByPage() {
let params = {
storeCode: this.localstoreCode
};
this.$http
.get(
DI.queryStoreOperationLogListByPage +
"?page=" +
this.pageIndex2 +
"&rows=" +
this.pageSize2,
{ params: params }
)
.then(
res => {
var data = res.data;
this.tableData2 = data.rows;
this.total2 = data.total;
// if (data.flag == 1) {
// this.tableData2=data.data
// } else {
// if (data.errorMsg) {
// this.$message({
// type: ‘warning‘,
// message: data.errorMsg
// })
// }
// }
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
jumpPage2(val) {
this.pageIndex2 = val;
this.queryStoreOperationLogListByPage();
},
// 操作日志
beforeLogoUpload(file) {
const isJPG =
file.type === "image/jpeg" ||
file.type === "image/png" ||
file.type === "image/gif" ||
file.type === "image/jpg";
const isLt2M = file.size / 1024 / 1024 < 3;
if (!isJPG) {
this.$message.error("上传图片只能是 JPG、JPEG、PNG或GIF格式!");
return false;
}
if (!isLt2M) {
this.$message.error("上传图片大小不能超过 3MB!");
return false;
}
},
goBack() {
this.$confirm("返回将失去正在编辑的信息, 是否继续?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
})
.then(() => {
this.templateIndex = 1;
})
.catch(() => {});
},
changeSiteType() {
this.storeTypeList.map(item => {
if (item.cfgKey == this.dataAll.siteTypeCode) {
this.dataAll.siteTypeDesc = item.memo;
}
});
},
selectProvince(name, code, index) {
this.dataAll.provinceCode = code;
this.dataAll.provinceName = name;
this.dataAll.cityCode = "";
this.dataAll.cityName = "";
this.name1 = name;
this.locationName = name;
this.clickIndex1 = index + 1;
this.clickIndex2 = null;
this.queryRegionListByParentCode(code, "2", "2");
this.activeName = "second";
},
selectCity(name, code, index) {
this.dataAll.cityCode = code;
this.dataAll.cityName = name;
this.dataAll.cityAreaCode = "";
this.dataAll.cityAreaName = "";
this.name2 = name;
this.locationName = this.name1 + "/" + name;
this.clickIndex2 = index + 1;
this.clickIndex3 = null;
this.queryRegionListByParentCode(code, "3", "3");
this.activeName = "third";
},
selectDistrict(name, code, index) {
this.dataAll.cityAreaCode = code;
this.dataAll.cityAreaName = name;
this.name3 = name;
this.locationName = this.name1 + "/" + this.name2 + "/" + name;
this.clickIndex3 = index + 1;
this.displayFlag = false;
this.dataAll.address = "";
this.drawBounds();
},
handleClick() {},
clickBottom() {
this.displayFlag = !this.displayFlag;
},
deleteCarouse(index) {
this.imgList.splice(index, 1);
},
addCarouselFunction() {
this.imgList.push({ url: "" });
},
//图片上传成功回调
doneLogoUpload(params) {
// this.$message({message: ‘图片上传成功‘, type: ‘success‘})
this.dataAll.storeLogo = params.imgUrl;
},
doneListUpload(params, index) {
this.$message({ message: "图片上传成功", type: "success" });
this.imgList[index].url = params.imgUrl;
},
addtel() {
this.telephoneArr.push({ beforeCode: "", afterCode: "" });
},
addmoblie() {
this.mobilephoneArr.push({ code: "" });
},
deltel(index) {
this.telephoneArr.splice(index, 1);
},
delmoblie(index) {
this.mobilephoneArr.splice(index, 1);
},
addMarker() {
if (!this.AMapFlag) {
return;
}
//this.map.clearMap()
this.map.remove(this.myMaker);
var arr = [];
arr.push(
parseFloat(this.dataAll.shopLongitude),
parseFloat(this.dataAll.shopLatitude)
);
let _self = this;
// var marker = new AMap.Marker({
// // icon: "https://webapi.amap.com/theme/v1.3/markers/n/mark_bs.png",
// icon: _self.mark_bs,
// position:arr,
// // offset: new AMap.Pixel(-10,-34)
// });
// marker.setMap(this.map);
// this.map.setCenter(arr);
// 加入拖动
AMap.plugin(["AMap.ToolBar", "AMap.Scale"], function() {
var toolBar = new AMap.ToolBar();
var scale = new AMap.Scale();
_self.map.addControl(toolBar);
_self.map.addControl(scale);
});
this.myMaker = new AMap.Marker({
position: arr,
draggable: true,
cursor: "move",
raiseOnDrag: false,
zIndex: 101
});
this.myMaker.setMap(_self.map);
_self.dataAll.shopLongitude = _self.myMaker.getPosition().lng;
_self.dataAll.shopLatitude = _self.myMaker.getPosition().lat;
AMap.event.addListener(this.myMaker, "dragstart", function(e) {
_self.dataAll.shopLongitude = _self.myMaker.getPosition().lng;
_self.dataAll.shopLatitude = _self.myMaker.getPosition().lat;
});
AMap.event.addListener(this.myMaker, "dragging", function(e) {
_self.dataAll.shopLongitude = _self.myMaker.getPosition().lng;
_self.dataAll.shopLatitude = _self.myMaker.getPosition().lat;
});
// let _marker=marker
AMap.event.addListener(this.myMaker, "dragend", function(e) {
_self.dataAll.shopLongitude = _self.myMaker.getPosition().lng;
_self.dataAll.shopLatitude = _self.myMaker.getPosition().lat;
let lnglatXY = [
_self.myMaker.getPosition().lng,
_self.myMaker.getPosition().lat
];
var geocoder = new AMap.Geocoder({
radius: 1000,
extensions: "all"
});
geocoder.getAddress(lnglatXY, function(status, result) {
if (status === "complete" && result.info === "OK") {
var address = result.regeocode.formattedAddress; //返回地址描述
_self.dataAll.address = address;
// $(‘input[name=address]‘).val(address);
}
});
});
// 加入拖动
},
poiPickerReady(poiPicker) {
window.poiPicker = poiPicker;
this.myMaker = new AMap.Marker();
var infoWindow = new AMap.InfoWindow({
// offset: new AMap.Pixel(0, -20)
});
//选取了某个POI
let _self = this;
poiPicker.on("poiPicked", function(poiResult) {
_self.map.remove(_self.myMaker);
var source = poiResult.source,
poi = poiResult.item,
info = {
source: source,
id: poi.id,
name: poi.name,
location: poi.location,
address: poi.address
};
_self.myMaker.setMap(_self.map);
// infoWindow.setMap(_self.map);
_self.myMaker.setPosition(poi.location);
// infoWindow.setPosition(poi.location);
_self.dataAll.address = info.name;
if (!poi.location.lng) {
_self.$message({
message: "获取位置失败，请重新选择！",
type: "warning"
});
return;
}
if (!poi.location.lat) {
_self.$message({
message: "获取位置失败，请重新选择！",
type: "warning"
});
return;
}
_self.dataAll.shopLongitude = poi.location.lng;
_self.dataAll.shopLatitude = poi.location.lat;
// infoWindow.setContent(‘POI信息: <pre>‘ + JSON.stringify(info, null, 2) + ‘</pre>‘);
// infoWindow.open(_self.map, marker.getPosition());
_self.map.setCenter(_self.myMaker.getPosition());
_self.addMarker();
});
},
// 查询省市区
queryRegionListByParentCode(row, col, index) {
let params = {
parentRegionalCode: row,
regionalLevel: col
};
this.$http.get(DI.queryRegionListByParentCode, { params: params }).then(
res => {
var data = res.data;
if (index == 1) {
this.provinceList = data.rows;
} else if (index == 2) {
this.cityList = data.rows;
} else if (index == 3) {
this.infodistrictList = data.rows;
}
if (data.flag == 1) {
} else {
if (data.errorMsg) {
this.$message({
type: "warning",
message: data.errorMsg
});
}
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
// 查询详情
queryStoreOperateInfo() {
let params = {
storeCode: this.localstoreCode
};
let _this = this;
this.$http.get(DI.queryStoreOperateInfo, { params: params }).then(
res => {
var data = res.data;
this.dataAll = data;
// 获取省市区县
// 给是否有停车场、是否支持自提默认为不选
this.dataAll.selfLiftFlag = this.dataAll.selfLiftFlag
? this.dataAll.selfLiftFlag
: "0";
this.dataAll.depotFlag = this.dataAll.depotFlag
? this.dataAll.depotFlag
: "0";
// 如果省市区存在，查询经纬度范围
this.name1 = this.dataAll.provinceName
? this.dataAll.provinceName
: "";
this.name2 = this.dataAll.cityName ? this.dataAll.cityName : "";
this.name3 = this.dataAll.cityAreaName
? this.dataAll.cityAreaName
: "";
let pName = this.dataAll.provinceName
? this.dataAll.provinceName + "/"
: "";
let cName = this.dataAll.cityName ? this.dataAll.cityName + "/" : "";
let aName = this.dataAll.cityAreaName
? this.dataAll.cityAreaName
: "";
this.locationName = pName + cName + aName;
// 或许省市区的焦点
// this.provinceList.find(function(currentValue, index, arr),thisValue)
this.queryRegionListByParentCode(this.dataAll.provinceCode, "2", "2");
this.queryRegionListByParentCode(this.dataAll.cityCode, "3", "3");
setTimeout(() => {
_this.provinceList.map((item, index) => {
if (
_this.provinceList[index].regionalCode ==
_this.dataAll.provinceCode
) {
_this.clickIndex1 = index + 1;
}
});
_this.cityList.map((item, index) => {
if (
_this.cityList[index].regionalCode == _this.dataAll.cityCode
) {
_this.clickIndex2 = index + 1;
}
});
_this.infodistrictList.map((item, index) => {
if (
_this.infodistrictList[index].regionalCode ==
_this.dataAll.cityAreaCode
) {
_this.clickIndex3 = index + 1;
}
});
}, 200);
if (this.dataAll.cityAreaName) {
if (this.AMapFlag) {
// 只获取省区县地址，不进行定位
this.initDrawBounds();
}
}
// 拼接时间
if (this.dataAll.midweekServiceHours) {
let timeIndex = this.dataAll.midweekServiceHours.indexOf("-");
this.startMidtime = this.dataAll.midweekServiceHours.slice(
0,
timeIndex
);
this.endMidtime = this.dataAll.midweekServiceHours.substring(
timeIndex + 1
);
}
if (this.dataAll.weekendServiceHours) {
let timeIndex2 = this.dataAll.weekendServiceHours.indexOf("-");
this.startWeektime = this.dataAll.weekendServiceHours.slice(
0,
timeIndex2
);
this.endWeektime = this.dataAll.weekendServiceHours.substring(
timeIndex2 + 1
);
}
// 图片列表添加
this.imgList = [];
if (this.dataAll.urlList) {
this.dataAll.urlList.map(item => {
let obj = { url: "" };
obj.url = item;
this.imgList.push(obj);
});
if (this.dataAll.urlList.length < 1) {
this.imgList = [{ url: "" }];
}
} else {
this.imgList = [{ url: "" }];
}
// 电话号码处理
let Tarr = [];
if (this.dataAll.storeTel) {
Tarr = this.dataAll.storeTel.split(",");
if (Tarr.length > 0) {
this.telephoneArr = [];
Tarr.map(item => {
let index = item.indexOf("-");
let after = item.substring(index + 1);
let before = item.slice(0, index);
let obj = { beforeCode: "", afterCode: "" };
obj.beforeCode = before;
obj.afterCode = after;
this.telephoneArr.push(obj);
});
}
}
// 手机号码处理
let Marr = [];
if (this.dataAll.storePhone) {
Marr = this.dataAll.storePhone.split(",");
if (Marr.length > 0) {
this.mobilephoneArr = [];
}
Marr.map(item => {
let obj = { code: "" };
obj.code = item;
this.mobilephoneArr.push(obj);
});
}
// 地图定位
if (this.dataAll.shopLongitude && this.dataAll.shopLatitude) {
setTimeout(() => {
this.addMarker();
}, 200);
}
// 数据展示
if (data.flag == 1) {
} else {
if (data.errorMsg) {
this.$message({
type: "warning",
message: data.errorMsg
});
}
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
// 查询门店类型列表
queryStoreTypeList() {
this.$http.get(DI.queryStoreTypeList).then(
res => {
var data = res.data;
this.storeTypeList = data.rows;
// if (data.flag == 1) {
// } else {
// if (data.errorMsg) {
// this.$message({
// type: ‘warning‘,
// message: data.errorMsg
// })
// }
// }
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
// 更新数据
updateStoreOperateInfo() {
// 判断
if (!this.startMidtime) {
this.$message({
type: "warning",
message: "请选择周中营业开始时间"
});
return false;
}
if (!this.endMidtime) {
this.$message({
type: "warning",
message: "请选择周中营业结束时间"
});
return false;
}
if (!this.startWeektime) {
this.$message({
type: "warning",
message: "请选择周末营业开始时间"
});
return false;
}
if (!this.endWeektime) {
this.$message({
type: "warning",
message: "请选择周末营业结束时间"
});
return false;
}
// 省市区
if (!this.dataAll.provinceCode) {
this.$message({
type: "warning",
message: "请选择省份"
});
return false;
}
if (!this.dataAll.cityCode) {
this.$message({
type: "warning",
message: "请选择市"
});
return false;
}
if (!this.dataAll.cityAreaCode) {
this.$message({
type: "warning",
message: "请选择市区"
});
return false;
}
if (!this.dataAll.address) {
this.$message({
type: "warning",
message: "请填写详细地址"
});
return false;
} else {
let addressResult;
let addressStr = this.dataAll.address;
addressResult = addressStr.replace(/(^s+)|(s+$)/g, "");
if (addressResult.length < 4) {
this.$message({
type: "warning",
message: "详细地址不能少于四个字"
});
return false;
}
this.dataAll.address = addressResult;
}
if (!this.dataAll.shopownerName) {
this.$message({
type: "warning",
message: "请填写店长姓名"
});
return false;
}
if (!this.dataAll.shopowner) {
this.$message({
type: "warning",
message: "请填写店长工号"
});
return false;
}
let regShopowner = /^[d]+$/;
if (!regShopowner.test(this.dataAll.shopowner)) {
this.$message({
type: "warning",
message: "工号格式不对，请重新输入"
});
return false;
}
if (!this.dataAll.shopLongitude) {
this.$message({
type: "warning",
message: "经度不能为空"
});
return false;
}
// let regLocation=/^d*.{0,1}d{0,6}$/
let regLocation = /^[+-]?d*.?d{0,15}$/;
// 只允许输入负数和小数整数
if (this.dataAll.shopLongitude) {
if (!regLocation.test(this.dataAll.shopLongitude)) {
this.$message({
type: "warning",
message: "经度格式错误"
});
return false;
}
let shopLongitudeNUm = parseFloat(this.dataAll.shopLongitude);
if (shopLongitudeNUm < -180 || shopLongitudeNUm > 180) {
this.$message({
type: "warning",
message: "经度范围-180~180"
});
return false;
}
}
if (!this.dataAll.shopLatitude) {
this.$message({
type: "warning",
message: "纬度不能为空"
});
return false;
}
if (this.dataAll.shopLatitude) {
if (!regLocation.test(this.dataAll.shopLatitude)) {
this.$message({
type: "warning",
message: "纬度格式错误"
});
return false;
}
let shopLatitudeNUm = parseFloat(this.dataAll.shopLatitude);
if (shopLatitudeNUm < -90 || shopLatitudeNUm > 90) {
this.$message({
type: "warning",
message: "经度范围-90~90"
});
return false;
}
}
// 手机号码
let reg = /^[d]+$/;
// let regphone=/^1[3456789]\d{9}$/
let telephoneError = false;
this.telephoneArr.map(item => {
if (item.beforeCode) {
if (!item.afterCode) {
this.$message.warning("电话号码不能为空");
telephoneError = true;
}
}
if (item.afterCode) {
if (!item.beforeCode) {
this.$message.warning("电话区号不能为空");
telephoneError = true;
}
}
if (item.beforeCode && item.afterCode) {
if (!reg.test(item.beforeCode) || !reg.test(item.afterCode)) {
this.$message.warning("电话号格式错误");
telephoneError = true;
}
}
});
if (telephoneError) {
return false;
}
// 电话号码验证
let regphone = /^1[3456789]d{9}$/;
let mobilephoneFlag = false;
let errorMobile = false;
this.mobilephoneArr.map(item => {
if (item.code) {
if (item.code.length < 11 || !regphone.test(item.code)) {
this.$message.warning("手机号格式错误");
errorMobile = true;
}
mobilephoneFlag = true;
}
});
if (errorMobile) {
return false;
}
if (!mobilephoneFlag) {
this.$message.warning("至少填写一个手机号码");
return false;
}
// 拼接时间
this.dataAll.midweekServiceHours =
this.startMidtime + "-" + this.endMidtime;
this.dataAll.weekendServiceHours =
this.startWeektime + "-" + this.endWeektime;
// 图片列表添加
let imgArr = [];
this.imgList.map(item => {
if (item.url) {
imgArr.push(item.url);
}
});
this.dataAll.urlList = imgArr;
// 电话号码
let Tarr = [];
this.telephoneArr.map(item => {
if (item.beforeCode && item.afterCode) {
let string = item.beforeCode + "-" + item.afterCode;
Tarr.push(string);
}
});
this.dataAll.storeTel = Tarr.join(",");
let Marr = [];
this.mobilephoneArr.map(item => {
if (item.code) {
let string = item.code;
Marr.push(string);
}
});
this.dataAll.storePhone = Marr.join(",");
let params = {
storeCode: this.localstoreCode,
storeName: this.dataAll.storeName,
// storeName:"测试" ,
industrySituationCode: this.dataAll.industrySituationCode,
industrySituationDesc: this.dataAll.industrySituationDesc,
subSiteTypeCode: this.dataAll.subSiteTypeCode,
subSitetypeDesc: this.dataAll.subSitetypeDesc,
siteTypeCode: this.dataAll.siteTypeCode,
siteTypeDesc: this.dataAll.siteTypeDesc,
storeLevel: this.dataAll.storeLevel,
largeAreaCode: this.dataAll.largeAreaCode,
largeAreaName: this.dataAll.largeAreaName,
companyCode: this.dataAll.companyCode,
companyName: this.dataAll.companyName,
storeStatus: this.dataAll.storeStatus,
shopowner: this.dataAll.shopowner,
shopownerName: this.dataAll.shopownerName,
transmissionLine: this.dataAll.transmissionLine,
provinceCode: this.dataAll.provinceCode,
provinceName: this.dataAll.provinceName,
cityCode: this.dataAll.cityCode,
cityName: this.dataAll.cityName,
cityAreaCode: this.dataAll.cityAreaCode,
cityAreaName: this.dataAll.cityAreaName,
address: this.dataAll.address,
shopLongitude: this.dataAll.shopLongitude,
shopLatitude: this.dataAll.shopLatitude,
marketArea: this.dataAll.marketArea,
surroundBuildings: this.dataAll.surroundBuildings,
// storeLogo:"http://sdossuppre1.cnsuning.com/nsfuaa/nsfbus/8cM3yx_dYEQi6L368TLfoDbH8Xt5vkbQs38LCsPXeaGTlmp4bP9I4In5uOUAWtFp.jpg",
storeLogo: this.dataAll.storeLogo,
urlList: this.dataAll.urlList,
// urlList:‘http://sdossuppre1.cnsuning.com/nsfuaa/nsfbus/8cM3yx_dYEQi6L368TLfoDbH8Xt5vkbQs38LCsPXeaGTlmp4bP9I4In5uOUAWtFp.jpg,http://sdossuppre1.cnsuning.com/nsfuaa/nsfbus/8cM3yx_dYEQi6L368TLfoDbH8Xt5vkbQs38LCsPXeaGTlmp4bP9I4In5uOUAWtFp.jpg‘,
midweekServiceHours: this.dataAll.midweekServiceHours,
weekendServiceHours: this.dataAll.weekendServiceHours,
depotFlag: this.dataAll.depotFlag,
parkInfo: this.dataAll.parkInfo,
selfLiftFlag: this.dataAll.selfLiftFlag,
selfExtractingInfo: this.dataAll.selfExtractingInfo,
// buyOutTimeFlag:this.dataAll.buyOutTimeFlag,
storeCondues: this.dataAll.storeCondues,
lastmodifier: this.dataAll.lastmodifier,
// lastmodifier:"测试数据",
storeTel: this.dataAll.storeTel,
storePhone: this.dataAll.storePhone,
storeLevelDesc: this.dataAll.storeLevelDesc
};
// 判断经纬度是否在省市区范围内
if (this.AMapFlag) {
let point = [this.dataAll.shopLongitude, this.dataAll.shopLatitude];
var isPointInRing = false;
if (this.paths.length > 1) {
isPointInRing = AMap.GeometryUtil.isPointInRing(point, this.paths);
}
if (!isPointInRing) {
// this.$message({
// type: ‘warning‘,
// message: ‘详细地址不在所选省市区范围内‘
// })
// return false
this.$confirm("详细地址不在所选省市区范围内, 是否继续?", "提示", {
confirmButtonText: "重新定位",
cancelButtonText: "忽略",
type: "warning"
})
.then(() => {
this.dataAll.shopLongitude = "";
this.dataAll.shopLatitude = "";
this.dataAll.address = "";
return false;
})
.catch(() => {
//忽略提示的时候提交
this.$http.post(DI.updateStoreOperateInfo, params).then(
// this.$http.get(DI.updateStoreOperateInfo,{params:params}).then(
res => {
var data = res.data;
// this.dataAll=data
if (data.status == 0) {
this.$message({
type: "sucess",
message: "保存成功"
});
if (this.orgLevelCode != 4) {
setTimeout(() => {
this.templateIndex = 1;
this.queryStoreInfoListByPage();
}, 200);
}
} else {
if (data.message) {
this.$message({
type: "warning",
message: data.message
});
} else {
this.$message({
type: "warning",
message: "保存失败"
});
}
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
});
} else {
// 校验通过直接提交
this.$http.post(DI.updateStoreOperateInfo, params).then(
// this.$http.get(DI.updateStoreOperateInfo,{params:params}).then(
res => {
var data = res.data;
// this.dataAll=data
if (data.status == 0) {
this.$message({
type: "sucess",
message: "保存成功"
});
if (this.orgLevelCode != 4) {
setTimeout(() => {
this.templateIndex = 1;
this.queryStoreInfoListByPage();
}, 200);
}
} else {
if (data.message) {
this.$message({
type: "warning",
message: data.message
});
} else {
this.$message({
type: "warning",
message: "保存失败"
});
}
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
}
} else {
//没有网络直接提交
this.$http.post(DI.updateStoreOperateInfo, params).then(
// this.$http.get(DI.updateStoreOperateInfo,{params:params}).then(
res => {
var data = res.data;
// this.dataAll=data
if (data.status == 0) {
this.$message({
type: "sucess",
message: "保存成功"
});
if (this.orgLevelCode != 4) {
setTimeout(() => {
this.templateIndex = 1;
this.queryStoreInfoListByPage();
}, 200);
}
} else {
if (data.message) {
this.$message({
type: "warning",
message: data.message
});
} else {
this.$message({
type: "warning",
message: "保存失败"
});
}
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
}
},
// 详情页
lookLog(row) {
// localStorage.setItem("localstoreCode",row.storeCode)
// location.href="operationLog.html"
this.templateIndex = 2;
this.localstoreCode = row.storeCode;
this.queryStoreOperationLogListByPage();
},
lookStore(row) {
(this.startMidtime = ""),
(this.endMidtime = ""),
(this.startWeektime = ""),
(this.endWeektime = ""),
(this.name1 = ""),
(this.name2 = ""),
(this.name3 = ""),
(this.activeName = "first"),
(this.clickIndex1 = null),
(this.clickIndex2 = null),
(this.clickIndex3 = null),
(this.cityVal = ""),
(this.infodistrictList = ""),
(this.imagelink = ""),
(this.imgList = [{ url: "" }]),
(this.telephoneArr = [{ beforeCode: "", afterCode: "" }]),
(this.mobilephoneArr = [{ code: "" }]),
(this.dataAll = {
storeCode: "",
storeName: "",
industrySituationCode: "",
industrySituationDesc: "",
subSiteTypeCode: "",
subSitetypeDesc: "",
siteTypeCode: "",
siteTypeDesc: "",
storeLevel: "",
largeAreaCode: "",
largeAreaName: "",
companyCode: "",
companyName: "",
storeStatus: "",
shopowner: "",
shopownerName: "",
storeTel: "",
transmissionLine: "",
provinceCode: "",
provinceName: "",
cityCode: "",
cityName: "",
cityAreaCode: "",
cityAreaName: "",
address: "",
shopLongitude: 0,
shopLatitude: 0,
marketArea: "",
surroundBuildings: "",
storeLogo: "",
urlList: "",
midweekServiceHours: "",
weekendServiceHours: "",
depotFlag: "",
parkInfo: "",
selfLiftFlag: "",
selfExtractingInfo: "",
buyOutTimeFlag: "",
storeCondues: "",
lastmodifier: "",
storePhone: "",
storeLevelDesc: ""
});
this.queryRegionListByParentCode("CN", "1", "1");
if (row) {
this.localstoreCode = row.storeCode;
}
this.templateIndex = 3;
this.queryStoreOperateInfo();
// this.queryStoreTypeList()
},
closeStore(row) {
let params = {
storeCode: row.storeCode
};
this.$http.get(DI.doStoreCloseOperation, { params: params }).then(
res => {
var data = res.data;
if (data.status == 0) {
this.$message({
type: "sucess",
message: "关闭成功！"
});
this.queryStoreInfoListByPage();
}
},
res => {
this.$message.error("接口调用失败");
}
);
},
jumpPage(pageNo) {
this.pageIndex = pageNo;
this.queryStoreInfoListByPage();
},
//查询大区
getAreaList() {
this.$http.get(DI.queryAllDistrictOrg, {}).then(
res => {
var data = res.data;
this.districtList = data;
if (this.districtVal != "") {
this.queryDistrictCompanyList();
}
this.companyVal = "";
this.storeVal = "";
this.querySiteInfoList();
},
res => {
this.$message.error("接口调用失败");
}
);
},
//根据大区查询分公司信息
queryDistrictCompanyList() {
if (this.districtVal == "") {
return;
}
let params = {
districtCode: this.districtVal
};
this.$http.get(DI.queryDistrictCompanyList, { params: params }).then(
res => {
var data = res.data;
this.companyList = data;
if (this.orgLevelCode == 1 || this.orgLevelCode == 4) {
if (this.authInfo.financialCode) {
this.companyVal = this.authInfo.financialCode;
}
}
this.storeVal = "";
if (this.companyVal != "") {
this.querySiteInfoListByCompanyCode();
} else {
this.querySiteInfoList();
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
//根据分公司名称查询门店信息
querySiteInfoListByCompanyCode() {
if (this.companyVal == "") {
return;
}
let params = {
companyCode: this.companyVal
};
this.$http
.get(DI.querySiteInfoListByCompanyCode, { params: params })
.then(
res => {
var data = res.data;
this.storeList = data;
if (this.orgLevelCode == 4) {
if (this.authInfo.storeCode) {
this.storeVal = this.authInfo.storeCode;
}
// this.searchList();
}
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
searchList() {
this.pageIndex = 1;
this.queryStoreInfoListByPage();
},
// 查询门店运营信息分页
queryStoreInfoListByPage() {
let params = {
// largeAreaCode:"10001",
// companyCode:"1009",
largeAreaCode: this.districtVal,
companyCode: this.companyVal,
storeCode: this.storeVal,
modifyFlag: this.maintenanceTypeVal,
storeTypeCode: this.storeTypeVal
};
this.$http
.post(
DI.queryStoreInfoListByPage +
"?page=" +
this.pageIndex +
"&rows=" +
this.pageSize,
params
)
.then(
res => {
var data = res.data;
this.tableData = data.rows;
this.total = data.total;
},
res => {
this.$message({
type: "warning",
message: "系统异常"
});
}
);
},
resetForm(formName) {
this.$refs[formName].resetFields();
},
// 权限问题
getUserInfo() {
this.$http
.get(DI.getUserInfo, {
params: {
authKey: this.authKey
// 葛晓星
// authKey:"cUJ0T2NWQUFuRmR3VlZsdGNydUoyVGJyOThpSUF0Ym5ZL28vRnd3V1daUmcwMzlBd1RhUkd6MWpzWjU5K1lad0FCQ1FpT1RFdXc0N2ZnMUVtWTcyTGhzWFBtWHoyODNOQ0orVVBPaUs4ZVhtMHpQN2tMeGIwYzFNUVJ4b2t1Y0xTNFE2TkZqR2Y0dUUrRGFWRmViTkhocndlZWlrdmxBS1RDOGZrT0JIcGZRQzJsSDFiTkx2Z0V6aHcwMzhKUTBpaitIZ3BWOUdWcXFzK2paSW8xRW1iLzh2Z3dPZnZ4ZFo3VnBTejhudkozZXlEbFBhdDRNbm1RPT0%3D"
// 门店
// authKey:"bkVwbTFMNnp2clZ1SVQ2WkV3RzRKVDlwZkJSd1Erbkk1a1oxK0psWEZ5eGcwMzlBd1RhUkcvL3I0Z2lYaXVtQTQ0VXRoMVlxSDVBN2ZnMUVtWTcyTHRaQU4wdVVYVFBmQ0orVVBPaUs4ZVZBRFovd2VPdHdmTzdUdlNqNzl5ZVdQeGJPSldGQ05rQmZYMU1IT294WktPeDFoR0krNk92YlM0UTZORmpHZjR0OFBDQSs0TytDTnhyd2VlaWt2bEFLNzhwQldZRGJlUkc5eUZwNXJrVE5MV2ZKejE0TFBkR2JBOWxDSzdKNGlWeU9kWGN3MWtZcmhRRVU2R3hPL2NTc254dzY1aUJpek0yYlh1QzNyeExFYTdhRzd3TXIzeDBVUE9sSVJtZUxOb0ZGUWZiZ25WcUg1NEYvNy9RSkRGTEpIOVhFaE0xcG5FNlpjU2FzbGpVelZBbEhuNU1FRm1BWTE3NmF2OWpGZnRNPQ%3D%3D"
// 分公司
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3eGIvdWtLUFRpLy9WMUJXZm5sZEVnTmcwMzlBd1RhUkd3UmFSRVl4cnVUMGJBbERFeWQvamdNN2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVZFU3l5WjgvYVZMdmJNVWl6a3p3aWNoWm9NNnJzZW1TOFVaUm8zdWJGVDk3TEVOU0ZQVmpJTlNYSUpGTmE0K0loTlhRc1gzYUlSc2NKV0oyc1VrdEkzd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw%3D%3D"
// 南京分公司
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3MnhLaS81SDF6K2xxRmhLckRSRHFSaGcwMzlBd1RhUkd3UmFSRVl4cnVUMGJBbERFeWQvamdNN2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVZFU3l5WjgvYVZMdmJNVWl6a3p3aWNoWm9NNnJzZW1TOFVaUm8zdWJGVDk3TEVOU0ZQVmpJTlNYSUpGTmE0K0loTlhRc1gzYUlSc2NKV0oyc1VrdEkzd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw"
// authKey:"cGRwU2ZSQ21RYjUrcGtFdDRHM0k3MnhLaS81SDF6K2xSNWdIVGVaMUF5OWcwMzlBd1RhUkd3UmFSRVl4cnVUMDJiVjl4dmo0MjV3N2ZnMUVtWTcyTHBGY2tEN1ZXYi82Q0orVVBPaUs4ZVYraWdWcE15eVJVeUt4aFBuR0Z5RmloWm9NNnJzZW1TODd3alprdkdDSVExSmRmYzNHOWVkd1NYSUpGTmE0K0loSUEwaFNVYkNYaXJvSWVpSXRjTWRqd0kxOUxqM2Q0MlJOZUJ6VUlVS243QUlRb0o0ODM5OEZvaHU3eGd5Y1BLazhadGJyTzVqQUkxWlhUU3RBS2JTVw"
}
})
.then(
res => {
var data = res.data.orgInfo;
// if(data.status == 0) {
// this.getAreaList();
// if(data.areaCode) {
// this.districtVal = data.areaCode;
// }
this.authInfo = data;
this.orgLevelCode = data.level; //* 层级编码,0总部,1分公司,2大区,4门店
if (this.orgLevelCode == "0") {
this.getAreaList();
}
// 大区权限
if (this.orgLevelCode == "2") {
this.districtList = [
{ districtCode: data.areaCode, districtName: data.areaName }
];
this.districtVal = data.areaCode;
this.queryDistrictCompanyList();
}
if (this.orgLevelCode == "1") {
this.districtList = [
{ districtCode: data.areaCode, districtName: data.areaName }
];
this.districtVal = data.areaCode;
this.companyList = [
{
companyCode: data.financialCode,
companyName: data.financialName
}
];
this.companyVal = data.financialCode;
this.querySiteInfoListByCompanyCode();
}
if (data.level == "4") {
this.districtList = [
{ districtCode: data.areaCode, districtName: data.areaName }
];
this.districtVal = data.areaCode;
this.companyList = [
{
companyCode: data.financialCode,
companyName: data.financialName
}
];
this.companyVal = data.financialCode;
this.storeList = [
{ storeCode: data.storeCode, storeName: data.storeName }
];
this.storeVal = data.storeCode;
this.localstoreCode = data.storeCode;
this.lookStore();
// this.querySiteInfoListByCompanyCode();
// this.queryStoreInfoListByPage();
// } else if(data.level == 1 || data.level == 2) {
// if(data.financialCode) {
// this.companyVal = data.financialCode;
// }
// let companyListArr = [];
// companyListArr.push({
// regionCode: data.regionCode,
// regionName: data.regionName
// })
// this.areas = [...regionList];
// this.area = this.areas[0].regionCode;
this.querySiteInfoListByCompanyCode();
}
setTimeout(() => {
this.searchList();
// this.queryPreSharepie()
}, 300);
// } else {
// if(data.message) {
// this.$message({
// type: "warning",
// message: data.message
// });
// }
// }
},
res => {
this.$message.error("接口调用失败");
}
);
},
//初始化进行获取区域，不定位（验证所选地址是否在省市区之内）
initDrawBounds() {
var district = null;
var polygons = [];
//加载行政区划插件
if (!district) {
//实例化DistrictSearch
var opts = {
subdistrict: 0, //获取边界不需要返回下级行政区
extensions: "all", //返回行政区边界坐标组等具体信息
level: "district" //查询行政级别为 市
};
district = new AMap.DistrictSearch(opts);
}
//行政区查询
let _self = this;
district.setLevel("district");
district.search(_self.dataAll.cityAreaName, function(status, result) {
if (status == "complete") {
_self.map.remove(polygons); //清除上次结果
polygons = [];
if (result.districtList[0].boundaries) {
var bounds = result.districtList[0].boundaries;
// _self.dataAll.shopLongitude=result.districtList[0].center.lng
// _self.dataAll.shopLatitude=result.districtList[0].center.lat
// _self.map.remove(_self.myMaker)
// _self.addMarker()
let path = bounds.toString();
let dataArr = path.split(",");
_self.paths = [];
for (let i = 0; i < dataArr.length; i = i + 2) {
let tem = [];
tem.push(dataArr[i], dataArr[i + 1]);
_self.paths.push(tem);
}
if (bounds) {
for (var i = 0, l = bounds.length; i < l; i++) {
//生成行政区划polygon
var polygon = new AMap.Polygon({
strokeWeight: 1,
path: bounds[i],
fillOpacity: 0.4,
fillColor: "#80d8ff",
strokeColor: "#0091ea"
});
polygons.push(polygon);
}
}
}
_self.map.add(polygons);
_self.map.setFitView(polygons); //视口自适应
}
});
},
// 获取省市区的地址，并标注中心点
drawBounds() {
var district = null;
var polygons = [];
//加载行政区划插件
if (!district) {
//实例化DistrictSearch
var opts = {
subdistrict: 0, //获取边界不需要返回下级行政区
extensions: "all", //返回行政区边界坐标组等具体信息
level: "district" //查询行政级别为 市
};
district = new AMap.DistrictSearch(opts);
}
//行政区查询
let _self = this;
district.setLevel("district");
district.search(_self.dataAll.cityAreaName, function(status, result) {
if (status == "complete") {
_self.map.remove(polygons); //清除上次结果
polygons = [];
if (result.districtList[0].boundaries) {
var bounds = result.districtList[0].boundaries;
_self.dataAll.shopLongitude = result.districtList[0].center.lng;
_self.dataAll.shopLatitude = result.districtList[0].center.lat;
_self.map.remove(_self.myMaker);
_self.addMarker();
let path = bounds.toString();
let dataArr = path.split(",");
_self.paths = [];
for (let i = 0; i < dataArr.length; i = i + 2) {
let tem = [];
tem.push(dataArr[i], dataArr[i + 1]);
_self.paths.push(tem);
}
if (bounds) {
for (var i = 0, l = bounds.length; i < l; i++) {
//生成行政区划polygon
var polygon = new AMap.Polygon({
strokeWeight: 1,
path: bounds[i],
fillOpacity: 0.4,
fillColor: "#80d8ff",
strokeColor: "#0091ea"
});
polygons.push(polygon);
}
}
}
_self.map.add(polygons);
_self.map.setFitView(polygons); //视口自适应
}
});
},
insertJsScript(src, index) {
var _scripts = document.getElementsByTagName("script");
for (var i = 0; i < _scripts.length; i++) {
if (_scripts[i].src === src) {
return;
}
}
var _script = document.createElement("script");
_script.type = "text/javascript";
_script.async = true;
_script.src = src;
var _s = _scripts[0];
_s.parentNode.insertBefore(_script, _s);
let _self = this;
_script.onload = function() {
_self.AMapFlag = true;
// callback && callback()
if (index == 1) {
_self.loadmap();
} else if (index == 2) {
_self.loadUimap();
}
};
},
loadmap() {
try {
this.map = new AMap.Map("container", {
zoom: 10
});
} catch (e) {
this.AMapFlag = false;
}
let uiLink = "http://webapi.amap.com/ui/1.0/main.js?v=1.0.11";
this.insertJsScript(uiLink, "2");
},
loadUimap() {
try {
let _self = this;
AMapUI.loadUI(["misc/PoiPicker"], function(PoiPicker) {
var poiPicker = new PoiPicker({
//city:‘北京‘,
input: "pickerInput"
});
//初始化poiPicker
_self.poiPickerReady(poiPicker);
});
} catch (e) {
this.AMapFlag = false;
}
}
},
mounted() {
let mapLink =
"https://webapi.amap.com/maps?v=1.4.10&key=84bcccce10388c72a7e1874dca568ec9&plugin=AMap.DistrictSearch,AMap.Geocoder,AMap.ToolBar";
this.insertJsScript(mapLink, "1");
let urlArgs = DC.getUrlArgs();
this.authKey = urlArgs.authKey;
this.getUserInfo();
this.queryStoreTypeList();
// 查询所有门店列表
this.querySiteInfoList();
}
};
</script>
<style lang=‘less‘>
@import url("../../css/difinitions");
@import url("../../css/_reset.css");
@import url("../../css/elementUI_reset");
@import url("../../css/shop+reset");
.title {
margin-bottom: 20px;
border-left: 4px solid #15b374;
height: 25px;
line-height: 25px;
// font-weight: bold;
font-size: 18px;
padding-left: 5px;
}
.el-dialog__title {
color: #15b374;
}
.el-dialog__body {
padding: 0 30px 60px 30px;
}
.el-tabs__header {
margin: 0 0 10px;
}
.el-tabs__item:focus.is-active.is-focus:not(:active) {
box-shadow: none;
}
.el-date-editor--daterange.el-input__inner {
width: 300px;
}
.echarts-box {
display: flex;
width: 100%;
height: 500px;
margin-top: 40px;
.echarts-pie-box {
position: relative;
width: 354px;
height: 500px;
.echarts-pie {
width: 100%;
height: 100%;
}
.pieTitle {
font-size: 16px;
font-weight: 500;
padding-left: 6%;
}
.num-msg {
position: absolute;
top: 130px;
left: 0;
width: 100%;
text-align: center;
p {
line-height: 24px;
font-size: 16px;
}
}
}
.echarts-line-box {
/*width: 70%;*/
flex: 1;
height: 500px;
.echarts-line {
height: 100%;
}
.lineTitle {
font-size: 16px;
font-weight: 500;
padding-left: 30px;
}
}
}
.panel-box {
display: flex;
flex-direction: row;
flex-wrap: wrap;
margin-bottom: 20px;
.grid-content {
margin: 5px 10px 5px 5px;
padding: 10px;
width: 220px;
height: 160px;
.name {
padding: 5px 0 10px 0;
text-align: center;
font-weight: bold;
}
.info-box {
display: flex;
.info-item {
flex: 1;
padding: 5px 0;
text-align: center;
p {
padding: 24px 0;
}
}
}
&.bg-g {
background-color: #ebeef5;
cursor: pointer;
&:hover {
background-color: #efefef;
// transform: scale(1.1);
}
&.active {
background-color: #15b374;
transform: scale(1.1);
color: #ffffff;
.name {
font-weight: 700;
}
}
}
}
}
.bar-box {
h3 {
padding: 0 24px;
font-size: 16px;
}
.search-box {
margin: 10px 0 0 60px;
.col-box {
margin-bottom: 20;
}
}
}
.table-box {
margin: 0 50px 30px;
}
.lab {
// width: 80px;
text-align: left;
}
.green {
color: #15b374;
cursor: pointer;
}
// 详情 *************
#container {
position: relative !important;
width: 400px;
height: 300px;
margin: 0px;
font-size: 13px;
}
input:-webkit-autofill,
textarea:-webkit-autofill,
select:-webkit-autofill {
background-color: none !important;
background-image: none !important;
color: rgb(0, 0, 0) !important;
}
#pickerBox {
// position: absolute;
z-index: 500;
// top: 350px;
// right: 30px;
// width: 300px;
}
#pickerInput {
width: 400px;
padding: 5px 5px;
border: 1px solid #797b80;
}
.pickerInputError {
width: 400px;
padding: 5px 5px;
border: 1px solid #797b80;
}
#poiInfo {
background: #fff;
}
.amap_lib_placeSearch .poibox.highlight {
background-color: #cae1ff;
}
.amap_lib_placeSearch .poi-more {
display: none !important;
}
// 高德地图
.title {
margin-bottom: 20px;
border-left: 4px solid #15b374;
height: 25px;
line-height: 25px;
// font-weight: bold;
font-size: 18px;
padding-left: 5px;
.big-title {
// font-size: 16px;
cursor: pointer;
}
.little-title {
// font-size: 16px;
color: #999;
}
}
.panel {
padding-top: 20px;
font-size: 14px;
.header-name {
color: #15b374;
}
.mult-line {
display: flex;
.contain {
margin-right: 100px;
padding: 15px;
.gab {
margin-top: 10px;
}
.gabline {
display: flex;
justify-content: top;
}
.evn {
line-height: 35px;
// span{
// margin-left:5px;
// }
.lab {
width: 150px;
text-align: right;
}
.rang_bottom {
padding: 10px;
position: absolute;
z-index: 1000;
width: 400px;
height: 300px;
background: #fff;
left: 175px;
margin-top: -6px;
overflow: auto;
border: #797b80 1px solid;
.reginon_list {
display: flex;
width: 380px;
// height: 200px;
flex-wrap: wrap;
.item {
display: flex;
height: 30px;
line-height: 30px;
width: 90px;
justify-content: center;
align-content: center;
cursor: pointer;
}
.activeItem {
background: #15b374;
}
}
}
.basic {
display: flex;
justify-content: center;
.left {
line-height: 40px;
width: 110px;
text-align: right;
}
.right_name {
width: 600px;
line-height: 40px;
.el-input {
width: 305px;
}
.el-input__inner {
width: 305px;
}
}
.right {
width: 600px;
line-height: 40px;
.el-input {
width: 400px;
}
.el-input__inner {
width: 400px;
}
.input_out {
border: #797b80 1px solid;
height: 26px;
width: 400px;
}
.icon-arrow {
margin-left: -20px;
}
}
.right-time {
width: 600px;
line-height: 40px;
.el-input {
width: 197px;
}
.el-input__inner {
width: 197px;
}
}
}
.img-up {
display: flex;
.left {
line-height: 40px;
width: 110px;
text-align: right;
}
.right {
width: 600px;
}
}
.phone {
display: flex;
.left {
// margin-left:5px;
line-height: 40px;
width: 110px;
text-align: right;
}
.right {
width: 600px;
.telephone {
line-height: 40px;
span {
:first-child.el-input {
width: 100px !important;
.el-input__inner {
width: 100px !important;
}
}
}
.green {
color: #15b374;
cursor: pointer;
}
}
.mobilephone {
line-height: 40px;
.el-input {
width: 305px !important;
.el-input__inner {
width: 305px !important;
}
}
.green {
color: #15b374;
}
}
}
}
.map_main {
display: flex;
.left {
// margin-left:5px;
// line-height: 40px;
text-align: right;
width: 110px;
}
.right {
line-height: 40px;
width: 400px;
.GD_map {
width: 400px;
height: 320px;
// background: #eeeeee;
}
.long-lat {
display: flex;
align-items: center;
.left1 {
div {
line-height: 30px;
.el-input {
width: 324px;
}
.el-input__inner {
width: 324px;
}
}
}
.ii {
font-size: 24px;
margin-left: 10px;
cursor: pointer;
}
}
}
}
}
}
}
}
.btn-center {
margin: 30px;
display: flex;
.btn-left {
margin-left: 93px;
}
.btn-right {
margin-left: 30px;
}
}
// .el-input__inner {
// width: 300px;
// }
.el-date-editor.el-input__inner {
width: 300px;
}
.el-input__inner {
width: 200px;
}
.el-input {
width: 200px;
}
.el-textarea__inner {
width: 304px;
}
.upload-line {
display: flex;
.operate {
margin-right: 30px;
display: flex;
.del {
width: 30px;
height: 30px;
}
.add-img {
width: 120px;
height: 120px;
display: flex;
align-items: center;
justify-content: center;
border: 1px dashed #d9d9d9;
border-radius: 6px;
.img {
font-size: 24px;
}
}
}
}
.el-upload--picture-card i {
font-size: 100px;
color: #8c939d;
}
.avatar-uploader .el-upload {
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
width: 120px;
height: 120px;
background-image: none;
&:hover {
p {
bottom: 0;
}
}
p {
position: absolute;
bottom: -100%;
width: 100%;
background-color: rgba(0, 0, 0, 0.6);
color: rgba(255, 255, 255, 0.3);
font-size: 14px;
height: 24px;
line-height: 24px;
text-align: center;
transition: all 0.3s linear;
}
}
.avatar-uploader .el-upload:hover {
border-color: #409eff;
}
.avatar-uploader-icon {
font-size: 50px;
color: #8c939d;
width: 120px;
height: 120px;
line-height: 120px;
text-align: center;
}
.avatar {
width: 120px;
height: 120px;
display: block;
border: 1px dashed #d9d9d9;
border-radius: 6px;
}
.red-star {
color: red;
font-size: 18px;
}
</style>
高德地图，动态引入js文件
以上是关于动态引入js文件的主要内容，如果未能解决你的问题，请参考以下文章