Commit a36a054c by 姜雷

Merge branch 'test' into 'master'

Test See merge request !110
parents 5bf7d8a6 8840fe2d
......@@ -84,6 +84,9 @@ $--color-danger: #ff3333;
.el-loading-mask {
z-index: 1000 !important;
}
.el-select-dropdown__item {
padding: 0 40px 0 20px;
}
@media screen and (min-width: $bigScreenWidth) {
.el-submenu .el-menu-item,
.el-submenu__title {
......
<template>
<el-select
popper-class="dashboard-area-popper"
:clearable="clearable"
:disabled="disabled"
filterable
:value="value"
@change="changeHandle"
:multiple="multiple"
ref="select"
>
<slot></slot>
<slot>
<el-input
v-if="multiple"
class="out-input"
clearable
@click.stop
@input="debouncedQueryChange"
/>
<el-option
v-if="multiple"
:value="-1"
>
<span>全选</span>
<span class="inner-input"> </span>
</el-option>
</slot>
<el-option
v-for="(item, index) in dashboardArea"
v-for="(item, index) in filterList"
:key="index"
:value="item.id"
:label="item.areaName"
......@@ -18,6 +36,7 @@
</template>
<script>
import debounce from 'throttle-debounce/debounce';
import areaMixin from './mixin.js';
export default {
......@@ -40,27 +59,47 @@ export default {
data() {
return {
selectedAll: false,
filterText: '',
};
},
created() {
this.debouncedQueryChange = debounce(this.debounce, value => {
this.handleQueryChange(value);
});
},
computed: {
filterList() {
return this.dashboardArea.filter(item => {
if (item.value == -1) return true;
if (this.filterText) {
return item.areaName.indexOf(this.filterText) > -1;
} else {
return true;
}
});
},
},
mixins: [areaMixin],
methods: {
changeHandle(val) {
if (val) {
if (val && val.length && val.indexOf(-1) > -1) {
if (val.length === this.dashboardArea.length) {
this.selectedAll = false;
if (this.selectedAll) {
if (val && val.length && val.indexOf(-1) > -1) {
this.$emit('input', val.filter(id => id !== -1));
} else {
this.$emit('input', []);
}
this.selectedAll = false;
} else {
if (val && val.length && val.indexOf(-1) > -1) {
this.selectedAll = true;
this.$emit('input', [
...this.dashboardArea.map(item => item.id),
-1,
]);
}
} else {
if (this.selectedAll) {
this.selectedAll = false;
this.$emit('input', []);
} else if (val.length === this.dashboardArea.length) {
this.selectedAll = true;
this.$emit('input', [...val, -1]);
} else {
this.$emit('input', val);
}
......@@ -69,7 +108,33 @@ export default {
this.$emit('input', null);
}
},
handleQueryChange(val) {
this.filterText = val;
},
},
};
</script>
<style lang="scss">
.dashboard-area-popper {
.el-select-dropdown__list {
position: relative;
}
.out-input,
.inner-input {
display: inline-block;
width: 100px;
margin-left: 20px;
}
.out-input {
position: absolute;
right: 40px;
top: 23px;
transform: translateY(-50%);
z-index: 1;
}
.inner-input {
line-height: inherit;
}
}
</style>
......@@ -17,7 +17,7 @@ export default {
mounted() {
if (this.dashboardArea && !this.dashboardArea.length) {
this.fetchDashboardAreaList({
operateId: null,
operateId: this.operateId ? this.operateId : null,
});
}
},
......
......@@ -14,9 +14,7 @@
:value="filters.choiceareaIds"
multiple
@input="val => updateFilters({choiceareaIds: val})"
>
<el-option :value="-1">全选</el-option>
</dashboard-area-select>
/>
</search-item>
<el-radio-group
class="Dashboard-Radio"
......
......@@ -4,7 +4,9 @@
id='CustomerRechargeChart'
:style="`height: ${height}px;width: ${width?width+'px':'auto'}`"
></div>
<div id='CustomerRechangeSlider'></div>
<div class="CustomerRechangeSlider-wrap">
<div id='CustomerRechangeSlider'></div>
</div>
<!-- <CustomerRechangeSlider
class="CustomerRechangeSlider"
:data="data"
......@@ -334,6 +336,13 @@ export default {
<style lang="scss">
.CustomerRechargeChart {
position: relative;
.CustomerRechangeSlider-wrap {
position: absolute;
right: 0;
top: 0;
width: 26px;
height: 100%;
}
#CustomerRechargeChart {
width: 100%;
// overflow-x: hidden;
......@@ -347,12 +356,6 @@ export default {
height: 100%;
background-color: #eee;
}
#CustomerRechangeSlider {
margin-left: -30px;
width: 100%;
height: 300px;
transform: translate(100%, -100%);
}
.CustomerRechargeChart-areaTitle {
color: #666;
width: 85px;
......
<template>
<list-layout>
<list-layout class="Demo">
<template slot="filterItem">
<search-item label="赠送类型">
<el-input></el-input>
<search-item label="运营商">
<operator-select
:accessType="1"
:value="filters.operateId"
@input="val => updateFilters({operateId: val,areaId:[]})"
/>
</search-item>
<search-item label="区域">
<dashboard-area-select
:operateId="filters.operateId"
:value="filters.areaId"
multiple
@input="val => updateFilters({areaId: val})"
/>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
</template>
<template slot="filterBtn">
<el-button @click="showSearchBarHandle">qiehuan</el-button>
</template>
</list-layout>
</template>
<script>
import searchMixin from '@/mixins/searchBar';
export default {
name: 'Demo',
mixins: [searchMixin],
data() {
return {
filters: {
operateId: undefined,
areaId: [],
},
};
},
methods: {
updateFilters(entity) {
this.filters = {
...this.filters,
...entity,
};
},
},
};
</script>
<style lang="scss">
.Demo {
.el-select {
.el-select__tags {
height: 90%;
overflow: hidden;
input {
display: none;
}
}
.el-input {
overflow: hidden;
}
.el-input__inner {
height: 100% !important;
}
}
}
</style>
<template>
<list-layout>
<template slot="filterItem">
<search-item label="赠送类型">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
<search-item label="会员ID">
<el-input></el-input>
</search-item>
</template>
<template slot="filterBtn">
<el-button @click="showSearchBarHandle">qiehuan</el-button>
</template>
</list-layout>
</template>
<script>
import searchMixin from '@/mixins/searchBar';
export default {
name: 'Demo',
mixins: [searchMixin],
};
</script>
......@@ -69,6 +69,7 @@
import MenuItem from './components/MenuItem';
import { mapGetters } from 'vuex';
import { formatRouteLink, getMenuDataById } from '@/utils/route';
import store from '@/containers/Dashboard/store';
export default {
name: 'IconMenus',
......@@ -88,6 +89,9 @@ export default {
type: Function,
},
},
created() {
store.install(this.$store);
},
data() {
return {
collectRouteList: [],
......
......@@ -10,6 +10,7 @@ const constantRouterMap = [
{ path: '/login', component: Login, hidden: true },
{ path: '/404', component: errorPage404, hidden: true },
{ path: '/401', component: errorPage401, hidden: true },
// { path: '/demo', component: _import('HomePage/Demo'), hidden: true },
];
const asyncRouterMap = [{ path: '*', redirect: '/404', hidden: true }];
......
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