Skip to content

周志凯 / bussiness-platform

Go to a project
Commit 2b28f767 by 周志凯
Options

feat: add utils

1 parent 4a653291
Inline Side-by-side
Showing 26 changed files with 1029 additions and 161 deletions
package-lock.json
...@@ -2506,6 +2506,12 @@ ...@@ -2506,6 +2506,12 @@
"integrity": "sha1-nyKcFb4nJFT/qXOs4NvueaGww28=", "integrity": "sha1-nyKcFb4nJFT/qXOs4NvueaGww28=",
"dev": true "dev": true
}, },
"blueimp-md5": {
"version": "2.16.0",
"resolved": "https://registry.npm.taobao.org/blueimp-md5/download/blueimp-md5-2.16.0.tgz?cache=0&sync_timestamp=1589418714663&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fblueimp-md5%2Fdownload%2Fblueimp-md5-2.16.0.tgz",
"integrity": "sha1-kBi7gF5O4FUS4OjL25MF7uy9yHw=",
"dev": true
},
"bn.js": { "bn.js": {
"version": "5.1.2", "version": "5.1.2",
"resolved": "https://registry.npm.taobao.org/bn.js/download/bn.js-5.1.2.tgz", "resolved": "https://registry.npm.taobao.org/bn.js/download/bn.js-5.1.2.tgz",
...@@ -4078,6 +4084,11 @@ ...@@ -4078,6 +4084,11 @@
"integrity": "sha1-LnG/CxGRU9u0zE6I2epaz7UNwFw=", "integrity": "sha1-LnG/CxGRU9u0zE6I2epaz7UNwFw=",
"dev": true "dev": true
}, },
"dayjs": {
"version": "1.8.28",
"resolved": "https://registry.npm.taobao.org/dayjs/download/dayjs-1.8.28.tgz",
"integrity": "sha1-N6piAd9IPQiWRctsj2zvbwxNvAc="
},
"de-indent": { "de-indent": {
"version": "1.0.2", "version": "1.0.2",
"resolved": "https://registry.npm.taobao.org/de-indent/download/de-indent-1.0.2.tgz", "resolved": "https://registry.npm.taobao.org/de-indent/download/de-indent-1.0.2.tgz",
......
package.json
...@@ -10,6 +10,7 @@ ...@@ -10,6 +10,7 @@
"dependencies": { "dependencies": {
"axios": "^0.19.2", "axios": "^0.19.2",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"dayjs": "^1.8.28",
"element-ui": "^2.13.2", "element-ui": "^2.13.2",
"js-cookie": "^2.2.1", "js-cookie": "^2.2.1",
"normalize.css": "^8.0.1", "normalize.css": "^8.0.1",
...@@ -25,6 +26,7 @@ ...@@ -25,6 +26,7 @@
"@vue/cli-service": "^4.3.0", "@vue/cli-service": "^4.3.0",
"@vue/eslint-config-prettier": "^6.0.0", "@vue/eslint-config-prettier": "^6.0.0",
"babel-eslint": "^10.1.0", "babel-eslint": "^10.1.0",
"blueimp-md5": "^2.16.0",
"eslint": "^6.7.2", "eslint": "^6.7.2",
"eslint-plugin-prettier": "^3.1.3", "eslint-plugin-prettier": "^3.1.3",
"eslint-plugin-vue": "^6.2.2", "eslint-plugin-vue": "^6.2.2",
......
public/config.js 0 → 100644
window._vionConfig = {
// apiUrl: 'http://192.168.9.116:17070',
// apiUrl: 'http://192.168.9.228:17070',
// apiUrl: 'http://192.168.9.146:17070',
// apiUrl: 'http://192.168.9.127:17070',
// apiUrl: 'https://mall.keliuyun.com/report',
apiUrl: 'https://store.keliuyun.com/report',
// apiUrl: 'http://192.168.9.127:8087',
// apiUrl: 'http://139.217.95.227:17070',
// menuUrl: 'http://192.168.9.127:19090',
menuUrl: 'https://store.keliuyun.com/report/auth',
// menuUrl: 'https://mall.keliuyun.com/report/auth',
picUrl: 'https://vion-retail.oss-cn-beijing.aliyuncs.com',
// picUrl: 'https://vion-mall.oss-cn-beijing.aliyuncs.com',
// imagesUrl: 'http://192.168.9.228',
imagesUrl: 'https://store.keliuyun.com',
// imagesUrl: 'http://192.168.9.146:17070',
// imagesUrl: 'http://mall.keliuyun.com',
// messageUrl: 'http://192.168.9.242:15051',
messageUrl: 'http://139.217.95.227:15052',
// 连锁客流: store | 6.0: mall
platform: 'store',
//菜单权限: false | 全部菜单: true
allMenu: false,
//新城SSO_logout_url
//logoutUrl = 'https://auth.xincheng.com/sso_logout';
// 设备状态
logUrl: 'http://192.168.9.196:9201',
reidUrl: 'http://molli2.zhimatech.com/#/hotindex',
videoUrl: 'https://video.keliuyun.com:18443',
repeatInStoreUrl: 'https://store.keliuyun.com/report/openapi',
// repeatInStoreUrl: 'http://192.168.9.115:8087',
version: 'VVAS-6.0.5',
// firstDayOfWeek: 1,
webVersion: '6.0.0',
// reportType: 'table'
// 公司名称修改
companyName: '北京文安智能技术股份有限公司'
}
src/api/index.js 0 → 100644
import * as base from './modules/base'
export default {
base
}
src/api/modules/base.js 0 → 100644
import request from '../request'
/**
* 获取集团
*/
export function account(query) {
return request({
url: '/accounts',
method: 'get',
params: query
})
}
/**
* 获取商场/门店
*/
export function mall(query) {
return request({
url: '/malls',
method: 'get',
params: query
})
}
/**
* 获取楼层
*/
export function floor(query) {
return request({
url: '/floors',
method: 'get',
params: query
})
}
/**
* 获取店铺/区域
*/
export function zone(query) {
return request({
url: '/zones',
method: 'get',
params: query
})
}
/**
* 获取监控点/出入口
*/
export function gate(query) {
return request({
url: '/gates',
method: 'get',
params: query
})
}
/**
* 获取城市列表
*/
export function city(query) {
return request({
url: '/citys',
method: 'get',
params: query
})
}
/**
* 获取国家
*/
export function countries(query) {
return request({
url: '/citys/countries',
method: 'get',
params: query
})
}
/**
* 获取省份列表
*/
export function province(query) {
return request({
url: '/provinces',
method: 'get',
params: query
})
}
/**
* 获取字典code
*/
export function dataDic(query) {
return request({
url: '/dataDics',
method: 'get',
params: query
})
}
src/api/request.js 0 → 100644
import axios from 'axios'
import { Message } from 'element-ui'
import Cookie from '@/utils/Cookie'
import md5 from 'blueimp-md5'
import { param2 } from '@/utils'
const Service = axios.create({
baseURL: window._vionConfig.apiUrl,
timeout: 0,
withCredentials: true
})
// create signature
function generateSignature({ method, params, data }) {
const suffix = '4c413628731691abc99eb2fca5f69aab'
const signalStr =
method.toUpperCase() +
(params ? param2(params) : '') +
(data ? JSON.stringify(data) : '') +
suffix
return md5(signalStr)
}
Service.interceptors.request.use(
config => {
let language = localStorage.getItem('lang'),
aToken = Cookie.get('atoken')
config.headers['signature'] = generateSignature(config)
if (language) {
let languageObj = {
mall_CN: 'zh-CN,zh;q=0.9',
zh_CN: 'zh-CN,zh;q=0.9',
en_US: 'en-US,en;q=0.5',
zh_TW: 'zh-TW,zh;q=0.3'
}
languageObj[language] &&
(config.headers['Accept-Language'] = languageObj[language])
}
aToken && (config.headers.Authorization = aToken)
},
error => {
Message({
type: 'error',
message: error
})
return Promise.reject(error)
}
)
Service.interceptors.response.use(
response => {
if (response.data && !response.data.success) {
if (response.data.ecode && response.data.ecode !== 200) {
// 跳转首页
Message({
showClose: true,
message: response.data.enote,
type: 'error'
})
return
} else {
// 非标准返回体
if (response.status === 200) {
return response
}
}
if (response.data.code === 500) {
Message({
showClose: true,
message: response.data.msg,
type: 'error'
})
}
return Promise.reject(response.data.msg)
}
return response
},
error => {
return Promise.reject(error)
}
)
export default Service
src/components/Conditions/DateOptions.vue 0 → 100644
<template>
<div>
<!-- 两种形式 0:select 1:button -->
<template v-if="showType === 0">
<!-- select -->
<el-select v-model="dateType" placeholder="请选择日期">
<el-option
v-for="item in dateList"
:key="item.value"
:label="item.label"
:value="item.value"
>
</el-option>
</el-select>
</template>
<template v-else>
<!-- button -->
</template>
<el-date-picker
v-show="dateType === 'day'"
v-model="dayVal"
type="date"
placeholder="选择日期"
/>
<el-date-picker
v-show="dateType === 'week'"
v-model="weekVal"
type="week"
format="yyyy 第 WW 周"
placeholder="选择周"
/>
<el-date-picker
v-show="dateType === 'month'"
v-model="monthVal"
type="month"
placeholder="选择月"
/>
<el-date-picker
v-show="dateType === 'year'"
v-model="yearVal"
type="year"
placeholder="选择年"
/>
</div>
</template>
<script>
const list = ['day', 'week', 'month', 'year'].map(item => ({
label: item,
value: item
}))
export default {
name: 'DateOptions',
props: {
showType: {
type: Number,
default: 0
},
dateList: {
type: Array,
default: () => list
},
defaultsDate: {
type: String,
default: 'day'
}
},
data() {
return {
dayVal: '',
weekVal: '',
monthVal: '',
yearVal: ''
}
},
computed: {
dateType: {
get() {
return this.defaultsDate
},
set(val) {
this.$emit('update:defaultsDate', val)
}
}
}
}
</script>
src/components/HelloWorld.vue deleted 100644 → 0
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br />
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener"
>vue-cli documentation</a
>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel"
target="_blank"
rel="noopener"
>babel</a
>
</li>
<li>
<a
href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint"
target="_blank"
rel="noopener"
>eslint</a
>
</li>
</ul>
<h3>Essential Links</h3>
<ul>
<li>
<a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a>
</li>
<li>
<a href="https://forum.vuejs.org" target="_blank" rel="noopener"
>Forum</a
>
</li>
<li>
<a href="https://chat.vuejs.org" target="_blank" rel="noopener"
>Community Chat</a
>
</li>
<li>
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener"
>Twitter</a
>
</li>
<li>
<a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a>
</li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li>
<a href="https://router.vuejs.org" target="_blank" rel="noopener"
>vue-router</a
>
</li>
<li>
<a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a>
</li>
<li>
<a
href="https://github.com/vuejs/vue-devtools#vue-devtools"
target="_blank"
rel="noopener"
>vue-devtools</a
>
</li>
<li>
<a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener"
>vue-loader</a
>
</li>
<li>
<a
href="https://github.com/vuejs/awesome-vue"
target="_blank"
rel="noopener"
>awesome-vue</a
>
</li>
</ul>
</div>
</template>
<script>
export default {
name: "HelloWorld",
props: {
msg: String
}
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="scss">
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
src/layouts/BasicLayout.vue
...@@ -4,8 +4,26 @@ ...@@ -4,8 +4,26 @@
<global-header /> <global-header />
</el-header> </el-header>
<el-main class="content-container"> <el-main class="content-container">
<div class="condition">condition</div> <div class="condition">
<div class="content"> <div class="condition-top">
<span class="content-title">
演示项目 2020-06-10 客流综合数据统计
</span>
<span
class="pointer other-options"
:class="{ collapsed: !collapsed }"
@click="collapsed = !collapsed"
>
其他日期选项
<i class="el-icon-arrow-right condition-icon-arrow"></i>
</span>
</div>
<div v-show="!collapsed" class="collapsed-content">
<date-options :defaults-date.sync="dateType" />
collapsed content
</div>
</div>
<div class="content" :style="{ marginTop: collapsed ? '72px' : '132px' }">
<router-view /> <router-view />
</div> </div>
</el-main> </el-main>
...@@ -14,10 +32,17 @@ ...@@ -14,10 +32,17 @@
<script> <script>
import GlobalHeader from './components/GlobalHeader' import GlobalHeader from './components/GlobalHeader'
import DateOptions from '@/components/Conditions/DateOptions'
export default { export default {
name: 'BasicLayout', name: 'BasicLayout',
components: { GlobalHeader } components: { GlobalHeader, DateOptions },
data() {
return {
collapsed: false,
dateType: 'day'
}
}
} }
</script> </script>
...@@ -26,14 +51,14 @@ export default { ...@@ -26,14 +51,14 @@ export default {
.content-container { .content-container {
padding: 0; padding: 0;
margin-bottom: 40px;
} }
.content { .content {
margin: $headerHeight 165px 0; margin: $headerHeight 165px 0;
background-color: #e9eef3; background-color: #ccc;
color: #333; color: #333;
text-align: center; text-align: center;
height: 100vh; height: 100vh;
line-height: 160px;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 1); box-shadow: 0 0 3px 0 rgba(0, 0, 0, 1);
transition: all 0.3s linear; transition: all 0.3s linear;
} }
...@@ -42,9 +67,43 @@ export default { ...@@ -42,9 +67,43 @@ export default {
width: 100%; width: 100%;
position: fixed; position: fixed;
top: $headerHeight; top: $headerHeight;
height: 60px; z-index: 2;
line-height: 60px; background: #fff;
background: #f0d;
text-align: center; text-align: center;
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
.content-title {
font-size: 20px;
color: #555;
}
.other-options {
float: right;
position: relative;
right: 165px;
top: 6px;
font-size: 13px;
color: #666;
.condition-icon-arrow {
margin-left: 8px;
transition: transform 0.3s;
}
&.collapsed .condition-icon-arrow {
transform: rotate(90deg);
}
}
.condition-top {
line-height: 60px;
border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}
.collapsed-content {
background: #fff;
height: 58px;
line-height: 58px;
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.1);
}
} }
</style> </style>
src/layouts/PageLayout.vue
...@@ -5,12 +5,12 @@ ...@@ -5,12 +5,12 @@
<global-header /> <global-header />
</el-header> </el-header>
<el-container class="main-container"> <el-container class="main-container">
<!-- doing open/close -->
<!-- <div class="drawer-bg" /> -->
<el-aside width="200px"> <el-aside width="200px">
<sidebar /> <sidebar />
</el-aside> </el-aside>
<el-main class="main-content">Main</el-main> <el-main class="main-content">
<router-view />
</el-main>
</el-container> </el-container>
</el-container> </el-container>
</template> </template>
......
src/layouts/components/FixedMenu/index.vue 0 → 100644
<template>
<div class="side-menu-container" ref="fixMenuRef">
<ul class="clearfix fixed-menu-container">
<li
class="menu-item"
:class="{
active: activeMenu === item.value
}"
v-for="item in list"
:key="item.value"
:data-key="item.value"
>
<span class="item-text" :data-key="item.value">{{ item.label }}</span>
</li>
</ul>
<div
ref="popperWrapper"
class="test"
:style="{
opacity: visible ? 1 : 0,
top: currItemPostion.y,
left: currItemPostion.x
}"
>
<el-input
ref="searchRef"
class="menu-child-search"
suffix-icon="el-icon-search"
v-model="input"
placeholder="请输入"
/>
<p class="clearfix menu-child-item">
<span>南京吾悦广场</span>
</p>
<p class="clearfix menu-child-item">
<span>南京吾悦广场</span>
</p>
<p class="clearfix menu-child-item">
<span>南京吾悦广场</span>
</p>
<p class="clearfix menu-child-item">
<span>南京吾悦广场</span>
</p>
</div>
</div>
</template>
<script>
export default {
name: 'FixedMenu',
data() {
return {
list: [
{ label: '集团', value: 'account' },
{ label: '商场', value: 'mall' },
{ label: '楼层', value: 'floor' },
{ label: '店铺', value: 'zone' }
],
activeMenu: 'account',
currItemPostion: { x: 0, y: 0 },
input: '',
visible: true
}
},
mounted() {
document.addEventListener('click', this.onMenuClick, false)
},
beforeDestroy() {
document.removeEventListener('click', this.onMenuClick, false)
},
methods: {
onMenuClick(ev) {
ev.stopPropagation()
try {
const panels = this.$refs.fixMenuRef
const key = ev.target.dataset.key
if (key === 'account') {
this.visible = false
return
}
if (!panels.contains(ev.target)) {
this.visible = false
} else {
this.$refs.searchRef.focus()
this.visible = true
}
// 计算点位 固定选择特殊属性值的元素
const el = document.querySelector(`.menu-item[data-key="${key}"]`)
if (el && this.$refs.popperWrapper) {
const popperWrapperRect = this.$refs.popperWrapper.getBoundingClientRect()
const { x, y } = el.getBoundingClientRect()
this.currItemPostion = {
x: x - popperWrapperRect.width - 3 + 'px',
y: y + 'px'
}
}
} catch (error) {
this.visible = false
console.log(error)
}
}
}
}
</script>
<style lang="scss" scoped>
.fixed-menu-container {
position: fixed;
width: 50px;
right: 5.6vw;
top: 30vh;
box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.5);
}
.menu-item {
background: #fff;
padding: 12px 0;
color: #444;
text-align: center;
font-size: 14px;
box-sizing: border-box;
cursor: pointer;
&.active {
color: #fff;
background: #06f;
}
&:hover {
color: #fff;
background: #06f;
}
}
.test {
position: fixed;
padding: 5px 9px;
box-sizing: border-box;
background: #fff;
box-shadow: 0 0 1px -4px #333;
}
.menu-child-search {
margin-bottom: 5px;
}
.menu-child-item {
text-align: left;
font-size: 13px;
color: #888;
padding-left: 6px;
padding-right: 6px;
margin-bottom: 4px;
box-sizing: border-box;
cursor: pointer;
&:hover {
background: #0069ff;
color: #fff;
}
}
</style>
src/layouts/components/GlobalHeader/index.vue
...@@ -5,18 +5,13 @@ ...@@ -5,18 +5,13 @@
<!-- menu --> <!-- menu -->
<el-menu <el-menu
:default-active="activeIndex" :default-active="activeIndex"
class="el-menu-demo" class="header-menu-wrapper"
background-color="#1d66f3"
text-color="#fff"
mode="horizontal" mode="horizontal"
@select="handleSelect" @select="handleSelect"
> >
<el-menu-item index="1">处理中心</el-menu-item> <menus-item v-for="route in routes" :key="route.key" :item="route" />
<el-menu-item index="2-1">选项1</el-menu-item>
<el-menu-item index="2-2">选项2</el-menu-item>
<el-menu-item index="2-3">选项3</el-menu-item>
<el-menu-item index="2-4-1">选项1</el-menu-item>
<el-menu-item index="2-4-2">选项2</el-menu-item>
<el-menu-item index="2-4-3">选项3</el-menu-item>
<el-menu-item index="3">消息中心</el-menu-item>
</el-menu> </el-menu>
</div> </div>
<div class="header-left">logo</div> <div class="header-left">logo</div>
...@@ -26,16 +21,58 @@ ...@@ -26,16 +21,58 @@
</template> </template>
<script> <script>
import MenusItem from '../MenuItem'
export default { export default {
name: 'GlobalHeader', name: 'GlobalHeader',
components: { MenusItem },
data() { data() {
return { return {
activeIndex: '1' activeIndex: '',
routes: [
{
key: 'home',
path: '/',
name: '首页'
},
{
key: 'analysis',
path: 'analysis',
name: '客流统计'
},
{
key: 'behavior',
path: 'behavior',
name: '人脸分析'
},
{
key: 'dataasis',
path: 'dataasis',
name: '数据分析'
},
{
key: 'manage',
path: 'manage',
name: '后台管理'
}
]
} }
}, },
computed: {
activeMenu() {
const route = this.$route
const currRoute = this.routes.find(
item => route.path.indexOf(item.key) > -1
)
return (currRoute && '/' + currRoute.path) || '/'
}
},
mounted() {
// console.log('activeMenu', this.activeMenu)
},
methods: { methods: {
handleSelect(key, keyPath) { handleSelect(key) {
console.log(key, keyPath) this.$router.push(key)
} }
} }
} }
...@@ -48,11 +85,11 @@ export default { ...@@ -48,11 +85,11 @@ export default {
} }
.platform-head { .platform-head {
width: 100%; width: 100%;
background-color: #b3c0d1; background-color: #1d66f3;
color: #fff; color: #fff;
height: 60px; height: 60px;
line-height: 60px; line-height: 60px;
padding: 0 500px 0 300px; padding: 0 500px 0 364px;
overflow: hidden; overflow: hidden;
&.fixed-header { &.fixed-header {
position: fixed; position: fixed;
...@@ -67,14 +104,19 @@ export default { ...@@ -67,14 +104,19 @@ export default {
width: 100%; width: 100%;
height: 60px; height: 60px;
} }
.header-menu-wrapper {
font-size: 16px;
color: #fff;
}
.header-left { .header-left {
position: relative; position: relative;
float: left; float: left;
width: 300px; width: 364px;
height: inherit; height: inherit;
left: -300px; left: -364px;
padding-left: 165px;
margin-left: -100%; margin-left: -100%;
background: #f00; background: #1d66f3;
text-align: center; text-align: center;
} }
.header-right { .header-right {
...@@ -84,7 +126,7 @@ export default { ...@@ -84,7 +126,7 @@ export default {
height: inherit; height: inherit;
right: -500px; right: -500px;
margin-left: -500px; margin-left: -500px;
background: #00f; background: #1d66f3;
text-align: center; text-align: center;
} }
</style> </style>
src/layouts/components/Link.vue 0 → 100644
<template>
<component :is="type" v-bind="linkProps(to)">
<slot />
</component>
</template>
<script>
export default {
props: {
to: {
type: String,
required: true
}
},
computed: {
type() {
return 'router-link'
}
},
methods: {
linkProps(to) {
return {
to: to
}
}
}
}
</script>
src/layouts/components/MenuItem.vue 0 → 100644
<template>
<app-link :to="resolvePath(item.path)" class="menu-item-wrapper">
<el-menu-item :index="resolvePath(item.path)">
<span>{{ item.name }}</span>
</el-menu-item>
</app-link>
</template>
<script>
import path from 'path'
import AppLink from './Link'
export default {
name: 'MenuItem',
components: { AppLink },
props: {
item: {
type: Object,
required: true
},
basePath: {
type: String,
default: ''
}
},
methods: {
resolvePath(routePath) {
return path.resolve(this.basePath, routePath)
}
}
}
</script>
<style lang="scss" scoped>
.menu-item-wrapper {
display: inline-block;
height: 0;
}
</style>
src/main.js
import Vue from 'vue' import Vue from 'vue'
import 'normalize.css/normalize.css'
import ElementUI from 'element-ui' import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css' import 'element-ui/lib/theme-chalk/index.css'
import 'normalize.css/normalize.css' import '@/styles/index.scss'
import Cookies from '@/utils/Cookies'
Vue.prototype.$cookie = Cookies
import App from './App.vue' import App from './App.vue'
import router from './router' import router from './router'
......
src/router/index.js
import Vue from 'vue' import Vue from 'vue'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
// 解决 vue-router 重复路由访问报错
const originPush = VueRouter.prototype.push
VueRouter.prototype.push = function push(location) {
return originPush.call(this, location).catch(err => err)
}
// layout // layout
import { PageLayout, BasicLayout } from '../layouts' import { PageLayout, BasicLayout } from '../layouts'
...@@ -44,6 +50,45 @@ export const constantRoutes = [ ...@@ -44,6 +50,45 @@ export const constantRoutes = [
meta: {} meta: {}
} }
] ]
},
{
path: '/behavior',
component: PageLayout,
redirect: '/behavior/mallgroup',
children: [
{
path: 'mallgroup',
name: 'mallgroup',
component: () => import('@/views/behavior/mallgroup/index'),
meta: {}
}
]
},
{
path: '/dataasis',
component: BasicLayout,
redirect: '/dataasis/trafficasis',
children: [
{
path: 'trafficasis',
name: 'trafficasis',
component: () => import('@/views/dataasis/analysis-report/index'),
meta: {}
}
]
},
{
path: '/manage',
component: PageLayout,
redirect: '/manage/blocmanage',
children: [
{
path: 'blocmanage',
name: 'blocmanage',
component: () => import('@/views/manage/bloc-manage/index'),
meta: {}
}
]
} }
] ]
......
src/styles/element-ui.scss
// cover elementui style // cover elementui style
.menu-child-search{
.el-input__inner {
height: 28px;
line-height: 28px;
border-radius: 2px;
padding-left: 12px;
}
.el-input__icon {
line-height: 28px;
}
}
\ No newline at end of file \ No newline at end of file
src/styles/index.scss
@import './variables.scss';
@import './mixin.scss';
@import './element-ui.scss';
@import './menu.scss';
body {
height: 100%;
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
html {
height: 100%;
box-sizing: border-box;
}
#app {
height: 100%;
}
label {
font-weight: 700;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
a:focus,
a:active {
outline: none;
}
a,
a:focus,
a:active {
cursor: pointer;
color: inherit;
text-decoration: none;
}
ul, p {
margin: 0;
padding: 0;
}
li {
list-style: none;
}
.fr {
float: right;
}
.fl {
float: left;
}
.block {
display: block;
}
.pointer {
cursor: pointer;
}
.inlineBlock {
display: inline-block;
}
.text-center {
text-align: center;
}
src/styles/menu.scss 0 → 100644
#app {
.header-middle {
a {
// display: inline-block;
// width: 100%;
// overflow: hidden;
}
}
.header-menu-wrapper {
.el-menu-item {
font-size: 16px;
padding: 0 46px;
font-weight: 400;
&.is-active {
border-bottom: none;
color: #fff;
font-weight: 600;
}
}
}
}
src/utils/Cookies.js 0 → 100644
/* eslint-disable */
'use strict'
function getCookiesObj() {
var cookies = {}
if (document.cookie) {
var objs = document.cookie.split('; ')
for (var i in objs) {
var index = objs[i].indexOf('=')
var key = objs[i].replace(/^\s/, '').substr(0, index)
var value = objs[i].substr(index + 1, objs[i].length)
cookies[key] = value
}
}
return cookies
}
const Cookies = {
get(sKey) {
return decodeURIComponent(document.cookie
.replace(
new RegExp("(?:(?:^|.*;)\\s*" +
encodeURIComponent(sKey)
.replace(/[-.+*]/g, "\\$&") +
"\\s*\\=\\s*([^;]*).*$)|^.*$"
),
"$1"
)
) || null
},
set(sKey, sValue, vEnd, sPath, sDomain, bSecure) {
if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false }
var sExpires = ""
if (vEnd) {
switch (vEnd.constructor) {
case Number:
sExpires = vEnd === Infinity
? "; expires=Fri, 31 Dec 9999 23:59:59 GMT"
: "; max-age=" + vEnd
break
case String:
sExpires = "; expires=" + vEnd
break
case Date:
sExpires = "; expires=" + vEnd.toUTCString()
break
}
}
document.cookie = encodeURIComponent(sKey) +
"=" +
encodeURIComponent(sValue) +
sExpires +
(sDomain ? "; domain=" + sDomain : "") +
(sPath ? "; path=" + sPath : "") +
(bSecure ? "; secure" : "")
return true
},
remove(sKey, sPath, sDomain) {
if (!sKey || !this.hasItem(sKey)) { return false }
document.cookie = encodeURIComponent(sKey) +
"=; expires=Thu, 01 Jan 1970 00:00:00 GMT" +
(sDomain ? "; domain=" + sDomain : "") +
(sPath ? "; path=" + sPath : "")
return true
},
has(sKey) {
return (
new RegExp(
"(?:^|;\\s*)" +
encodeURIComponent(sKey).replace(/[-.+*]/g, "\\$&") +
"\\s*\\="
)
).test(document.cookie)
},
keys() {
var aKeys = document.cookie
.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "")
.split(/\s*(?:\=[^;]*)?;\s*/)
for (var nIdx = 0; nIdx < aKeys.length; nIdx++) {
aKeys[nIdx] = decodeURIComponent(aKeys[nIdx])
}
return aKeys
},
clear() {
const cookies = getCookiesObj()
for (var k = 0; k < cookies.length; k++) {
document.cookie = cookies[k] + '=;max-age=0'
}
}
}
export default Cookies
src/utils/Date.js 0 → 100644
import dayjs from 'dayjs'
export function generateDate(formatStr = 'YYYY-MM-DD hh:mm:ss') {
let dayDate, weekDate, monthDate, yearDate
dayDate = dayjs().format(formatStr)
weekDate = ''
return {
dayDate,
weekDate,
monthDate,
yearDate
}
}
src/utils/index.js 0 → 100644
/* eslint-disable */
/**
* 节流函数
*/
export function debounce(func, wait, immediate) {
let timeout, args, context, timestamp, result
const later = function () {
const last = +new Date() - timestamp // 距上次触发事件间隔
// 上次被包装函数被调用时间间隔 last 小于设定的时间间隔 wait
if (last < wait && last > 0) {
timeout = setTimeout(later, wait - last)
} else {
timeout = null;
// 如果设定 immediate === true, 因为开始边界已经调用了此处无需调用
if (!immediate) {
result = func.apply(context, args)
if (!timeout) context = args = null
}
}
}
return function (...args) {
context = this
timestamp = +new Date()
const callNow = immediate && !timeout
// 如果延时不存在, 重新设定超时
if (!timeout) timeout = setTimeout(later, wait)
if (callNow) {
result = func.apply(context, args)
context = args = null
}
return result
}
}
/**
* @param {object} json
* @returns {string}
*/
export function param2(json) {
if (!json) return ''
return cleanArray(
Object.keys(json).map(key => {
if (json[key] === undefined ||
json[key] === null
) return ''
return encodeURIComponent(key) + '=' + json[key]
})
).join('&')
}
src/views/Home.vue → src/views/behavior/mallgroup/index.vue
<template> <template>
<div class="home"> <div>mallgroup</div>
<img alt="Vue logo" src="../assets/logo.png" />
<HelloWorld msg="Welcome to Your Vue.js App" />
</div>
</template> </template>
<script> <script>
// @ is an alias to /src
import HelloWorld from "@/components/HelloWorld.vue";
export default { export default {
name: "Home", name: 'mallgroup'
components: { }
HelloWorld
}
};
</script> </script>
src/views/About.vue → src/views/dataasis/analysis-report/index.vue
<template> <template>
<div class="about"> <div>analysis-report</div>
<h1>This is an about page</h1>
</div>
</template> </template>
src/views/manage/bloc-manage/index.vue 0 → 100644
<template>
<div>bloc manage</div>
</template>
src/views/report/account/index.vue
<template> <template>
<div>account</div> <div class="account-container">
<h3>account</h3>
<fixed-menu />
</div>
</template> </template>
<script> <script>
import FixedMenu from '@/layouts/components/FixedMenu'
export default { export default {
name: 'Account' name: 'Account',
components: { FixedMenu },
mounted() {
// console.log(this.$cookie.keys())
}
} }
</script> </script>
<style lang="scss" scoped>
.account-container {
position: relative;
}
</style>
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!