Commit 1a025f1a authored by xulili's avatar xulili

删除不必要代码

parent 3a27b6d0
...@@ -11,16 +11,13 @@ ...@@ -11,16 +11,13 @@
}, },
"dependencies": { "dependencies": {
"animate.css": "^4.1.1", "animate.css": "^4.1.1",
"awe-dnd": "^0.3.1",
"axios": "^0.18.0", "axios": "^0.18.0",
"echarts": "^4.2.0-rc.2", "echarts": "^4.2.0-rc.2",
"element-ui": "^2.4.8", "element-ui": "^2.7.2",
"file-saver": "^2.0.0-rc.3", "file-saver": "^2.0.0-rc.3",
"html2canvas": "^1.0.0-rc.7", "html2canvas": "^1.0.0-rc.7",
"jspdf": "^2.3.1", "jspdf": "^2.3.1",
"moment": "^2.22.2", "moment": "^2.22.2",
"ol": "^5.2.0",
"ol-ext": "^3.0.2",
"qrcode.vue": "^1.6.1", "qrcode.vue": "^1.6.1",
"qs": "^6.5.2", "qs": "^6.5.2",
"qs-stringify": "^1.1.0", "qs-stringify": "^1.1.0",
......
...@@ -37,7 +37,6 @@ export default { ...@@ -37,7 +37,6 @@ export default {
</script> </script>
<style lang="less"> <style lang="less">
@import "common/fonts/font.css";
@import 'style/common.less'; @import 'style/common.less';
@import 'style/dialog.less'; @import 'style/dialog.less';
#app { #app {
......
@font-face {
font-family: 'fSourceHanSansCN-Regular';
src: url('~@/common/fonts/SourceHanSansCN-Regular.otf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'SourceHanSansCN-Bold';
src: url('~@/common/fonts/SourceHanSansCN-Bold.otf');
font-weight: normal;
font-style: normal;
}
@font-face {
font-family: 'SourceHanSansCN-Medium';
src: url('~@/common/fonts/SourceHanSansCN-Medium.otf');
font-weight: normal;
font-style: normal;
}
// import http from '../../config/httpServer'
// import {backToken} from '../../config/env'
import $ from 'jquery'
function keydown() {
$(document).keyup(function (event) {
if (event.keyCode == 13) {
$(".search").trigger("click");
}
});
}
// function getBranch() {
// // 归属网点列表渲染
// $.ajax({
// type: "get",
// url: "bankBranchInfo/getBankBox",
// authType: backToken,
// async:false,
// success: function (res) { //function1()
// console.log(res.data);
// return res.data
// }
// })
// console.log(22);
// http({
// method: 'get',
// url: 'bankBranchInfo/getBankBox',
// authType: backToken
// }).then((res) => {
// // _this.options = res.data.records;
// console.log(res.data);
// return res.data;
// }, (error) => {
// console.log(error)
// }
// )
// }
export const shortcuts = function () {
keydown()
}
<template>
<div class="title_con">
<p class="footer_title">&copy;2018 招商银行武汉分行出品</p>
</div>
</template>
<script>
export default {
data() {
return {
}
},
computed: {},
mounted() {
},
methods: {
},
}
</script>
<style lang="less">
@import '../../style/common';
.footer_title{
text-align: center;
font-size:14px;
font-weight:400;
color:rgba(0,0,0,0.45);
padding-top: 20px;
padding-bottom: 20px;
}
</style>
<template>
<div class="forgetPassword W100 H100">
<div class="content">
<h2>忘记密码</h2>
<p>如果您忘记密码,请您联系相关管理人员</p>
<p>联系电话:13924551212</p>
<p> 邮箱:325346534@zh.com</p>
</div>
</div>
</template>
<script>
export default {
data () {
return {}
},
methods: {
}
}
</script>
<style lang="less" >
@import '../../style/common';
.forgetPassword{
background:url("../../../static/images/pic/bg.png");
border: 1px solid transparent;
.content {
width: 22%;
height: 30%;
margin: 12% auto;
h2{
font-size:20px;
font-weight:500;
color:rgba(0,0,0,1);
text-align: center;
margin-bottom: 7%;
}
p{
font-size:18px;
font-family:PingFangSC-Regular;
font-weight:400;
color:rgba(0,0,0,1);
margin-bottom: 3%;
}
}
}
</style>
<template>
<div class="header_container" style="overflow:hidden;">
</div>
</template>
<script>
</script>
<style>
.header_container{
width: 100%;
height: 64px;
background-color: #dd44;
}
</style>
...@@ -104,7 +104,12 @@ export default { ...@@ -104,7 +104,12 @@ export default {
"menuList", "menuList",
JSON.stringify(resData.menuList) JSON.stringify(resData.menuList)
); );
_this.$router.push("index"); if(_this.$route.query.redirect){
_this.$router.push(_this.$route.query.redirect);
}else{
_this.$router.push("index");
}
} else { } else {
_this.$message.error(res.data.message); _this.$message.error(res.data.message);
} }
......
<template>
<div class="header_container" style="overflow:hidden;">
<!-- <div class="headerTitle l-float">中国国家博物馆建党百年展点播院线服务平台</div> -->
<el-dropdown class="adminlogo r-float H100" @command="handleCommand" trigger="click">
<div class="box">
<span class="el-dropdown-link">
{{loginInf.username}}
<i class="el-icon-arrow-down el-icon--right"></i>
</span>
</div>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item command="editPwd">修改密码</el-dropdown-item>
<el-dropdown-item command="singout">退出</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
<span class="header_icon r-float">
<img class="bell" src="../../../static/images/icon/bell.png" alt="" />
<img :src="loginInf.avatar" class="avator" />
</span>
<el-dialog title="修改密码" class="hotEvent" :visible.sync="editManege" width="30%" :before-close="close">
<el-form :model="form" :rules="Rules" id="ruleo" ref="form" label-position="right" label-width="100px">
<el-form-item label="旧密码:" prop="oldPass">
<el-input type="password" size="small" v-model="form.oldPass" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="新密码:" prop="newPass">
<el-input type="password" size="small" v-model="form.newPass" auto-complete="off"></el-input>
</el-form-item>
<el-form-item label="确认密码:" prop="checkPass">
<el-input type="password" size="small" v-model="form.checkPass" auto-complete="off"></el-input>
</el-form-item>
<!--password-->
</el-form>
<div slot="footer" class="dialog-footer">
<el-button size="mini" @click="close">取消</el-button>
<el-button type="primary" size="mini" @click="submitForm">确认</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
data() {
var validatePass = (rule, value, callback) => {
if (value == '') {
callback(new Error('请再次输入密码'));
} else if (value !== this.form.newPass) {
callback(new Error('两次输入密码不一致!'));
} else {
callback();
}
};
return {
activeIndex: "",
loginInf: {},
editManege: false,
form: {
oldPass: '',
newPass: '',
checkPass: ''
},
Rules: {
oldPass: [
{required: true, message: '请输入旧密码', trigger: 'blur'}
],
newPass: [
{required: true, message: '请输入新密码', trigger: 'blur'},
{min: 6, message: '密码至少为6个字符', trigger: 'blur'},
{pattern: /^[a-zA-Z0-9_-]{0,20}$/, message: '请设置合格的密码(可用字母,数字,下划线,减号)'}
],
checkPass: [
{required: true, message: '请再次输入密码', trigger: 'blur'},
{validator: validatePass, trigger: 'blur'}
]
},
}
},
mounted() {
this.initData();
},
computed: {},
methods: {
initData () {
let inf={
avatar:'',
username:'',
}
inf.avatar = localStorage.getItem('avatar');
inf.username = localStorage.getItem('username');
this.loginInf=inf;
},
handleCommand(command) {
command == 'singout' ? this.singout() : this.editPwd();
},
singout() {
let vm = this;
vm.$https({
url: `logout?token=${localStorage.getItem('backToken')}`,
method: 'get',
}).then(res=>{
vm.removeSession()
if (res.status == 200) {
vm.$message({
type: 'success',
message: '退出登录!'
});
setTimeout(function () {
vm.$router.push('/');
},500);
}
})
},
removeSession () {
if (localStorage.getItem('backToken')) {
localStorage.clear();
}
},
editPwd() {
let _this = this;
for (let key in _this.form) {
_this.form[key] = null;
}
this.editManege = true;
},
submitForm() {
let _this = this;
let searchObj = {
"oldPassWord": _this.form.oldPass,
"password": _this.form.newPass
};
_this.$refs.form.validate((valid) => {
if (valid) {
_this.$https({
url: 'employee/editPwd',
method: 'put',
authType: this.backToken
}, _this.$qs.stringify(searchObj))
.then((res) => {
if (res.status == 200) {
_this.$message({
type: 'success',
message: res.data.message
});
_this.close();
_this.removeSession();
setTimeout(function () {
_this.$router.push('/');
},500);
} else {
_this.$message({
type: 'error',
message: res.data.message
});
}
}, (error) => {
_this.$message({
type: 'error',
message: error
});
}
)
} else {
return false;
}
});
},
close() {
this.editManege = false;
this.$refs['form'].resetFields();
},
}
}
</script>
<style lang="less">
@import '../../style/common';
.header_container {
width: 100%;
height: 63px;
background-color: #dd44;
.headerTitle {
// width: 100%;
/*height: 8%;*/
height: 63px;
line-height: 63px;
// background: #002140;
font-size: 24px;
font-weight: 600;
// color: rgba(255, 255, 255, 1);
// text-align: center;
}
.header_icon{
line-height:63px;
margin-right:20px;
img{
vertical-align: middle;
&.bell{margin-right:25px;}
&.avator{background-color:#1D6CAD;border-radius:50%;width:24px; height: 24px;}
}
}
.box {
cursor: pointer;
float: right;
margin-right: 25px;
margin-top: 20px;
display: flex;
flex-direction: row;
justify-content: space-between;
}
/*!*弹窗*!*/
.el-dialog{
width: 600px;
background:rgba(255,255,255,1);
box-shadow:0px 4px 12px 0px rgba(0,0,0,0.2);
border-radius:4px;
.el-dialog__header{
padding: 15px;
border-bottom: 1px solid rgba(0,0,0,0.09);
}
.el-dialog__body{
padding: 0px 20px;
border: 1px solid transparent;
margin-top: 10px;
.form_box{
padding-bottom: 40px;
.el-form {
margin-bottom: 20px;
.el-form-item{
margin: 10px 50px 20px;
.el-form-item__content{
width: 280px;
}
}
.el-input{
width: 100%;
}
}
.dialog-footer{
border-top: 1px solid rgba(0,0,0,0.09);
padding-top: 8px;
.el-button{
margin-right: 10px;
padding: 8px 16px;
}
}
}
}
}
}
.el-table::before {
background-color: transparent;
}
</style>
<template>
<div>
<script :id=id type="text/plain"></script>
</div>
</template>
<script>
export default {
name: 'UE',
data () {
return {
editor: null
}
},
props: {
defaultMsg: {
type: String
},
config: {
type: Object
},
id: {
type: String
},
},
mounted() {
const _this = this;
this.editor = UE.getEditor(this.id, this.config); // 初始化UE
this.editor.addListener("ready", function () {
_this.editor.setContent(_this.defaultMsg); // 确保UE加载完成后,放入内容。
});
},
methods: {
getUEContent() { // 获取内容方法
return this.editor.getContent()
},
getUEContentTxt() { // 获取纯文本内容方法
return this.editor.getContentTxt()
},
setUEContentTxt(param){
this.editor.setContent(param); // 确保UE加载完成后,放入内容。
}
},
destroyed() {
this.editor.destroy();
},
watch:{
// 'defaultMsg' (cur,old){
// this.defaultMsg = cur
// }
}
}
</script>
<template>
<div>
<script :id=id type="text/plain"></script>
</div>
</template>
<script>
export default {
name: 'UE',
data () {
return {
editor: null
}
},
props: {
defaultMsg: {
type: String
},
config: {
type: Object
},
id: {
type: String
},
},
mounted() {
const _this = this;
this.editor = UE.getEditor(this.id, this.config); // 初始化UE
this.editor.addListener("ready", function () {
_this.editor.setContent(_this.defaultMsg); // 确保UE加载完成后,放入内容。
});
},
methods: {
getUEContent() { // 获取内容方法
return this.editor.getContent()
},
getUEContentTxt() { // 获取纯文本内容方法
return this.editor.getContentTxt()
},
setUEContentTxt(param){
this.editor.setContent(param); // 确保UE加载完成后,放入内容。
}
},
destroyed() {
this.editor.destroy();
},
watch:{
// 'defaultMsg' (cur,old){
// this.defaultMsg = cur
// }
}
}
</script>
...@@ -2,15 +2,10 @@ ...@@ -2,15 +2,10 @@
* Created by supervisor on 2018/2/28. * Created by supervisor on 2018/2/28.
*/ */
let baseUrl=""; let baseUrl="";
let weUrl = "";
let basefileUrl="";
let routerMode='history'; let routerMode='history';
let backToken = "back"; let backToken = "back";
let frontToken = "front";
let ProUrl = "" let ProUrl = ""
let appHomeUrl = ""
let skipLinkUrl = ""
getBaseUrl(); getBaseUrl();
function getBaseUrl(){ function getBaseUrl(){
...@@ -19,8 +14,6 @@ function getBaseUrl(){ ...@@ -19,8 +14,6 @@ function getBaseUrl(){
async: false, async: false,
success: function(data){ success: function(data){
ProUrl = data.baseUrl || (window.location.protocol + '//' + window.location.host + '/'); ProUrl = data.baseUrl || (window.location.protocol + '//' + window.location.host + '/');
appHomeUrl = data.appHomeUrl;
skipLinkUrl = data.skipLinkUrl;
} }
}) })
} }
...@@ -34,12 +27,7 @@ if(process.env.NODE_ENV === 'development'){ ...@@ -34,12 +27,7 @@ if(process.env.NODE_ENV === 'development'){
} }
export { export {
baseUrl, baseUrl,
weUrl,
appHomeUrl,
skipLinkUrl,
backToken, backToken,
frontToken,
basefileUrl,
routerMode routerMode
} }
// process.env 是读取系统环境变量,在node命令窗口启动时设置相关的环境变量,NODE_ENV=development node来启动命令窗口 // process.env 是读取系统环境变量,在node命令窗口启动时设置相关的环境变量,NODE_ENV=development node来启动命令窗口
...@@ -2,7 +2,6 @@ ...@@ -2,7 +2,6 @@
* Created by supervisor on 2017/11/3. * Created by supervisor on 2017/11/3.
*/ */
import axios from 'axios' import axios from 'axios'
import store from '../store'
import { Message, MessageBox, Loading } from 'element-ui'; import { Message, MessageBox, Loading } from 'element-ui';
import router from '../router' import router from '../router'
import { baseUrl } from './env' import { baseUrl } from './env'
...@@ -12,7 +11,6 @@ import { loginOut } from './loginOut' ...@@ -12,7 +11,6 @@ import { loginOut } from './loginOut'
//axios 拦截器 请求时的拦截 //axios 拦截器 请求时的拦截
axios.interceptors.request.use(config => { axios.interceptors.request.use(config => {
// 发送请求之前做一些处理 // 发送请求之前做一些处理
store.commit('UPDATE_LOADING', true) //显示loading
// config.headers = { // config.headers = {
// 'Content-Type': 'application/json' // 'Content-Type': 'application/json'
// }; // };
...@@ -30,7 +28,6 @@ axios.interceptors.response.use(response => { ...@@ -30,7 +28,6 @@ axios.interceptors.response.use(response => {
return Promise.resolve(error.response) return Promise.resolve(error.response)
}) })
function errorState(status, data) { function errorState(status, data) {
store.commit('UPDATE_LOADING', false)
if (data.resultCode == '1109') { if (data.resultCode == '1109') {
loginOut() loginOut()
MessageBox.alert('您的登录过期,请重新登录!', '提示', { MessageBox.alert('您的登录过期,请重新登录!', '提示', {
...@@ -47,7 +44,6 @@ function errorState(status, data) { ...@@ -47,7 +44,6 @@ function errorState(status, data) {
localStorage.removeItem('backToken') localStorage.removeItem('backToken')
localStorage.removeItem('userId') localStorage.removeItem('userId')
router.push({ path: '/', query: { redirect: router.history.current.fullPath } }) router.push({ path: '/', query: { redirect: router.history.current.fullPath } })
store.commit('isAdminInfo', false);
} }
}); });
} else if (status === 500 && data.message.indexOf("not have permission") !== -1) { } else if (status === 500 && data.message.indexOf("not have permission") !== -1) {
...@@ -57,7 +53,6 @@ function errorState(status, data) { ...@@ -57,7 +53,6 @@ function errorState(status, data) {
} }
} }
function successState(res) { function successState(res) {
store.commit('UPDATE_LOADING', false) //隐藏loading
} }
const httpServer = (opts, data, file, timeout) => { const httpServer = (opts, data, file, timeout) => {
......
This diff is collapsed.
This diff is collapsed.
/**
* Created by cp on 2016/5/3.
*/
//十六进制颜色值域RGB格式颜色值之间的相互转换
//-------------------------------------
//十六进制颜色值的正则表达式
function ColorChange() {
var reg = /^#([0-9a-fA-f]{3}|[0-9a-fA-f]{6})$/;
/*RGB颜色转换为16进制*/
String.prototype.colorHex = function(){
var that = this;
if(/^(rgb|RGB)/.test(that)){
var aColor = that.replace(/(?:\(|\)|rgb|RGB)*/g,"").split(",");
var strHex = "#";
for(var i=0; i<aColor.length; i++){
var hex = Number(aColor[i]).toString(16);
if(hex === "0"){
hex += hex;
}
strHex += hex;
}
if(strHex.length !== 7){
strHex = that;
}
return strHex;
}else if(reg.test(that)){
var aNum = that.replace(/#/,"").split("");
if(aNum.length === 6){
return that;
}else if(aNum.length === 3){
var numHex = "#";
for(var i=0; i<aNum.length; i+=1){
numHex += (aNum[i]+aNum[i]);
}
return numHex;
}
}else{
return that;
}
};
//-------------------------------------------------
/*16进制颜色转为RGB格式*/
String.prototype.colorRgb = function(){
var sColor = this.toLowerCase();
if(sColor && reg.test(sColor)){
if(sColor.length === 4){
var sColorNew = "#";
for(var i=1; i<4; i+=1){
sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1));
}
sColor = sColorNew;
}
//处理六位的颜色值
var sColorChange = [];
for(var i=1; i<7; i+=2){
sColorChange.push(parseInt("0x"+sColor.slice(i,i+2)));
}
return "RGB(" + sColorChange.join(",") + ")";
}else{
return sColor;
}
};
/*16进制颜色转为RGB格式*/
String.prototype.colorRgba = function(al){
var sColor = this.toLowerCase();
if(sColor && reg.test(sColor)){
if(sColor.length === 4){
var sColorNew = "#";
for(var i=1; i<4; i+=1){
sColorNew += sColor.slice(i,i+1).concat(sColor.slice(i,i+1));
}
sColor = sColorNew;
}
//处理六位的颜色值
var sColorChange = [];
for(var i=1; i<7; i+=2){
sColorChange.push(parseInt("0x"+sColor.slice(i,i+2)));
}
return "rgba(" + sColorChange.join(",") +","+al+ ")";
}else{
return sColor;
}
};
}
export {ColorChange}
/**
* Created by cp on 2016/11/22.
*/
import Style from 'ol/style/Style';
import Icon from 'ol/style/Icon';
import Fill from 'ol/style/Fill';
import Stroke from 'ol/style/Stroke';
import Circle from 'ol/style/Circle';
import SnapGuides from 'ol-ext/interaction/SnapGuides';
import Collection from 'ol/Collection';
import {Tile as TileLayer, Vector as VectorLayer} from 'ol/layer';
import {OSM, Vector as VectorSource} from 'ol/source';
import Modify from 'ol/interaction/Modify';
import Draw, {createRegularPolygon, createBox} from 'ol/interaction/Draw';
import CircleStyle from 'ol/style/Circle';
//有一些类对外放出的不是一个对象,二是一个个的方法如
// import condition from 'ol/events/condition'; 错误的引用
import {click, pointerMove, altKeyOnly,shiftKeyOnly,singleClick} from 'ol/events/condition';//正确的引用
// var source = new VectorSource({wrapX: false});
function startDraw(mainMap,vueThis){
let map=mainMap.getMap();
let ol=mainMap.ol;
var tempObj={};
var drawFeatures = new Collection();
var featureOverlay = new VectorLayer({
source: new VectorSource({features: drawFeatures})
});
featureOverlay.setMap(map);
var modifyFeatures = new Collection();
//编辑
var modify = new Modify({
features: modifyFeatures,
deleteCondition: function(event) {
return shiftKeyOnly(event) &&
singleClick(event);
}
});
map.addInteraction(modify);
function setEditFeature(fes){
modifyFeatures.clear();
// for(var i=0;i<fes.length;i++){
var tempf= fes;
var oldstyle=tempf.getStyle();
tempf.set("oldStyle",oldstyle);
var oldGeom=tempf.getGeometry().clone();
tempf.set("oldGeom",oldGeom);
modifyFeatures.push(tempf);
// }
}
tempObj.setEditFeature=setEditFeature;
function remoAllEditDraw(calFunc,okFunc){
var drarr=drawFeatures.getArray();
var modifyArr=modifyFeatures.getArray();
if(drarr.length>0||modifyArr.length>0){
}else{
if(okFunc){
okFunc();
}
}
}
tempObj.remoAllEditDraw=remoAllEditDraw;
function cleanModifyOrDraw(){
clanLayer();
cleanModifyFunc();
removeDrawFunc();//清除上一次绘制的配置
}
tempObj.cleanModifyOrDraw=cleanModifyOrDraw;
function cleanAllFeature(succ){
showAlertW('确认清除?',null,function(){
cleanModifyOrDraw();
if(succ){
succ();
}
})
}
tempObj.cleanAllFeature=cleanAllFeature;
function showAlertW(count,calFunc,okFunc){
//删除活动事件
vueThis.$confirm(count, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
if(okFunc){
okFunc();
}
}).catch(() => {
if(calFunc){
calFunc();
}
});
}
function getModifyFeature(){
if(modifyFeatures){
return modifyFeatures.getArray() ;
}
return null;
}
tempObj.getModifyFeature=getModifyFeature;
function cleanModifyFunc(){
for(var kk=0;kk<modifyFeatures.getArray().length;kk++){
var f1=modifyFeatures.getArray()[kk];
var olsty=f1.get("oldStyle");
if(olsty){
f1.setStyle(olsty);
}
var oldGeom = f1.get("oldGeom");
if(oldGeom){
f1.setGeometry(oldGeom);
}
}
modifyFeatures.clear();
}
//停止编辑
function remoaveEditFeature(succ){
if(modifyFeatures&&modifyFeatures.getArray().length>0){
showAlertW('存在未保存的编辑,确认不保存?',null,function(){
cleanModifyFunc();
if(succ){
succ();
}
});
}
}
tempObj.remoaveEditFeature=remoaveEditFeature;
//绘制
var draw;
function clanLayer(){
featureOverlay.getSource().clear();
}
tempObj.clanLayer=clanLayer;
//Point,点 LineString线 Polygon 面 Square 矩形 Circle 圆 Box 盒子
function addInteraction(type,func) {
var drarr=drawFeatures.getArray();
var modifyArr=modifyFeatures.getArray();
if(drarr.length>0||modifyArr.length>0){
//绘制的时候 现在和地图中的事件添加 有冲突 导致清除之后 地图上的还有开始绘制的东西 ,后面想办法解决一下
showAlertW('存在未保存的编辑,确认不保存?',null,function(){
startDrawFunc(type);
if(func){
func();
}
});
}else{
startDrawFunc(type);
}
}
tempObj.addInteraction=addInteraction;
let geometryFunction;
function startDrawFunc(type){
removeDrawFunc();//清除上一次绘制的配置
cleanModifyFunc();//清除修改的部分
featureOverlay.getSource().clear();
if(type==vueThis.SQUARE||type==vueThis.BOX){
if(type==vueThis.SQUARE){
geometryFunction = createRegularPolygon(4);
}else{
geometryFunction = createBox();
}
//都是以原型的来绘制
draw = new Draw({
features: drawFeatures,
type:vueThis.DRAW_CIRCLE,
geometryFunction: geometryFunction
});
}else{
let tempType="";
if(type==vueThis.DRAW_TEXT){
tempType=vueThis.POINT_TYPE;
}else{
tempType=type;
}
draw = new Draw({
features: drawFeatures,
type:tempType
});
}
if(type==vueThis.POLYGON_TYPE||type==vueThis.LINE_STRING_TYPE){
var snapi = new SnapGuides();// {options} 参数可以进行设置
snapi.setDrawInteraction(draw);
map.addInteraction(snapi);
}
draw.on("drawend",function(event){
var drawF= event.feature;
modifyFeatures.push(drawF);
addFeatureFunc(drawF,type);
removeDrawFunc();
});
map.addInteraction(draw);
}
function setStyleInit(data,type){
//点
if(type==vueThis.POINT_TYPE){
vueThis.pointStyle=data;
}else if(type==vueThis.LINE_STRING_TYPE){
//线
vueThis.lineStyle=data;
}else{
vueThis.polygonStyle=data;
}
}
function addFeatureFunc(fe,type){
var data={};
data.strokeColor="#0099ff";
data.strokeWeight=3;
data.strokeAlpha=1
data.fillAlpha=0.7;
data.fillColor="#ffffff";
data.fileRadio=7;
data.imageSrc=null;
data.lineDash=1;
fe.set("featureType",type);
setStyleInit(data,type);
fe.on('singleclick', function(event){
if(callFunc){
callFunc(type,fe,event);
}
});
fe.set('singleclick',true);//标识该点存在点击事件
}
var callFunc=null;
function setCilckCallBack(callFuncItem){
callFunc=callFuncItem
}
tempObj.setCilckCallBack=setCilckCallBack;
function getExistEditFeature(){
var drarr=drawFeatures.getArray();
var modifyArr=modifyFeatures.getArray();
if(drarr.length>0||modifyArr.length>0){
return true;
}
return false;
}
tempObj.getExistEditFeature=getExistEditFeature;
//移除绘制
function removeDrawFunc(){
if(draw){
map.removeInteraction(draw);
}
}
tempObj.removeDrawFunc=removeDrawFunc;
return tempObj;
}
export {startDraw}
import {addProjection, addCoordinateTransforms, transform} from 'ol/proj';
import Point from 'ol/geom/Point';
import Feature from 'ol/Feature';
import {Tile as TileLayer, Vector as VectorLayer,Heatmap} from 'ol/layer';
import {OSM, Vector as VectorSource} from 'ol/source';
function startDataClass(mainMap){
let obj={};
// 设置参数
mainMap.setMaxMinZoom(4, 18);// 设置地图的显示级别范围
mainMap.startZoom = 0;// 设置地图的初始化显示级别
mainMap.init('map');
mainMap.setCenterAndZoom( [106.9370411668,27.7318344381],13); //修改地图中心点
let map=mainMap.getMap();
function createFe(data){
var n1=parseFloat(data.lon);
var n2=parseFloat(data.lat);
if(!n1||!n2){
return null;
}
var pa1=[];
pa1.push([n1,n2]);
var p1;
p1= new Point(pa1[0]);
p1.transform('EPSG:4326', 'EPSG:900913');
var f1= new Feature({
geometry: p1
});
return f1;
}
let heatmap;
function createHeatMap(data){
var source= new VectorSource();
for (let i=0;i<data.length;i++){
let f1=createFe(data[i]);
if(f1){
source.addFeature(f1);
}
}
//热度图
var blur = 15;
var radius = 5;
heatmap = new Heatmap({
source:source,
blur: parseInt(15, 10),
radius: parseInt(5, 10)
});
heatmap.set("name","heatmap");
heatmap.getSource().on('addfeature', function(event) {
var name = event.feature.get('name');
var magnitude = parseFloat(name.substr(2));
event.feature.set('weight', magnitude - 5);
});
heatmap.setVisible(false);
map.addLayer(heatmap);
}
// 弹出气泡方法 事件 obj 数据 layerName 图层名称
function popupWindow(evt, feature, layerName) {
let obj=feature.get("data");
if(!obj){
obj=feature;//说明是外部被动调用
}
var coordinate;
if(!evt){
//这时候需要定位 被动显示
// var coordinate = evt.event.coordinate;
var endCenter4326 = [obj.lon,obj.lat];
coordinate=transform(endCenter4326, 'EPSG:4326','EPSG:3857')
mainMap.setCenterAndZoom( endCenter4326,null);
}else{
//点击地图触发
coordinate = evt.event.coordinate;
}
mainMap.overlay.setPosition(transform(coordinate, 'EPSG:4326','EPSG:3857'));
}
obj.popupWindow=popupWindow;
return obj;
}
export {startDataClass}
This diff is collapsed.
/**
地图范围
*/
var mapMaxExtent=[-2.003750834E7, -2.003750834E7, 2.003750834E7,2.003750834E7];
/**
地图投影
*/
var mapPro="EPSG:900913";
/**
地图数据集
*/
var mapResoultion=[ 156543.03390625, 78271.516953125,39135.7584765625,19567.87923828125,9783.939619140625,4891.9698095703125 ,2445.9849047851562
,1222.9924523925781,611.4962261962891,305.74811309814453,152.87405654907226,76.43702827453613,38.218514137268066,19.109257068634033,
9.554628534317017,4.777314267158508,2.388657133579254,1.194328566789627,0.5971642833948135,0.2985821416974068,0.1492910708487034,0.0746455354243517,0.0373227677121759];
/**
创建地图
*/
import Map from 'ol/Map';
import View from 'ol/View';
import Tile from 'ol/layer/Tile';
import XYZ from 'ol/source/XYZ';
import {addProjection, addCoordinateTransforms, transform} from 'ol/proj';
import ZoomSlider from 'ol/control/ZoomSlider';
import FullScreen from 'ol/control/FullScreen';
import Overlay from 'ol/Overlay';
import {getCenter,containsExtent,intersects} from 'ol/extent.js';
import {defaults as defaultControls, ZoomToExtent} from 'ol/control.js';
function createMap(){
let obj={};
var map;
let overlay ;
/**
创建图层
*/
function createBaseLayerUrl(layerName,ex,url){
var getLayer = new Tile({
zoomOffset : 3,
extent: ex,
projection:mapPro,
type : 'base',
title : layerName,
source: new XYZ({
tileSize:[256,256],
url:url
})
});
getLayer.set("name",layerName);
return getLayer;
}
let limitExtent=null;
function setLimitExtent(extent){
limitExtent=extent
}
obj.setLimitExtent=setLimitExtent;
var limitCenter=null;
function setLimitCenter(center){
limitCenter=center
}
obj.setLimitCenter=setLimitCenter;
function limtMoveFunc(){
map.on('moveend', function(event) {
let curentCenter=[map.getView().getCenter()[0],map.getView().getCenter()[1]];
let endExtent= map.getView().calculateExtent(map.getSize());
if(limitCenter){
let isChange=false;
if(limitCenter[0]<endExtent[0]||limitCenter[0]>endExtent[2]){
curentCenter[0]=limitCenter[0];
isChange=true;
}
if(limitCenter[1]<endExtent[1]||limitCenter[1]>endExtent[3]){
curentCenter[1]=limitCenter[1];
isChange=true;
}
if(isChange){
map.getView().animate({center: curentCenter});
}
}else if(limitExtent){
let endCenter= getCenter(limitExtent);
//如果包含则没有关系
if(intersects(endExtent,limitExtent)){
}else{
map.getView().animate({center: endCenter});
}
}
});
}
/**
添加地图事件
*/
function addMapEvent(){
//添加限制区域
limtMoveFunc();
//单击 并获取feature的属性
map.on('singleclick', function(event) {
var l1=event.coordinate;
var l2=transform(l1,mapPro, 'EPSG:4326')
var isShow=false;
closePopupWindow(); //点击的如果是地图的话 关闭弹出框 先把他关闭掉
map.forEachFeatureAtPixel(event.pixel, function(feature, layer){
// 为选中的到的feature发送自定义的mousemove消息
if(isShow){
return;
}
let canClick=feature.get('singleclick');
if(feature&&canClick){
feature.dispatchEvent({type: 'singleclick', event: event});
isShow=true;
}else{
}
});
});
var target = map.getTarget();
var jTarget = typeof target === "string" ? $("#"+target) : $(target);
var lastTarget;
//map移动事件
map.on('pointermove', function(event){
if (event.dragging) {
return;
}
var hit=false;
var tempe = map.forEachFeatureAtPixel(event.pixel, function (feature, layer) {
return feature;
});
if(tempe){
hit=true;
}
if(tempe){
tempe.dispatchEvent({type: 'onMouseMoveOver', event: event});
lastTarget=tempe;
}else if(lastTarget){
lastTarget.dispatchEvent({type: 'onMouseMoveOut', event: event});
lastTarget=null;
}
if (hit) {
jTarget.css("cursor", "pointer");
} else {
jTarget.css("cursor", "");
}
});
map.getViewport().addEventListener('mouseout', function(evt) {
jTarget.css("cursor", "");
});
//地图改变事件 地图移动以及地图 中心点改变
map.on('moveend', function(event) {
if(zoomFunc){
var cc3857=map.getView().getCenter();
var t1=[cc3857[0],cc3857[1]];
zoomFunc(transform(t1,mapPro, 'EPSG:4326'),map.getView().getZoom());
}
});
}
var zoomFunc;
// 地图移动方法
function setMapChangeFunc(callFunc){
zoomFunc=callFunc;
}
obj.setMapChangeFunc=setMapChangeFunc;
/**
设置地图中心点以及级别 setCenterAndZoom([116.7,39.1],18);
*/
function setCenterAndZoom(lonlat,zoom){
if(lonlat){
map.getView().setCenter(transform( lonlat, 'EPSG:4326', 'EPSG:3857'));
}
if(zoom){
map.getView().setZoom(zoom)
}
}
/**
最大最小级别
*/
var maxResolution=611.4962261962891;
var minResolution=0.0746455354243517;
function setMaxMinZoom(minL,maxL){
if(mapResoultion[minL]){
maxResolution=mapResoultion[minL]
}
if(mapResoultion[maxL]){
minResolution=mapResoultion[maxL]
}
}
//设置最大最小级别
obj.setMaxMinZoom=setMaxMinZoom;
var startZoom=5;
//设置当前缩放级别
function setStartZoom(value){
startZoom=value;
}
obj.setStartZoom=setStartZoom;
/**
设置中心点
*/
var startCenter= [0, 0];
function setStartCenter(value){
startCenter=value;
}
obj.setStartCenter=setStartCenter;
/**
初始化方法
*/
function init(targetStr) {
map = new Map({
layers : [
],
target: targetStr,
controls: defaultControls({
attributionOptions: ({
collapsible: false
})
}),
view: new View({
center: transform(startCenter, 'EPSG:4326', mapPro),
zoom:startZoom,
minZoom: 8,
maxZoom: 13,
projection:mapPro,
// maxResolution:maxResolution,
// minResolution:minResolution//0.2985821416974068
})
});
var zoomslider = new ZoomSlider();
map.addControl(zoomslider);
map.addControl(new FullScreen());
//弹出气泡
var container = document.getElementById('popup');
var closer = document.getElementById('popup-closer');
closer.onclick = function() {
closePopupWindow();
closer.blur();
return false;
}
overlay= new Overlay(/** @type {olx.OverlayOptions} */ ({
element: container,
autoPan: false,
autoPanAnimation: {
duration: 250
}
}));
map.addOverlay(overlay);
obj.overlay=overlay;
addMapEvent();
}
function closePopupWindow(){
overlay.setPosition(undefined);
}
obj.closePopupWindow=closePopupWindow;
//恢复地图初始窗台 rezoom boolean 是否恢复地图初始级别,reCenter 是否恢复地图中心点 boolean
function recovery(reZoom,reCeter){
if(reCeter){
map.getView().setCenter(transform( startCenter, 'EPSG:4326', 'EPSG:3857'));
}
if(reZoom){
map.getView().setZoom(startZoom)
}
}
//恢复初始化方法
obj.recovery=recovery;
//设置中心点和级别
obj.setCenterAndZoom=setCenterAndZoom;
obj.init=init;
function getMap(){
return map;
}
obj.getMap=getMap;
//绘制多边形
return obj;
}
//新增
export {createMap}
/**
* Created by cp on 2018/7/2.
*/
// 定义类
class LayerFuncServer {
constructor(vueThis) {
this.vm = vueThis;//类中变量
}
//类中函数
getLayerByMapId(mapId,succFunc,failFunc){
var param=this.getSearchQuery();
let vm = this.vm;
var tempToken =this.token;
vm.$https({
url: 'layer/getAllLayerByMapId',
method: 'get',authType:tempToken
}, param).then((res) => {
if(succFunc){
succFunc(res);
}
}, (error) => {
vm.$message({message: res.data.message, type: 'error'});
if(failFunc){
failFunc();
}
})
}
//获取当前查询参数
getSearchQuery(){
let searchObj = {
}
if(this.mapId){
searchObj.mapId=this.mapId;
}
return searchObj
}
setMapId(tempMapId){
this.mapId=tempMapId;
}
setToken(tempToken){
this.token=tempToken;
}
deleteLayer(layerId,succFunc,failFunc){
let vm=this.vm;
var tempToken =this.token;
//删除活动事件
vm.$confirm('此操作将删除该图层, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning',
}).then(() => {
vm.$https({
url:'/layer/delete?id='+layerId,
method:'delete',authType:tempToken,
},{})
.then((res) => {
let data=res.data;
//重新查询数据
if(res.data.status==200||res.data.status==201||res.data.status==203||res.data.status==204){
vm.$message({
type: 'success',
message: '删除成功!'
});
if(succFunc){
succFunc();
}
}else {
vm.$message({
type: 'fail',
message: data
});
}
},(error) => {
vm.$message({
type: 'fail',
message: "删除用户失败!"+error.response.data
});
}
)
}).catch(() => {
this.$message({
type: 'info',
message: '已取消删除'
});
});
}
addLayer(searchObj,succFunc,failFunc) {
var vm= this.vm;
if(!searchObj.mapId){
searchObj.mapId=this.mapId;
}
var param= vm.$querystring.stringify(searchObj);
var tempToken =this.token;
if(searchObj.id&&searchObj.id!=""){
vm.$https({
url:'/layer/edit',
method:'put',authType:tempToken,
},param)
.then((res) => {
if(succFunc){
succFunc(res);
}
}, (error) => {
vm.$message({message: error.data.message, type: 'error'});
if(failFunc){
failFunc(error);
}
}
)
}else{
vm.$https({
url:'/layer/add',
method:'post',authType:tempToken,
}, param)
.then((res) => {
if(succFunc){
succFunc(res);
}
}, (error) => {
vm.$message({message: error.data.message, type: 'error'});
if(failFunc){
failFunc(error);
}
}
)
}
}
}
//静态变量
// Point.para = 'Allen';
export {LayerFuncServer};
/**
* Created by cp on 2016/8/25.
*/
var mapResoultion=[ 156543.03390625, 78271.516953125,39135.7584765625,19567.87923828125,9783.939619140625,4891.9698095703125 ,2445.9849047851562
,1222.9924523925781,611.4962261962891,305.74811309814453,152.87405654907226,76.43702827453613,38.218514137268066,19.109257068634033,
9.554628534317017,4.777314267158508,2.388657133579254,1.194328566789627,0.5971642833948135,0.2985821416974068,0.1492910708487034,0.0746455354243517,0.0373227677121759];
import WKT from 'ol/format/WKT';
import Icon from 'ol/style/Icon';
import CircleStyle from 'ol/style/Circle';
import Style from 'ol/style/Style';
import Fill from 'ol/style/Fill';
import Stroke from 'ol/style/Stroke';
import Text from 'ol/style/Text';
import Circle from 'ol/geom/Circle';
import Feature from 'ol/Feature';
import {Tile as TileLayer, Vector as VectorLayer} from 'ol/layer';
import {OSM, Vector as VectorSource} from 'ol/source';
function BaseLayer(map,maxL,minL,layerName,vueThis){
var map =map;
var obj={};
let layerId=layerName;
var maxResolution=611.4962261962891;
var minResolution=0.0373227677121759;
if(mapResoultion[maxL]){
maxResolution=mapResoultion[maxL]
}
if(mapResoultion[minL]){
minResolution=mapResoultion[minL]
}
var pLayer;
var pSource;
//面的图层
pLayer=getLyaersByName(layerName)
if(pLayer){
pSource=pLayer.getSource();
}
if(!pLayer){
pSource = new VectorSource();
pLayer = new VectorLayer({
zIndex:10,
id:layerName,
source: pSource,
minResolution:minResolution,
maxResolution:maxResolution
});
pLayer.set("name",layerName);
map.addLayer(pLayer);
}
function clean(){
pSource.clear();
}
obj.clean=clean;
function getLayer(){
return pLayer;
}
obj.getLayer=getLayer;
function addFeatureArr(dataArr){
$(dataArr).each(function(i,val) {
addfeature(val);
});
}
obj.addFeatureArr=addFeatureArr;
function getFeatureById(tempId){
var features=pSource.getFeatures();
var reArr=[];
for(var i=0;i<features.length;i++){
var f1=features[i];
var currId= f1.getId();
if(currId==tempId){
reArr.push(f1);
}
}
return reArr;
}
obj.getFeatureById=getFeatureById;
function removeFeatureById(tempid){
var reArr=[];
reArr=getFeatureById(tempid);
$(reArr).each(function(k,val) {
pSource.removeFeature(val);
})
}
obj.removeFeatureById=removeFeatureById;
//WKT转换
let wktFormat = new WKT();
function addfeature(data){
if(data.coordinate){
data.wkt=data.coordinate;
}
if(!data.wkt){
return ;
}
let feature ;
let styleObj={};
// {"strokeColor":"#F8FAFB","strokeWeight":9,"strokeAlpha":0.51,"fillAlpha":0.7,"fillColor":"#994B4B","fileRadio":18,"imageSrc":null,"lineDash":1,"type":"Polygon"}
data.isPoint=false;
feature = wktFormat.readFeature(data.wkt, {
dataProjection: 'EPSG:4326',
featureProjection: 'EPSG:3857'
});
if(data.type==vueThis.POINT_TYPE){
data.isPoint=true;
styleObj.icon=data.imageUrl;
styleObj.width=data.width;
styleObj.hight=data.hight;
} else{
styleObj=JSON.parse( '{"strokeColor":"#F8FAFB","strokeWeight":2,"strokeAlpha":0.51,"fillAlpha":0.7,"fillColor":"#994B4B","fileRadio":18,"imageSrc":null,"lineDash":1,"type":"Polygon"}');
}
feature.setId(data.id);//存数据库中的ID feature如果是从数据库中读取此ID必须有,不然会出现编辑错误
if(data.maxZoom){
feature.set("maxZoom",data.maxZoom);
}
data.layerId=layerId;
feature.set("data",data,false);//data改变不触发事件
feature.setStyle( getStyle(styleObj,data.isPoint));
pSource.addFeature(feature);
featureAddevent(feature);
}
//图层点击的回调方法
var clickCallBackFunc;
function setCallbackFunc(fun){
clickCallBackFunc=fun;
}
obj.setCallbackFunc=setCallbackFunc;
function featureAddevent(f1){
f1.on('singleclick', function(event){
//添加鼠标点击事件的方法
clickCallBackFunc(event,f1,layerName);
});
f1.set('singleclick',true);//标识改点存在点击事件
f1.on('onMouseOver', function(event){
//添加鼠标点击事件的方法
});
f1.on('onMouseOut', function(event){
//添加鼠标点击事件的方法
});
f1.on('onMouseMoveOver', function(event){
//添加鼠标点击事件的方法
if(tootipFunc){
tootipFunc(event,f1,layerName);
}
});
}
obj.addfeature=addfeature;
var tootipFunc;
function setShowTootip(func){
tootipFunc=func;
}
obj.setShowTootip=setShowTootip;
//面的样式
//面的样式
function getStyle(styleData,isPoint){
if(styleData.fillColor){
styleData.fillColor = styleData.fillColor.colorRgba(styleData.fillAlpha);
}
if(styleData.strokeColor){
styleData.strokeColor = styleData.strokeColor.colorRgba(styleData.strokeAlpha);
}
var tempPointStyle;
//如果是点;
let drawStyle;
if(isPoint){
if(styleData.icon&&styleData.icon!=""){
tempPointStyle= new Icon(({
anchor: [0.5, 0.5],
// size:[styleData.width,styleData.height],
src: styleData.icon,
opacity:1
}));
}else{
tempPointStyle=new CircleStyle({
radius:styleData.fileRadio,
fill: new Fill({
color: styleData.fillColor
}),
stroke: new Stroke({
color:styleData.strokeColor,
width: styleData.strokeWeight
})
})
}
drawStyle=new Style({
image:tempPointStyle
})
}else{
let storkobj={};
storkobj.color=styleData.strokeColor;
storkobj.width=styleData.strokeWeight;
if(styleData.lineDash&&styleData.lineDash!=null){
storkobj.lineDash=getLineDash(styleData.lineDash);
}
storkobj.lineCap="round";
drawStyle=new Style({
stroke: new Stroke(storkobj),
fill: new Fill({
color:styleData.fillColor
}),
})
}
return drawStyle;
}
function getLineDash(dashType){
let endArr=[0];
// vueThis.lineDashArr.forEach(function(item,index){
// if(dashType==item.type){
// endArr=item.dashArr;
// return false ;
// }
// })
return false;
// return endArr;
}
function setFontStyle(styObj){
var align ="center";
var baseline = "top";
var size ="14px";
var offsetX = 0;
var offsetY = 0;
var weight ="bold";
var rotation = 0;
var font = weight + ' ' + size + ' ' + "Verdana";
var fillColor = "#444444";
var outlineColor ="#ffffff";
var outlineWidth =1;
var fillAlpha=1;
var strokeAlpha=1;
styObj.fillColorRgba = fillColor.colorRgba(styObj.fillAlpha);
styObj.outlineColorRgba= outlineColor.colorRgba(styObj.strokeAlpha);
styObj.font = styObj.weight + ' ' + styObj.size+"px" + ' ' + "Verdana";
}
obj.setFontStyle=setFontStyle;
//赋予文字信息
var createTextStyle = function(data) {
let textLabel=data.name;
if(!textLabel||textLabel==""){
return null;
}
var fezoom=data.maxZoom;
if(fezoom){
var mapRe=map.getView().getResolution();
var feRe=mapResoultion[fezoom]
if(mapRe<feRe){
} else{
textLabel="";
}
}
let textFont =data.weight + ' ' + data.size+"px" + ' ' + data.font;
return new Text({
textAlign: data.align,
textBaseline: data.baseline,
font: textFont,
text: textLabel,
fill: new Fill({color: data.fillColor}),
stroke: new Stroke({color: data.outlineColor, width: data.outlineWidth}),
offsetX: data.offsetX,
offsetY: data.offsetY,
rotation: data.rotation
});
};
var getText = function(feature, resolution) {
var type ="normal";
var maxResolution = "1200";
var text = feature.get('name');
if (resolution > maxResolution) {
text = '';
} else if (type == 'hide') {
text = '';
} else if (type == 'shorten') {
text = text.trunc(12);
} else if (type == 'wrap') {
text = stringDivider(text, 16, '\n');
}
return text;
};
//判断图层是否存在
function getLyaersByName(layerName){
var arrGroup=map.getLayerGroup().getLayers().getArray();
for(var j=0;j<arrGroup.length;j++){
var tempobj=arrGroup[j];
//lk 图层组 className
//H 图层
var classType=tempobj.constructor.name;
var isArr=false;
if(tempobj.getLayers&&tempobj.getLayers()){
isArr=true;
}
if(!isArr){
//适量图层
if(tempobj.get("name")&&tempobj.get("name")==layerName){
//存在
return tempobj;
}
}else if(isArr){
//s数组
var arr1s=tempobj.getLayers().getArray();
for(var i=0;i<arr1s.length;i++){
var layer1=arr1s[i];
if(layer1.get("name")&&layer1.get("name")==layerName){
//存在
return layer1;
}
}
}
}
return null;
}
return obj;
}
export {BaseLayer}
.btn{ padding: 6px 10px; border-radius: 2px; cursor: pointer;}
.btn+.btn{
margin-left: 10px;
}
.mapClass{}
.ol-attribution a{color:#000;display:none}
#mapDict .ol-zoomslider:hover{display:none}
#mapDict .ol-zoomslider-thumb,
#map .ol-zoomslider-thumb,
.map-box .ol-zoomslider-thumb{display:none}
.ol-popup{position:absolute;background-color:#fff;-webkit-filter:drop-shadow(0 1px 4px rgba(0, 0, 0, .2));bottom:10px;left:-140px;min-width:280px;color:#333; border-radius: 4px; } /*overflow: hidden;*/
.ol-popup:after,.ol-popup:before{top:100%;border:solid transparent;content:" ";height:0;width:0;position:absolute;pointer-events:none}
.ol-popup:after{border-top-color:#fff;border-width:10px;left:140px;margin-left:-10px}
.ol-popup:before{border-top-color:#ccc;border-width:11px;left:140px;margin-left:-11px}
.ol-popup.portlet.box.blue{background:#fff;/*margin-left:-95px*/}
.ol-popup.portlet.box.blue .portlet-title{min-height:30px;background: #21a0ff;color: #fff;padding-left: 10px;}
.ol-popup.portlet.box.blue>.portlet-title>.caption{padding:6px 0 5px 0;}
.ol-popup.portlet.box.blue>.portlet-title>.caption span{font-size:16px}
.ol-popup.portlet.box.blue .portlet-title i.icon{width:30px;height:30px;margin-top:-6px}
#popup-content{background:#fff;padding:10px}
#popup-content p{ margin-bottom: 10px;}
#popup-content p code{ color: #666; padding-left: 10px;}
#popup-content .btn.btn-info{background-color:#207dca!important}
#popup-content img{float:right}
#poptitle{margin-right:40px;}
.ol-popup-closer{text-decoration:none;position:absolute;top:5px;right:8px}
/*.ol-popup-closer:after{content:"✖";color:#fff}*/
.ol-popup-closer:after{content:"×";color:#fff; font-weight: bold;}
/*.ol-full-screen{display:display}*/
code{border:0PX;background-color:#FFF;color:#333;font-family:microsoft yahei;box-shadow:0 0 0 rgba(0,0,0,.1)}
h4{font-size:16px}
body .gisgroup img{height:90px;}
#picUrl{float: right;margin-right:8px}
#picUrl a{display: inline-block;}
#dkLable{
position:absolute;top:0;right:2px;z-index: 999;background-color: rgba(255,255,255,.85);box-shadow: 0px 0px 5px rgba(0,0,0,.2); border-radius:8px;display:none;font-size:12px;
padding: 2px;
}
#dkLable .rebasis{display: inline-block;text-align: center;}
.ol-viewport{ overflow: visible !important;}
.ol-box {
box-sizing: border-box;
border-radius: 2px;
border: 2px solid blue;
}
.ol-mouse-position {
top: 8px;
right: 8px;
position: absolute;
}
.ol-scale-line {
background: rgba(0,60,136,0.3);
border-radius: 4px;
bottom: 8px;
left: 8px;
padding: 2px;
position: absolute;
}
.ol-scale-line-inner {
border: 1px solid #eee;
border-top: none;
color: #eee;
font-size: 10px;
text-align: center;
margin: 1px;
will-change: contents, width;
}
.ol-overlay-container {
will-change: left,right,top,bottom;
}
/*.ol-unsupported {*/
/*display: none;*/
/*}*/
.ol-viewport .ol-unselectable {
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: rgba(0,0,0,0);
}
.ol-control {
position: absolute;
border-radius: 4px;
padding: 0;
}
.ol-control:hover {
background-color: rgba(255,255,255,0.6);
}
.ol-zoom {
/*top: 80px;*/
/*top: 74px;*/
top: 39px;
right: 7px;
}
.ol-rotate {
top: .5em;
right: .5em;
transition: opacity .25s linear, visibility 0s linear;
}
.ol-rotate.ol-hidden {
opacity: 0;
visibility: hidden;
transition: opacity .25s linear, visibility 0s linear .25s;
}
.ol-zoom-extent {
top: 4.643em;
left: .5em;
}
.ol-full-screen {
right: .5em;
top: .5em;
}
@media print {
.ol-control {
display: none;
}
}
.ol-control button {
display: block;
margin: 2px 0;
padding: 0;
color: white;
font-size: 1.14em;
font-weight: bold;
text-decoration: none;
text-align: center;
height: 30px;
width: 30px;
line-height: .4em;
background-color: rgba(0,60,136,0.5);
border: none;
border-radius: 2px;
}
/*.ol-control button.ol-full-screen-false{*/
/*position: absolute;*/
/*top:0;*/
/*right:0;*/
/*z-index: 1;*/
/*margin-top: -40px;*/
/*width: 27px;*/
/*height: 27px;*/
/*background-color: transparent !important;*/
/*border: 1px solid #fff;*/
/*border-radius: 25px;*/
/*}*/
.ol-control button::-moz-focus-inner {
border: none;
padding: 0;
}
.ol-zoom-extent button {
line-height: 1.4em;
}
.ol-compass {
display: block;
font-weight: normal;
font-size: 1.2em;
will-change: transform;
}
.ol-touch .ol-control button {
font-size: 1.5em;
}
.ol-touch .ol-zoom-extent {
top: 5.5em;
}
.ol-control button:hover,
.ol-control button:focus {
text-decoration: none;
background-color: #2469a4;
}
.ol-zoom .ol-zoom-in {
border-radius: 2px 2px 0 0;
}
.ol-zoom .ol-zoom-out {
border-radius: 0 0 2px 2px;
}
.ol-attribution {
text-align: right;
bottom: .5em;
right: .5em;
max-width: calc(100% - 1.3em);
}
.ol-attribution ul {
margin: 0;
padding: 0 .5em;
font-size: .7rem;
line-height: 1.375em;
color: #000;
text-shadow: 0 0 2px #fff;
}
.ol-attribution li {
display: inline;
list-style: none;
line-height: inherit;
}
.ol-attribution li:not(:last-child):after {
content: " ";
}
.ol-attribution img {
max-height: 2em;
max-width: inherit;
vertical-align: middle;
}
.ol-attribution ul, .ol-attribution button {
display: inline-block;
}
.ol-attribution.ol-collapsed ul {
display: none;
}
.ol-attribution.ol-logo-only ul {
display: block;
}
.ol-attribution:not(.ol-collapsed) {
background: rgba(255,255,255,0.8);
}
.ol-attribution.ol-uncollapsible {
bottom: 0;
right: 0;
border-radius: 4px 0 0;
height: 1.1em;
line-height: 1em;
}
.ol-attribution.ol-logo-only {
background: transparent;
bottom: .4em;
height: 1.1em;
line-height: 1em;
}
.ol-attribution.ol-uncollapsible img {
margin-top: -.2em;
max-height: 1.6em;
}
.ol-attribution.ol-logo-only button,
.ol-attribution.ol-uncollapsible button {
display: none;
}
.ol-zoomslider {
top: 10em;
right: .5em;
height: 200px;
}
.ol-zoomslider button {
position: relative;
height: 10px;
}
.ol-touch .ol-zoomslider {
top: 5.5em;
}
.ol-overviewmap {
right: 7px;
bottom: 7px;
}
.ol-overviewmap.ol-uncollapsible {
bottom: 0;
left: 0;
border-radius: 0 4px 0 0;
}
.ol-overviewmap .ol-overviewmap-map,
.ol-overviewmap button {
display: inline-block;
}
.ol-overviewmap .ol-overviewmap-map {
border: 1px solid #546B88;
height: 100px;
margin: 0;
width: 150px;
}
.ol-overviewmap:not(.ol-collapsed) button{
bottom: 0px;
right: 0px;
position: absolute;
}
.ol-overviewmap.ol-collapsed .ol-overviewmap-map,
.ol-overviewmap.ol-uncollapsible button {
display: none;
}
.ol-overviewmap:not(.ol-collapsed) {
background: rgba(255,255,255,0);
height: 100px;
}
.ol-overviewmap-box {
border: 2px dotted rgba(0,60,136,0.7);
}
/**
* Created by cp on 2018/8/20.
*/
/**
* Created by cp on 2018/7/2.
*/
import Map from 'ol/Map.js';
import {unByKey} from 'ol/Observable.js';
import Overlay from 'ol/Overlay.js';
import {getArea, getLength} from 'ol/sphere.js';
import {LineString, Polygon} from 'ol/geom.js';
import Draw from 'ol/interaction/Draw.js';
import { Vector as VectorLayer} from 'ol/layer.js';
import { Vector as VectorSource} from 'ol/source.js';
import {Circle as CircleStyle, Fill, Stroke, Style} from 'ol/style.js';
// 定义类
class Measure {
constructor(vueThis, mainMap) {
this.vm = vueThis;//类中变量
this.name='measure';
if (mainMap) {
this.map = mainMap.getMap();//地图
this.mainMap = mainMap;
}
this.init();
}
/****初始化方法****/
init(){
let source = new VectorSource();
let vector = new VectorLayer({
source: source,
style: new Style({
fill: new Fill({
color: 'rgba(255, 255, 255, 0.2)'
}),
stroke: new Stroke({
color: '#ffcc33',
width: 2
}),
image: new CircleStyle({
radius: 7,
fill: new Fill({
color: '#ffcc33'
})
})
})
});
vector.set("name",this.name);
this.source=source;
this.vector=vector;
this.startMeasureStatus=false;//是否在绘制 初始化时候并不在绘制
this.map.addLayer(vector);
/**
* Currently drawn feature.
* @type {module:ol/Feature~Feature}
*/
this.sketch=null;
/**
* The help tooltip element.
* @type {Element}
*/
this.helpTooltipElement=null;
/**
* Overlay to show the help messages.
* @type {module:ol/Overlay}
*/
this.helpTooltip=null;
/**
* The measure tooltip element.
* @type {Element}
*/
this.measureTooltipElement=null;
/**
* Overlay to show the measurement.
* @type {module:ol/Overlay}
*/
this.measureTooltip=null;
/**
* Message to show when the user is drawing a polygon.
* @type {string}
*/
this.continuePolygonMsg = '双击结束绘制';
/**
* Message to show when the user is drawing a line.
* @type {string}
*/
this.continueLineMsg = '双击结束绘制';
//初始化样式
this.initStyle();
}
/**
* Handle pointer move.
* @param {module:ol/MapBrowserEvent~MapBrowserEvent} evt The event.
*/
pointerMoveHandler(evt) {
if (evt.dragging) {
return;
}
/** @type {string} */
var helpMsg = '开始绘制';
if (this.sketch) {
var geom = (this.sketch.getGeometry());
if (geom instanceof Polygon) {
helpMsg = this.continuePolygonMsg;
} else if (geom instanceof LineString) {
helpMsg = this.continueLineMsg;
}
}
this.helpTooltipElement.innerHTML = helpMsg;
this.helpTooltip.setPosition(evt.coordinate);
this.helpTooltipElement.classList.remove('hidden');
};
/****添加地图监听事件****/
addMapEvent(){
let classThis=this;
let mapPointermove=classThis.map.on('pointermove', function(evt){
classThis.pointerMoveHandler(evt);
});
let mapMouseout =classThis.map.getViewport().addEventListener('mouseout', function() {
classThis.helpTooltipElement.classList.add('hidden');
});
this.mapPointermove=mapPointermove;
this.mapMouseout=mapMouseout;
}
removeMapLisenter(){
if(this.mapPointermove||this.mapMouseout){
unByKey(this.mapPointermove);
unByKey(this.mapMouseout);
this.mapPointermove=null;
this.mapMouseout=null;
this.helpTooltipElement.innerHTML = "请选择绘制的点";
this.helpTooltipElement.className = 'tooltip hidden';
}
this.startMeasureStatus=false;
}
/**
* Format length output.
* @param {module:ol/geom/LineString~LineString} line The line.
* @return {string} The formatted length.
*/
formatLength(line) {
var length = getLength(line);
var output;
if (length > 100) {
output = (Math.round(length / 1000 * 100) / 100) +
' ' + 'km';
} else {
output = (Math.round(length * 100) / 100) +
' ' + 'm';
}
return output;
};
/**
* Format area output.
* @param {module:ol/geom/Polygon~Polygon} polygon The polygon.
* @return {string} Formatted area.
*/
formatArea(polygon) {
var area =getArea(polygon);
var output;
if (area > 10000) {
output = (Math.round(area / 1000000 * 100) / 100) +
' ' + 'km<sup>2</sup>';
} else {
output = (Math.round(area * 100) / 100) +
' ' + 'm<sup>2</sup>';
}
return output;
};
initStyle(){
let style = new Style({
fill: new Fill({
color: 'rgba(255, 255, 255, 0.5)'
}),
stroke: new Stroke({
color: 'rgba(0, 0, 0, 0.5)',
lineDash: [10, 10],
width: 2
}),
image: new CircleStyle({
radius: 5,
stroke: new Stroke({
color: 'rgba(0, 0, 0, 0.7)'
}),
fill: new Fill({
color: 'rgba(255, 255, 255, 0.2)'
})
})
});
this.style=style;
}
/*** 绘制的方法 类型有两种
* 'Polygon'
* 'LineString'
* ****/
addInteraction(type){
let classThis=this;
let draw = new Draw({
source: classThis.source,
type: type,
style:classThis.style
});
classThis.map.addInteraction(draw);
classThis.createMeasureTooltip();
classThis.createHelpTooltip();
let listener;
draw.on('drawstart',
function(evt) {
// set sketch
classThis.sketch = evt.feature;
/** @type {module:ol/coordinate~Coordinate|undefined} */
var tooltipCoord = evt.coordinate;
listener = classThis.sketch.getGeometry().on('change', function(evt) {
var geom = evt.target;
var output;
if (geom instanceof Polygon) {
output = classThis.formatArea(geom);
tooltipCoord = geom.getInteriorPoint().getCoordinates();
} else if (geom instanceof LineString) {
output = classThis.formatLength(geom);
tooltipCoord = geom.getLastCoordinate();
}
classThis.measureTooltipElement.innerHTML = output;
classThis.measureTooltip.setPosition(tooltipCoord);
});
});
draw.on('drawend',
function() {
classThis.measureTooltipElement.className = 'tooltip tooltip-static';
classThis.measureTooltip.setOffset([0, -7]);
// unset sketch
classThis.sketch = null;
// unset tooltip so that a new one can be created
classThis.measureTooltipElement = null;
unByKey(listener);
classThis.endDraw();
classThis.removeMapLisenter();
});
this.draw=draw;
}
/**
* Creates a new help tooltip
*/
createHelpTooltip() {
if (this.helpTooltipElement) {
this.helpTooltipElement.parentNode.removeChild(this.helpTooltipElement);
}
this.helpTooltipElement = document.createElement('div');
this.helpTooltipElement.className = 'tooltip hidden';
this.helpTooltip = new Overlay({
element: this.helpTooltipElement,
offset: [15, 0],
positioning: 'center-left'
});
this.map.addOverlay(this.helpTooltip);
}
/**
* Creates a new measure tooltip
*/
createMeasureTooltip() {
let classThis=this;
if (classThis.measureTooltipElement) {
classThis.measureTooltipElement.parentNode.removeChild(classThis.measureTooltipElement);
}
classThis.measureTooltipElement = document.createElement('div');
classThis.measureTooltipElement.className = 'tooltip tooltip-measure';
classThis.measureTooltip = new Overlay({
element: classThis.measureTooltipElement,
offset: [0, -15],
positioning: 'bottom-center'
});
classThis.map.addOverlay(classThis.measureTooltip);
}
cleanMeasure(){
this.endDraw();
this.removeMapLisenter();
this.map.removeOverlay(this.helpTooltip);
this.map.removeOverlay(this.measureTooltip);
if(this.measureTooltipElement){
this.measureTooltipElement.innerHTML = "";
}
if(this.helpTooltipElement){
this.helpTooltipElement.innerHTML = "";
}
this.clanLayer();
}
clanLayer(){
this.vector.getSource().clear();
}
/****结束的接口***/
endDraw(){
let classThis=this;
if(classThis.draw){
this.map.removeInteraction(classThis.draw);
classThis.draw=null;
}
}
/****测量开始的接口***/
startMeasure(type){
if(!this.startMeasureStatus){
this.addMapEvent();
this.startMeasureStatus=true;
}
this.endDraw();
this.addInteraction(type);
}
}
// Measure.para = 'Allen'; 静态变量
export {Measure};
...@@ -11,11 +11,8 @@ import moment from 'moment' ...@@ -11,11 +11,8 @@ import moment from 'moment'
import Vuex from 'vuex' import Vuex from 'vuex'
import qs from 'qs' import qs from 'qs'
import axios from 'axios' import axios from 'axios'
import {baseUrl,weUrl,backToken,frontToken, appHomeUrl,skipLinkUrl} from './config/env' import {backToken} from './config/env'
import http from './config/httpServer' import http from './config/httpServer'
import store from './store/'
import {shortcuts} from './common/js/commonJs'
import VueDND from 'awe-dnd'
import echarts from 'echarts' import echarts from 'echarts'
import Video from 'video.js' import Video from 'video.js'
...@@ -23,11 +20,7 @@ import 'video.js/dist/video-js.css' ...@@ -23,11 +20,7 @@ import 'video.js/dist/video-js.css'
Vue.prototype.$echarts = echarts Vue.prototype.$echarts = echarts
//引入编辑器
import '../static/ueditor/ueditor.config.js'
import '../static/ueditor/ueditor.all.js'
import '../static/ueditor/themes/default/css/ueditor.min.css'
import '../static/ueditor/lang/zh-cn/zh-cn.js'
// 引入JsPdf // 引入JsPdf
import exportToPdf from "@/utils/exportToPdf" import exportToPdf from "@/utils/exportToPdf"
...@@ -44,17 +37,9 @@ Vue.prototype.$querystring = qs//其他的代码用到比较多 就新增一个 ...@@ -44,17 +37,9 @@ Vue.prototype.$querystring = qs//其他的代码用到比较多 就新增一个
Vue.prototype.$qs = qs Vue.prototype.$qs = qs
Vue.prototype.$http = axios Vue.prototype.$http = axios
Vue.prototype.$https = http Vue.prototype.$https = http
Vue.prototype.$store = store
Vue.prototype.$baseUrl=baseUrl
Vue.prototype.$weUrl=weUrl
Vue.prototype.$appHomeUrl=appHomeUrl
Vue.prototype.$skipLinkUrl=skipLinkUrl
Vue.prototype.backToken=backToken Vue.prototype.backToken=backToken
Vue.prototype.frontToken=frontToken
Vue.prototype.moment = moment Vue.prototype.moment = moment
Vue.prototype.shortcuts = shortcuts;
Vue.use(VueDND)
Vue.use(ElementUI); Vue.use(ElementUI);
Vue.use(Vuex); Vue.use(Vuex);
Vue.config.productionTip = false Vue.config.productionTip = false
...@@ -63,7 +48,6 @@ Vue.config.productionTip = false ...@@ -63,7 +48,6 @@ Vue.config.productionTip = false
new Vue({ new Vue({
el: '#app', el: '#app',
router, router,
store,
components: { App }, components: { App },
template: '<App/>' template: '<App/>'
}) })
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
:feildList="feildList" :feildList="feildList"
:list="list" :list="list"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
......
...@@ -46,6 +46,7 @@ ...@@ -46,6 +46,7 @@
:feildList="feildList" :feildList="feildList"
:list="list" :list="list"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
...@@ -67,7 +68,7 @@ export default { ...@@ -67,7 +68,7 @@ export default {
{ label: "待初审", value: "TBC" }, { label: "待初审", value: "TBC" },
{ label: "驳回", value: "REFUSED" }, { label: "驳回", value: "REFUSED" },
{ label: "待复审", value: "TBCA" }, { label: "待复审", value: "TBCA" },
{ label: "通过", value: "APPROVED_FINAL" } { label: "通过", value: "APPROVED_FINAL" },
], ],
feildList: [ feildList: [
{ prop: "content", label: "账号名称" }, { prop: "content", label: "账号名称" },
...@@ -84,8 +85,8 @@ export default { ...@@ -84,8 +85,8 @@ export default {
_size: 10, _size: 10,
total: 0, total: 0,
}, },
type:'ACCOUNT', type: "ACCOUNT",
passStatus:'APPROVED_FINAL' passStatus: "APPROVED_FINAL",
//待初审 TBC, 驳回 REFUSED, 待复审 TBCA, 通过APPROVED_FINAL //待初审 TBC, 驳回 REFUSED, 待复审 TBCA, 通过APPROVED_FINAL
}; };
}, },
...@@ -101,7 +102,7 @@ export default { ...@@ -101,7 +102,7 @@ export default {
handleReset() { handleReset() {
this.form.name = ""; this.form.name = "";
this.form.status = ""; this.form.status = "";
this.getFirstPageList() this.getFirstPageList();
}, },
// 获取第一页数据列表 // 获取第一页数据列表
...@@ -170,12 +171,12 @@ export default { ...@@ -170,12 +171,12 @@ export default {
// 通过 // 通过
handlePass() { handlePass() {
let params = {}; let params = {};
let _this = this let _this = this;
params.id = this.activeRow.id; params.id = this.activeRow.id;
params.status = this.passStatus; params.status = this.passStatus;
params.type = this.type params.type = this.type;
params.refItemId = this.activeRow.refItemId params.refItemId = this.activeRow.refItemId;
params.level = this.activeRow.status params.level = this.activeRow.status;
this.$https( this.$https(
{ {
......
...@@ -47,6 +47,7 @@ ...@@ -47,6 +47,7 @@
:feildList="feildList" :feildList="feildList"
:list="list" :list="list"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
......
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
:feildList="feildList" :feildList="feildList"
:list="list" :list="list"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
...@@ -105,7 +106,7 @@ export default { ...@@ -105,7 +106,7 @@ export default {
this.getPageList(); this.getPageList();
}, },
handleSubmit() { handleSubmit() {
this.getFirstPageList(); this.getFirstPageList();
}, },
handleReset() { handleReset() {
this.form.userName = ""; this.form.userName = "";
...@@ -147,7 +148,7 @@ export default { ...@@ -147,7 +148,7 @@ export default {
console.log(err); console.log(err);
}); });
}, },
// 页面返回值为空 // 页面返回值为空
getResWithOutData() { getResWithOutData() {
this.list = []; this.list = [];
this.page = { this.page = {
......
...@@ -58,6 +58,7 @@ ...@@ -58,6 +58,7 @@
:feildList="feildList" :feildList="feildList"
:list="list" :list="list"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
......
...@@ -34,6 +34,7 @@ ...@@ -34,6 +34,7 @@
:list="list" :list="list"
:rolesList="rolesList" :rolesList="rolesList"
@action="handleAction" @action="handleAction"
:currentPage="page._index"
/> />
<party-pagination :page="page" @changePage="handleChangeCurrent" /> <party-pagination :page="page" @changePage="handleChangeCurrent" />
</div> </div>
......
<template>
<div class="analysisPage H100">
<div class="form_box">
<el-form :inline="true" class="search-form">
<el-form-item>
<span>查询条件</span>
</el-form-item>
<el-form-item>
<el-date-picker style="margin: 10px 0px 0px;"
v-model="value7"
type="daterange"
@change="getProcessDateItem"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd">
</el-date-picker>
</el-form-item>
<el-form-item class="r-float">
<el-button size="mini" type="primary" @click="onSearchs()">查询</el-button>
<el-button size="mini" :type="primary1" @click="onSearch('year')"></el-button>
<el-button size="mini" :type="primary2" @click="onSearch('month')"></el-button>
<el-button size="mini" :type="primary3" @click="onSearch('day')"></el-button>
</el-form-item>
</el-form>
</div>
<div id="myChart" ></div>
</div>
</template>
<script>
import echarts from 'echarts'
export default {
data() {
return {
value7: '',
primary1:'primary',
primary2:'',
primary3:'',
series:{},
dateType:[],
typeName:[],
startDate: '',
endDate: '',
statisticsType: '',
timeType: '',
}
},
computed: {},
mounted() {
this.onSearch('year');
},
components: {},
methods: {
getProcessDateItem(val){
if(val){
if(val.length !== 0){
this.startDate = val[0];
this.endDate = val[1];}
}else{
this.startDate = '';
this.endDate = '';
}
},
onSearchs(){
this.onSearch(this.statisticsType);
},
initGenderChart(){
let myChart = echarts.init(document.getElementById('myChart'));
const option= {
title: {
text: '页面访问量统计'
},
grid: {
bottom: 80
},
// tooltip: {
// trigger: 'axis'
// },
tooltip : {
trigger: 'axis',
},
legend: {
top: 5,
// data: ['业务办理助手','网点服务地图','热门产品','热门活动'],
data: this.typeName,
},
xAxis: {
type: 'category',
boundaryGap: false,
data: this.dateType,
name: '日期('+this.timeType+')',
minInterval: 1,
axisTick: {
show: false
},
},
yAxis: {
type: 'value',
name: '访问量:',
minInterval: 1,
axisTick: {
show: false
},
},
dataZoom: [
{
type: 'slider',//图表下方的伸缩条
show : true, //是否显示
realtime : true, //
start : 0, //伸缩条开始位置(1-100),可以随时更改
end : 100, //伸缩条结束位置(1-100),可以随时更改
},
],
series: [{
// name:'业务办理助手',
name:this.typeName[0],
data: this.series[0].data,
type: 'line',
smooth: true,
color: '#E6A23C',
areaStyle: {
color: '#E6A23C',
}
},{
// name:'网点服务地图',
name:this.typeName[1],
data: this.series[1].data,
type: 'line',
smooth: true,
color: '#aaC7E2',
areaStyle: {
color: '#aaC7E2',
}
},{
// name:'热门产品',
name:this.typeName[2],
data: this.series[2].data,
type: 'line',
smooth: true,
color: '#67C23A',
areaStyle: {
color: '#67C23A',
}
},{
// name:'热门活动',
name:this.typeName[3],
data: this.series[3].data,
type: 'line',
smooth: true,
color: '#dd5861',
areaStyle: {
color: '#dd5861',
}
}]
};
myChart.setOption(option);
},
onSearch(statisticsType){
if(statisticsType == 'year'){
this.primary1='primary';
this.primary2='';
this.primary3='';
}else if(statisticsType == 'month') {
this.primary2='primary';
this.primary1='';
this.primary3='';
}else{
this.primary3='primary';
this.primary1='';
this.primary2='';
}
let vm = this;
vm.statisticsType = statisticsType;
vm.timeType = vm.statisticsType == 'year'? '年':(vm.statisticsType == 'month'? '月':'日');
let param ={
startDate:vm.startDate,
endDate:vm.endDate,
statisticsType: vm.statisticsType,}
vm.$https({
url : "pageViews/statisticsPageViews",
method: 'get',
authType: this.backToken
},param).then((res)=>{
let data = res.data;
vm.typeName =data.legend.data;
vm.series = data.series;
vm.dateType = data.xAxis.data;
this.initGenderChart();
}).catch(function(err){
console.log(err);
})
},
}
}
</script>
<style lang="less">
@import '../../style/common';
.analysisPage{
.form_box{
padding: 15px 20px;
min-width: 460px;
.search-form{
padding: 0px 20%;
min-width: 900px;
.el-date-editor.el-input,
.el-date-editor.el-input__inner,
.el-input--mini .el-input__inner{
width: 230px!important;
}
.el-form-item .el-form-item__content .el-date-editor.el-range-editor.el-input__inner.el-date-editor--daterange{
margin: 4px 0px 0px!important;
}
.el-date-editor .el-range-input{
width: 100%;
}
.el-range-separator{
width: 30px;
line-height: 25px;
}
.el-date-editor .el-range__icon,.el-date-editor .el-range__close-icon{
line-height: 25px;
}
}
}
#myChart{
width: 100%;
height: 500px;
canvas{
width: 100% !important;
}
}
}
</style>
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
<div id="bodyCanvas" :class="isExport?'':'export'"> <div id="bodyCanvas" :class="isExport?'':'export'">
<div class="ecahrts-panel-box"> <div class="ecahrts-panel-box">
<div class="panel-box-header"> <div class="panel-box-header">
<span class="title">互动频次</span> <span class="title">本月互动频次</span>
<div class="tip"> <div class="tip">
<span class="tip-title">页面说明:</span> <span class="tip-title">页面说明:</span>
<span> <span>
...@@ -27,7 +27,7 @@ ...@@ -27,7 +27,7 @@
</div> </div>
<div class="rank-panel-box"> <div class="rank-panel-box">
<div class="panel-box-header"> <div class="panel-box-header">
<span class="title">互动频次排行</span> <span class="title">本月互动频次排行</span>
</div> </div>
<div class="panel-box-content"> <div class="panel-box-content">
<rank-table :tList="tList" :data="data" /> <rank-table :tList="tList" :data="data" />
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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