Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
M
memberTag-web
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
memberTag
memberTag-web
Commits
0571deec
Commit
0571deec
authored
Oct 23, 2018
by
无尘
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
add: 增加会员详情各个组件
parent
1f23825d
Hide whitespace changes
Inline
Side-by-side
Showing
4 changed files
with
753 additions
and
30 deletions
+753
-30
public.js
src/common/js/public.js
+39
-0
index.vue
src/view/index/index.vue
+1
-1
myTagDetail.vue
src/view/myTag/myTagDetail.vue
+690
-29
public.css
static/css/public.css
+23
-0
No files found.
src/common/js/public.js
0 → 100644
View file @
0571deec
// 防抖
export
function
_debounce
(
fn
,
delay
)
{
var
delay
=
delay
||
200
;
var
timer
;
// console.log(fn)
return
function
()
{
var
that
=
this
;
var
args
=
arguments
;
if
(
timer
)
{
clearTimeout
(
timer
);
}
timer
=
setTimeout
(
function
()
{
timer
=
null
;
fn
.
apply
(
that
,
args
);
},
delay
);
};
}
// 节流
export
function
_throttle
(
fn
,
interval
)
{
var
last
;
var
timer
;
var
interval
=
interval
||
200
;
return
function
()
{
var
that
=
this
;
var
args
=
arguments
;
var
now
=
+
new
Date
();
if
(
last
&&
now
-
last
<
interval
)
{
clearTimeout
(
timer
);
timer
=
setTimeout
(
function
()
{
last
=
now
;
fn
.
apply
(
that
,
args
);
},
interval
);
}
else
{
last
=
now
;
fn
.
apply
(
that
,
args
);
}
}
}
src/view/index/index.vue
View file @
0571deec
...
@@ -220,7 +220,7 @@
...
@@ -220,7 +220,7 @@
.content-body
{
.content-body
{
display
:
flex
;
display
:
flex
;
overflow
:
hidden
;
overflow
-y
:
auto
;
.right-wrap
{
.right-wrap
{
flex
:
1
;
flex
:
1
;
...
...
src/view/myTag/myTagDetail.vue
View file @
0571deec
...
@@ -11,7 +11,7 @@
...
@@ -11,7 +11,7 @@
<div
class=
"checkboxOption-wrap__body"
>
<div
class=
"checkboxOption-wrap__body"
>
<div
class=
"checkboxOption-wrap__body__title"
>
标签值设置
</div>
<div
class=
"checkboxOption-wrap__body__title"
>
标签值设置
</div>
<!-- 选项控件 -->
<!-- 选项控件 -->
<template
v-if=
"
fals
e"
>
<template
v-if=
"
tru
e"
>
<div
class=
"checkboxOption-wrap__body__checkAll border-box"
>
<div
class=
"checkboxOption-wrap__body__checkAll border-box"
>
<el-checkbox
:indeterminate=
"tagData.isIndeterminate"
v-model=
"tagData.checkAll"
@
change=
"handleCheckAllChange"
>
全选
</el-checkbox>
<el-checkbox
:indeterminate=
"tagData.isIndeterminate"
v-model=
"tagData.checkAll"
@
change=
"handleCheckAllChange"
>
全选
</el-checkbox>
</div>
</div>
...
@@ -21,6 +21,7 @@
...
@@ -21,6 +21,7 @@
</el-checkbox-group>
</el-checkbox-group>
</div>
</div>
</
template
>
</
template
>
<!-- 数字范围 -->
<!-- 数字范围 -->
<
template
v-if=
"true"
>
<
template
v-if=
"true"
>
<div
class=
"m-b-20"
>
<div
class=
"m-b-20"
>
...
@@ -30,15 +31,16 @@
...
@@ -30,15 +31,16 @@
<label
class=
"label-tip"
>
注:如果起始值为空则视为小于等于最大输入值;如果最大值为空则视为大于等于最小输入值!
</label>
<label
class=
"label-tip"
>
注:如果起始值为空则视为小于等于最大输入值;如果最大值为空则视为大于等于最小输入值!
</label>
</div>
</div>
</
template
>
</
template
>
<!-- 时间属性-固定时段/相对时段 -->
<!-- 时间属性-固定时段/相对时段 -->
<
template
v-if=
"
tru
e"
>
<
template
v-if=
"
fals
e"
>
<el-radio
v-model=
"tagData.radio"
label=
"1"
>
固定时段
</el-radio>
<el-radio
v-model=
"tagData.radio"
label=
"1"
>
固定时段
</el-radio>
<el-radio
v-model=
"tagData.radio"
label=
"2"
>
相对时段
</el-radio>
<el-radio
v-model=
"tagData.radio"
label=
"2"
>
相对时段
</el-radio>
<!-- 固定时段 -->
<!-- 固定时段 -->
<div
class=
"m-t-18"
>
<div
class=
"m-t-18
w-438 p-20 border-box bg-f3f6f9"
v-if=
"tagData.radio == 1
"
>
<el-date-picker
<el-date-picker
v-model=
"tagData.daterangeValue"
v-model=
"tagData.daterangeValue"
v-if=
"tagData.radio == 1"
type=
"daterange"
type=
"daterange"
:editable=
"false"
:editable=
"false"
range-separator=
"至"
range-separator=
"至"
...
@@ -52,11 +54,11 @@
...
@@ -52,11 +54,11 @@
</el-date-picker>
</el-date-picker>
</div>
</div>
<!-- 相对时段 -->
<!-- 相对时段 -->
<div
class=
"relative-range border-box"
v-if=
"tagData.radio != 1"
>
<div
class=
"relative-range
m-t-18
border-box"
v-if=
"tagData.radio != 1"
>
<div>
<div>
<div>
<div>
<label
class=
"inline-block w-98 label-unit"
>
时间精度
</label>
<label
class=
"inline-block w-98 label-unit"
>
时间精度
</label>
<el-radio-group
v-model=
"tagData.timeRadio"
>
<el-radio-group
v-model=
"tagData.timeRadio"
@
change=
"timeRadioChange"
>
<el-radio
label=
"1"
>
天
</el-radio>
<el-radio
label=
"1"
>
天
</el-radio>
<el-radio
label=
"2"
>
月
</el-radio>
<el-radio
label=
"2"
>
月
</el-radio>
<el-radio
label=
"3"
>
年
</el-radio>
<el-radio
label=
"3"
>
年
</el-radio>
...
@@ -64,32 +66,239 @@
...
@@ -64,32 +66,239 @@
</div>
</div>
<div
class=
"m-t-20"
>
<div
class=
"m-t-20"
>
<label
class=
"inline-block w-98"
></label>
<label
class=
"inline-block w-98"
></label>
<el-checkbox
v-model=
"tagData.timeChecked"
>
当
{{
tagData
.
timeRadio
==
1
?
'天'
:
tagData
.
timeRadio
==
2
?
'月'
:
'年'
}}
</el-checkbox>
<el-checkbox
v-model=
"tagData.timeChecked"
>
<label
class=
"inline-block middle"
>
当
{{
tagData
.
timeRadio
==
1
?
'天'
:
tagData
.
timeRadio
==
2
?
'月'
:
'年'
}}
</label>
</el-checkbox>
</div>
</div>
<div
class=
"m-t-20"
>
<div
class=
"m-t-20"
>
<label
class=
"inline-block w-98"
></label>
<label
class=
"inline-block w-98"
></label>
<el-checkbox
v-model=
"tagData.timeChecked"
>
</el-checkbox>
<el-checkbox
v-model=
"tagData.timeChecked
Two
"
>
</el-checkbox>
<el-select
v-model=
"tagData.timeSelect"
placeholder=
"请选择"
class=
"w-86"
>
<el-select
v-model=
"tagData.timeSelect"
placeholder=
"请选择"
class=
"w-86
m-l-8
"
>
<el-option
label=
"前"
value=
"1"
></el-option>
<el-option
label=
"前"
value=
"1"
></el-option>
<el-option
label=
"后"
value=
"2"
></el-option>
<el-option
label=
"后"
value=
"2"
></el-option>
</el-select>
</el-select>
<el-input
v-model=
"tagData.timeInput"
placeholder=
"请输入"
class=
"w-90"
></el-input>
<el-input
v-model=
"tagData.timeInput"
placeholder=
"请输入"
class=
"w-90"
@
blur=
"(value) => toEditDateInput(value,tagData.timeRadio)"
></el-input>
<label
class=
"inline-block middle label-unit"
>
天
</label>
<template
v-if=
"tagData.timeRadio==1"
>
<label
class=
"inline-block middle label-tip"
>
正整数,最大365
</label>
<label
class=
"inline-block middle label-unit m-l-8"
>
天
</label>
<label
class=
"inline-block middle label-tip"
>
正整数,最大365
</label>
</
template
>
<
template
v-if=
"tagData.timeRadio==2"
>
<label
class=
"inline-block middle label-unit m-l-8"
>
月
</label>
<label
class=
"inline-block middle label-tip"
>
正整数,最大12
</label>
</
template
>
<
template
v-if=
"tagData.timeRadio==3"
>
<label
class=
"inline-block middle label-unit m-l-8"
>
年
</label>
<label
class=
"inline-block middle label-tip"
>
正整数,最大2
</label>
</
template
>
</div>
</div>
</div>
</div>
</div>
</div>
</template>
</template>
<!-- 最近 天 -->
<!-- 最近 天 -->
<
template
v-if=
"
tru
e"
>
<
template
v-if=
"
fals
e"
>
<div>
<div>
<
el-input
v-model=
"tagData.timeRecent"
placeholder=
"请输入"
class=
"w-90"
@
blur=
"(value) => toEditInput(value,'timeRecent')"
></el-input
>
<
label
class=
"inline-block middle label-unit"
>
最近
</label><el-input
v-model=
"tagData.timeRecent"
placeholder=
"请输入"
class=
"w-90 m-r-20 m-l-20"
@
blur=
"(value) => toEditInput(value,'timeRecent')"
></el-input><label
class=
"inline-block middle label-unit"
>
天
</label
>
</div>
</div>
</
template
>
</
template
>
<!-- 之后 天 -->
<!-- 之后 天 -->
<
template
v-if=
"true"
>
<
template
v-if=
"false"
>
<div>
<label
class=
"inline-block middle label-unit"
>
之后
</label><el-input
v-model=
"tagData.timeAfter"
placeholder=
"请输入"
class=
"w-90 m-r-20 m-l-20"
@
blur=
"(value) => toEditInput(value,'timeAfter')"
></el-input><label
class=
"inline-block middle label-unit"
>
天
</label>
</div>
</
template
>
<!-- 属于/不属于 -->
<
template
v-if=
"false"
>
<div>
<el-radio
v-model=
"tagData.computeRadio"
label=
"1"
>
属于
</el-radio>
<el-radio
v-model=
"tagData.computeRadio"
label=
"2"
>
不属于
</el-radio>
</div>
</
template
>
<!-- 固定时段/最近 -->
<
template
v-if=
"false"
>
<div>
<el-radio
v-model=
"tagData.fixedRecentRadio"
label=
"1"
>
固定时段
</el-radio>
<el-radio
v-model=
"tagData.fixedRecentRadio"
label=
"2"
>
最近时段
</el-radio>
</div>
<!-- 固定时段 -->
<div
class=
"m-t-18 w-526 h-80 fixed-date-picker border-box bg-f3f6f9"
>
<label
class=
"inline-block middle label-unit m-r-8"
v-if=
"tagData.fixedRecentRadio == 1"
>
时间范围
</label><el-date-picker
v-model=
"tagData.fixedRecentRangeValue"
v-if=
"tagData.fixedRecentRadio == 1"
type=
"daterange"
:editable=
"false"
range-separator=
"至"
start-placeholder=
"开始时间"
end-placeholder=
"结束时间"
format=
"yyyyMMdd"
value-format=
"yyyyMMdd"
:default-time=
"['000000', '235959']"
>
<!-- :picker-options="pickerOptions" -->
</el-date-picker>
<div
v-if=
"tagData.fixedRecentRadio == 2"
>
<label
class=
"inline-block middle label-unit m-r-8"
>
最近
</label><el-input
v-model=
"tagData.fixedRecentTimeRecent"
placeholder=
"请输入"
class=
"w-90 m-r-8"
@
blur=
"(value) => toEditInput(value,'fixedRecentTimeRecent')"
></el-input><label
class=
"inline-block middle label-unit"
>
天
</label>
</div>
</div>
</
template
>
<!-- 输入添加值 -->
<
template
v-if=
"false"
>
<div>
<div>
<el-input
v-model=
"tagData.timeAfter"
placeholder=
"请输入"
class=
"w-90"
@
blur=
"(value) => toEditInput(value,'timeAfter')"
></el-input>
<el-input
v-model=
"tagData.addInputValue"
placeholder=
"请输入"
class=
"w-184 m-t-20 m-r-20"
></el-input><el-button
class=
"m-t-20 middle"
type=
"text"
@
click
.
stop=
"addInputVal"
>
添加
</el-button>
</div>
<div
class=
"m-t-18 add-tags-wrap"
>
<template
v-for=
"(item,index) in tagData.addTags"
>
<span
class=
"el-tag"
>
{{
item
.
value
}}
<i
class=
"el-tag__close el-icon-close"
@
click=
"delInputVal(index)"
></i></span>
</
template
>
</div>
</template>
<!-- 输入搜索下拉多选 添加值 -->
<
template
v-if=
"false"
>
<div
class=
"m-t-18 add-search-select"
>
<el-select
size=
"small"
v-model=
"tagData.searchModel"
multiple
filterable
remote
reserve-keyword
placeholder=
"请输入关键词"
:reserve-keyword=
"false"
:remote-method=
"remoteMethod"
class=
"el-select--small"
>
<el-option
v-for=
"item in tagData.searchOptions"
:key=
"item.key"
:label=
"item.value"
:value=
"item.key"
>
</el-option>
</el-select><el-button
class=
"m-l-8 middle"
type=
"text"
@
click
.
stop=
"addSearchSelectVal"
>
添加
</el-button>
</div>
<div
class=
"m-t-18 add-tags-wrap"
>
<template
v-for=
"(item,index) in tagData.addSelectTags"
>
<span
class=
"el-tag"
>
{{
item
.
value
}}
<i
class=
"el-tag__close el-icon-close"
@
click=
"delSearchSelectVal(index)"
></i></span>
</
template
>
</div>
</template>
<!-- 存在其一/所有,/属于不属于 -->
<
template
v-if=
"false"
>
<div>
<el-select
v-model=
"tagData.selectOne"
placeholder=
"请选择"
class=
"w-98 m-l-8"
>
<el-option
label=
"所有"
value=
"1"
></el-option>
<el-option
label=
"存在其一"
value=
"2"
></el-option>
</el-select><label
class=
"inline-block middle label-unit m-l-8"
>
{{
tagData
.
selectLabel
}}
</label><el-select
v-model=
"tagData.selectTwo"
placeholder=
"请选择"
class=
"w-98 m-l-8"
>
<el-option
label=
"属于"
value=
"1"
></el-option>
<el-option
label=
"不属于"
value=
"2"
></el-option>
</el-select><label
class=
"inline-block middle label-tip m-l-8"
>
{{
tagData
.
selectLabelTip
}}
</label>
</div>
</
template
>
<!-- 多选项( 全部选项/已选选项 ) -->
<
template
v-if=
"false"
>
<div
class=
"multiple-select-wrap"
>
<div
class=
"multiple-select-wrap__search w-184"
>
<el-input
placeholder=
"请输入关键字搜索"
prefix-icon=
"el-icon-search"
v-model=
"tagData.inputSearch"
@
keyup
.
native=
"(value) => toSearchInput(value)"
>
</el-input>
</div>
<div
class=
"multiple-select-wrap__body m-t-18"
>
<div
class=
"multiple-select-wrap__tab"
>
<el-tabs
v-model=
"tagData.allSelectActive"
>
<el-tab-pane
label=
"全部选项"
name=
"first"
>
<div
class=
"all-select-options"
>
<template
v-for=
"(item,index) in tagData.allSelectOptions"
>
<el-checkbox
v-model=
"item.check"
@
change=
"allSelectChange($event,index,item)"
>
{{
item
.
name
}}
</el-checkbox>
</
template
>
</div>
</el-tab-pane>
<el-tab-pane
:label=
"'已选选项(' +tagData.selectedOptions.length+ ')'"
name=
"second"
>
<div
class=
"slected-opyions"
>
<
template
v-for=
"(item,index) in tagData.selectedOptions"
>
<span
class=
"el-tag"
>
{{
item
.
name
}}
<i
class=
"el-tag__close el-icon-close"
@
click=
"delallSelectVal(index,item)"
></i></span>
</
template
>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</template>
<!-- 多选项 城市选择( 全部选项/已选选项 ) -->
<
template
v-if=
"true"
>
<div
class=
"multiple-select-wrap city-select-wrap"
>
<div
class=
"multiple-select-wrap__search w-184"
>
<el-input
placeholder=
"请输入关键字搜索"
prefix-icon=
"el-icon-search"
v-model=
"tagData.inputSearch"
@
keyup
.
native=
"(value) => toSearchInput(value,'city')"
>
</el-input>
</div>
<div
class=
"multiple-select-wrap__body m-t-18"
>
<div
class=
"multiple-select-wrap__tab"
>
<el-tabs
v-model=
"tagData.citySelectActive"
>
<el-tab-pane
label=
"全部选项"
name=
"first"
>
<div
class=
"all-select-options"
>
<div
class=
"city-checkbox city-checkbox-all border-box"
>
<el-checkbox
:indeterminate=
"tagData.isIndeterminateCity"
v-model=
"tagData.checkAllCity"
@
change=
"cityCheckAllChange"
>
全选
</el-checkbox>
</div>
<el-checkbox-group
v-model=
"tagData.checkeditemsCity"
@
change=
"citySelectChange($event)"
>
<template
v-for=
"(item,index) in tagData.citySelectOptions"
>
<div
class=
"city-checkbox border-box"
>
<el-checkbox
:label=
"item.id"
:key=
"item.id"
><span
class=
"inline-block middle"
@
click
.
stop=
"toggleCity(item.id,item)"
>
{{
item
.
name
}}
</span></el-checkbox>
<div
class=
"el-select-dropdown el-popper is-multiple"
style=
"min-width: 240px; position: absolute; top: 30px; left: 0px; transform-origin: center top 0px; z-index: 2215;"
x-placement=
"bottom-start"
v-if=
"item.showCity"
>
<div
class=
"el-scrollbar"
style=
""
>
<div
class=
"el-select-dropdown__wrap el-scrollbar__wrap"
style=
"margin-bottom: -17px; margin-right: -17px;"
>
<ul
class=
"el-scrollbar__view el-select-dropdown__list"
>
<!---->
<li
class=
"el-select-dropdown__item selected hover"
><span>
黄金糕
</span></li>
<li
class=
"el-select-dropdown__item"
><span>
双皮奶
</span></li>
<li
class=
"el-select-dropdown__item"
><span>
蚵仔煎
</span></li>
<li
class=
"el-select-dropdown__item"
><span>
龙须面
</span></li>
<li
class=
"el-select-dropdown__item"
><span>
北京烤鸭
</span></li>
</ul>
</div>
<div
class=
"el-scrollbar__bar is-horizontal"
>
<div
class=
"el-scrollbar__thumb"
style=
"transform: translateX(0%);"
></div>
</div>
<div
class=
"el-scrollbar__bar is-vertical"
>
<div
class=
"el-scrollbar__thumb"
style=
"transform: translateY(0%);"
></div>
</div>
</div>
<!---->
<div
x-arrow=
""
class=
"popper__arrow"
style=
"left: 35px;"
></div>
</div>
</div>
</
template
>
</el-checkbox-group>
</div>
</el-tab-pane>
<el-tab-pane
:label=
"'已选选项(' +tagData.citySelectedOptions.length+ ')'"
name=
"second"
>
<div
class=
"slected-opyions city-slected-opyions"
>
<
template
v-for=
"(item,index) in tagData.citySelectedOptions"
>
<span
class=
"el-tag"
>
{{
item
.
name
}}
<i
class=
"el-tag__close el-icon-close"
@
click=
"delcitySelectVal(index,item)"
></i></span>
</
template
>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div>
</div>
</div>
</template>
</template>
...
@@ -111,6 +320,10 @@
...
@@ -111,6 +320,10 @@
import
navCrumb
from
'@/components/nav/nav.vue'
;
import
navCrumb
from
'@/components/nav/nav.vue'
;
import
checkboxOption
from
'@/components/tags/checkboxOption.vue'
;
import
checkboxOption
from
'@/components/tags/checkboxOption.vue'
;
import
checkboxOptionAsync
from
'@/components/tags/checkboxOptionAsync.vue'
;
import
checkboxOptionAsync
from
'@/components/tags/checkboxOptionAsync.vue'
;
import
strLength
from
'@/common/js/strlen'
;
import
showMsg
from
'@/common/js/showmsg'
;
import
errMsg
from
'@/common/js/error'
;
import
{
_debounce
}
from
"@/common/js/public"
;
import
{
getRequest
,
postRequest
,
postJson
,
postForm
}
from
'@/api/api'
;
import
{
getRequest
,
postRequest
,
postJson
,
postForm
}
from
'@/api/api'
;
export
default
{
export
default
{
name
:
"myTagDetail"
,
name
:
"myTagDetail"
,
...
@@ -133,7 +346,7 @@
...
@@ -133,7 +346,7 @@
tagData
:
{
tagData
:
{
name
:
'性别'
,
name
:
'性别'
,
des
:
'根据描述根据描述根据描述根据描述根据描述根据描述根据描述根
据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述根据描述
'
,
des
:
'根据描述根据描述根据描述根据描述根据描述根据描述根据描述根'
,
// 选项控件
// 选项控件
checkeditems
:
[],
checkeditems
:
[],
isIndeterminate
:
false
,
isIndeterminate
:
false
,
...
@@ -157,6 +370,7 @@
...
@@ -157,6 +370,7 @@
// 相对时间
// 相对时间
timeRadio
:
"1"
,
timeRadio
:
"1"
,
timeChecked
:
false
,
timeChecked
:
false
,
timeCheckedTwo
:
false
,
timeSelect
:
'1'
,
timeSelect
:
'1'
,
timeInput
:
''
,
timeInput
:
''
,
...
@@ -164,6 +378,86 @@
...
@@ -164,6 +378,86 @@
timeRecent
:
''
,
timeRecent
:
''
,
// 之后 天
// 之后 天
timeAfter
:
''
,
timeAfter
:
''
,
// 属于/不属于
computeRadio
:
'1'
,
// 时间属性-固定时段/最近
fixedRecentRadio
:
'1'
,
fixedRecentRangeValue
:
[],
fixedRecentTimeRecent
:
''
,
// 添加输入值
addInputValue
:
''
,
addTags
:
[],
// 搜索下拉多选添加值
searchModel
:
[],
searchOptions
:
[
{
key
:
1
,
value
:
'测试去1'
},
{
key
:
2
,
value
:
'测试去2'
},
{
key
:
3
,
value
:
'测试去3'
},
{
key
:
4
,
value
:
'测试去4'
}
],
addSelectTags
:
[],
// 多范围()
selectOne
:
'1'
,
selectTwo
:
'1'
,
selectLabel
:
'曾经消费门店'
,
selectLabelTip
:
'注:存在其一即会员至少有一个字段值满足所选条件;所有即会员的所有字段值满足所选条件'
,
// 多选项( 全部选项/已选选项 )
allSelectActive
:
'first'
,
inputSearch
:
''
,
allSelectOptions
:
[
{
id
:
1
,
check
:
false
,
name
:
'欧时力'
},
{
id
:
2
,
check
:
false
,
name
:
'伊芙丽'
}
],
selectedOptions
:[],
// 多选项(城市选择) ( 全部选项/已选选项 )
citySelectActive
:
'first'
,
isIndeterminateCity
:
false
,
checkAllCity
:
false
,
citySelectOptions
:
[
{
id
:
1
,
check
:
false
,
name
:
'北京'
,
showCity
:
false
},
{
id
:
2
,
check
:
false
,
name
:
'河北'
,
showCity
:
false
}
],
checkeditemsCity
:
[],
// 已选省
citySelectedOptions
:
[],
}
}
}
}
},
},
...
@@ -183,18 +477,43 @@
...
@@ -183,18 +477,43 @@
},
},
/**
/**
* 全选
*/
handleCheckAllChange
(
val
)
{
var
that
=
this
if
(
val
)
{
that
.
tagData
.
options
.
forEach
(
function
(
el
,
index
)
{
that
.
tagData
.
checkeditems
.
push
(
el
.
id
)
})
}
else
{
that
.
tagData
.
checkeditems
=
[]
}
that
.
tagData
.
isIndeterminate
=
false
;
},
/**
* 单选
*/
handleCheckedChange
(
value
)
{
var
that
=
this
let
checkedCount
=
value
.
length
;
that
.
tagData
.
checkAll
=
checkedCount
===
that
.
tagData
.
options
.
length
;
that
.
tagData
.
isIndeterminate
=
checkedCount
>
0
&&
checkedCount
<
that
.
tagData
.
options
.
length
;
},
/**
* 数字区间
* 数字区间
*/
*/
blurFrom
(
e
){
blurFrom
(
e
){
var
that
=
this
var
that
=
this
var
value
=
!
Number
(
e
.
target
.
value
.
replace
(
/
[^\d]
/g
,
''
))?
Number
(
0
):
Number
(
e
.
target
.
value
.
replace
(
/
[^\
.\
d]
/g
,
''
))
var
value
=
!
Number
(
e
.
target
.
value
.
replace
(
/
[^\d]
/g
,
''
))?
Number
(
0
):
Number
(
e
.
target
.
value
.
replace
(
/
[^\d]
/g
,
''
))
// 判断输入
// 判断输入
let
v1
=
that
.
tagData
.
numRange
[
0
];
let
v1
=
that
.
tagData
.
numRange
[
0
];
let
v2
=
that
.
tagData
.
numRange
[
1
]
let
v2
=
that
.
tagData
.
numRange
[
1
]
if
(
!
Number
(
v2
)
||
Number
(
v1
)
>=
Number
(
v2
))
{
if
(
!
Number
(
v2
)
||
Number
(
v1
)
>=
Number
(
v2
))
{
console
.
log
(
"输入值From:v2"
,
Number
(
v1
),
v2
,
value
)
that
.
tagData
.
numRange
[
0
]
=
value
that
.
tagData
.
numRange
[
0
]
=
value
that
.
tagData
.
numRange
[
1
]
=
Number
((
!!
Number
(
v1
)?
Number
(
v1
):
0
)
+
1
)
that
.
tagData
.
numRange
[
1
]
=
Number
((
!!
Number
(
v1
)?
Number
(
v1
):
0
)
+
1
)
that
.
$forceUpdate
();
that
.
$forceUpdate
();
...
@@ -207,7 +526,7 @@
...
@@ -207,7 +526,7 @@
blurTo
(
e
){
blurTo
(
e
){
var
that
=
this
var
that
=
this
var
value
=
!
Number
(
e
.
target
.
value
.
replace
(
/
[^\
.\d]
/g
,
''
))?
Number
(
0
):
Number
(
e
.
target
.
value
.
replace
(
/
[^\.
\d]
/g
,
''
))
var
value
=
!
Number
(
e
.
target
.
value
.
replace
(
/
[^\
d]
/g
,
''
))?
Number
(
0
):
Number
(
e
.
target
.
value
.
replace
(
/
[^
\d]
/g
,
''
))
let
t1
=
that
.
tagData
.
numRange
[
0
];
let
t1
=
that
.
tagData
.
numRange
[
0
];
let
t2
=
that
.
tagData
.
numRange
[
1
]
let
t2
=
that
.
tagData
.
numRange
[
1
]
...
@@ -224,19 +543,16 @@
...
@@ -224,19 +543,16 @@
that
.
tagData
.
numRange
[
0
]
=
Number
(
t2
)
-
1
that
.
tagData
.
numRange
[
0
]
=
Number
(
t2
)
-
1
}
}
that
.
$forceUpdate
();
that
.
$forceUpdate
();
return
return
}
}
that
.
tagData
.
numRange
[
1
]
=
value
that
.
conditionsList
[
that
.
andIndex
].
children
[
that
.
orIndex
].
children
[
2
].
levelModel
[
1
]
=
value
that
.
conditionsList
[
that
.
andIndex
].
children
[
that
.
orIndex
].
columnValue
=
that
.
conditionsList
[
that
.
andIndex
].
children
[
that
.
orIndex
].
children
[
2
].
levelModel
.
join
(
','
)
that
.
$forceUpdate
();
that
.
$forceUpdate
();
},
},
/**
// 最近,之后 天输入
* 最近,之后 天输入
*/
toEditInput
(
e
,
tag
)
{
toEditInput
(
e
,
tag
)
{
console
.
log
(
e
,
tag
)
console
.
log
(
e
,
tag
)
var
that
=
this
var
that
=
this
...
@@ -249,7 +565,235 @@
...
@@ -249,7 +565,235 @@
newNum
=
365
newNum
=
365
}
}
that
.
tagData
[
tag
]
=
newNum
;
that
.
tagData
[
tag
]
=
newNum
;
}
},
/**
* 天/月/年 RadioChange
*/
timeRadioChange
(
e
)
{
var
that
=
this
console
.
log
(
e
)
// 每次改变选择,清空原有的值
that
.
tagData
.
timeInput
=
''
;
},
/**
* 天/月/年输入
*/
toEditDateInput
(
e
,
radio
)
{
console
.
log
(
e
,
radio
)
var
that
=
this
let
newNum
;
newNum
=
!!
parseInt
(
String
(
e
.
target
.
value
).
replace
(
/
[^\d]
/g
,
''
))?
parseInt
(
String
(
e
.
target
.
value
).
replace
(
/
[^\d]
/g
,
''
)):
1
if
(
newNum
<=
0
)
{
newNum
=
1
}
// 天
if
(
newNum
>
365
&&
radio
==
1
)
{
newNum
=
365
}
// 月
if
(
newNum
>
12
&&
radio
==
2
)
{
newNum
=
12
}
// 年
if
(
newNum
>
3
&&
radio
==
3
)
{
newNum
=
2
}
that
.
tagData
.
timeInput
=
newNum
;
},
/**
* 添加输入值
*/
addInputVal
()
{
var
that
=
this
if
(
!
that
.
tagData
.
addInputValue
.
trim
())
{
that
.
$message
.
error
({
duration
:
1000
,
message
:
"请输入值"
})
return
false
;
}
var
tagsMap
=
null
;
if
(
!!
that
.
tagData
.
addTags
.
length
)
{
tagsMap
=
that
.
tagData
.
addTags
.
map
(
item
=>
item
.
value
)
}
if
(
!!
tagsMap
&&
tagsMap
.
indexOf
(
that
.
tagData
.
addInputValue
)
!==
-
1
)
{
that
.
$message
.
error
({
duration
:
1000
,
message
:
"输入值已存在"
})
return
false
;
}
that
.
tagData
.
addTags
.
push
(
{
value
:
that
.
tagData
.
addInputValue
}
)
that
.
tagData
.
addInputValue
=
''
},
/**
* 删除输入值
*/
delInputVal
(
index
)
{
var
that
=
this
that
.
tagData
.
addTags
.
splice
(
index
,
1
)
},
/**
* 输入搜索值
*/
remoteMethod
:
_debounce
(
function
(
query
)
{
var
that
=
this
;
console
.
log
(
"query:"
,
query
)
that
.
tagData
.
searchOptions
.
push
()
},
500
),
/**
* 添加已选的搜索值
*/
addSearchSelectVal
()
{
var
that
=
this
if
(
!
that
.
tagData
.
searchModel
.
length
)
{
that
.
$message
.
error
({
duration
:
1000
,
message
:
"请选择值"
})
return
false
;
}
var
tagsMap
=
null
;
if
(
!!
that
.
tagData
.
addSelectTags
.
length
)
{
tagsMap
=
that
.
tagData
.
addSelectTags
.
map
(
item
=>
item
.
value
)
}
console
.
log
(
tagsMap
)
that
.
tagData
.
searchOptions
.
forEach
(
function
(
ele
,
index
){
if
(
!!
tagsMap
&&
tagsMap
.
indexOf
(
ele
.
value
)
!=
-
1
)
{
// that.$message.error({
// duration: 1000,
// message: "输入值已存在"
// })
// that.tagData.searchModel = [];
return
false
;
}
if
(
that
.
tagData
.
searchModel
.
indexOf
(
ele
.
key
)
!=
-
1
)
{
that
.
tagData
.
addSelectTags
.
push
(
ele
)
}
})
that
.
tagData
.
searchModel
=
[]
console
.
log
(
that
.
tagData
.
addSelectTags
)
},
/**
* 删除已添加的搜索值
*/
delSearchSelectVal
(
index
){
var
that
=
this
that
.
tagData
.
addSelectTags
.
splice
(
index
,
1
)
},
/**
* 多选项( 全部选项/已选选项 )
*/
allSelectChange
(
e
,
index
,
item
)
{
var
that
=
this
console
.
log
(
e
,
index
,
item
,
that
.
tagData
.
allSelectOptions
)
if
(
!!
e
)
{
that
.
tagData
.
selectedOptions
.
push
(
item
)
}
else
{
if
(
!!
that
.
tagData
.
selectedOptions
.
length
)
{
that
.
tagData
.
selectedOptions
.
forEach
(
function
(
ele
,
index
){
if
(
ele
.
id
==
item
.
id
)
{
that
.
tagData
.
selectedOptions
.
splice
(
index
,
1
)
}
})
}
}
},
/**
* 删除已选择的值
*/
delallSelectVal
(
index
,
item
)
{
var
that
=
this
that
.
tagData
.
selectedOptions
.
splice
(
index
,
1
)
that
.
tagData
.
allSelectOptions
.
forEach
(
function
(
ele
,
index
){
if
(
ele
.
id
==
item
.
id
)
{
ele
.
check
=
false
;
}
})
},
/**
* 搜索选项值
*/
toSearchInput
:
_debounce
(
function
(
e
)
{
var
that
=
this
console
.
log
(
e
.
target
.
value
)
},
500
),
getSearchSelectOptions
()
{
var
that
=
this
},
/**
* 多选项 城市选择( 全部选项/已选选项 )
*/
cityCheckAllChange
(
val
)
{
var
that
=
this
if
(
val
)
{
that
.
tagData
.
citySelectOptions
.
forEach
(
function
(
el
,
index
)
{
that
.
tagData
.
checkeditemsCity
.
push
(
el
.
id
)
})
}
else
{
that
.
tagData
.
checkeditemsCity
=
[]
}
that
.
tagData
.
isIndeterminateCity
=
false
;
},
/**
* 多选项 城市选择( 全部选项/已选选项 )
*/
citySelectChange
(
value
)
{
var
that
=
this
console
.
log
(
value
)
let
cityCount
=
value
.
length
;
that
.
tagData
.
checkAllCity
=
cityCount
===
that
.
tagData
.
citySelectOptions
.
length
;
that
.
tagData
.
isIndeterminateCity
=
cityCount
>
0
&&
cityCount
<
that
.
tagData
.
citySelectOptions
.
length
;
},
/**
* 多选项 城市选择( 全部选项/已选选项 )-显示/隐藏市列表
*/
toggleCity
(
id
,
item
)
{
var
that
=
this
console
.
log
(
id
,
item
)
item
.
showCity
=
item
.
showCity
===
true
?
false
:
true
;
},
/**
* 多选项 城市选择 - 删除已选择的值
*/
delcitySelectVal
(
index
,
item
)
{
var
that
=
this
},
},
},
mounted
()
{
mounted
()
{
var
that
=
this
var
that
=
this
...
@@ -261,7 +805,7 @@
...
@@ -261,7 +805,7 @@
checkboxOption
,
checkboxOption
,
checkboxOptionAsync
checkboxOptionAsync
}
}
}
}
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
...
@@ -289,4 +833,121 @@
...
@@ -289,4 +833,121 @@
color
:
#909399
;
color
:
#909399
;
}
}
.w-438
{
width
:
438px
;
}
.w-526
{
width
:
526px
;
}
.h-80
{
height
:
80px
;
}
.fixed-date-picker
{
padding
:
20px
;
}
.bg-f3f6f9
{
background
:
#F3F6F9
;
}
.add-tags-wrap
{
width
:
380px
;
height
:
110px
;
overflow-y
:
auto
;
white-space
:
pre-wrap
;
border
:
1px
solid
#DCDFE6
;
border-radius
:
4px
;
.el-tag
{
background
:
none
;
background-color
:
none
;
border
:
none
;
font-size
:
14px
;
color
:
#606266
;
.el-tag__close
{
width
:
14px
;
height
:
14px
;
line-height
:
14px
;
font-size
:
12px
;
color
:
#fff
;
background
:
#DCDFE6
;
}
}
}
.add-search-select
{
.el-select
{
line-height
:
32px
;
span
{
-webkit-transform
:
scale
(
0
);
-ms-transform
:
scale
(
0
);
-o-transform
:
scale
(
0
);
transform
:
scale
(
0
);
}
}
}
.all-select-options
{
.el-checkbox
{
margin-right
:
16px
;
line-height
:
32px
;
&+.el-checkbox
{
margin-left
:
0
;
}
}
}
.slected-opyions
{
.el-tag
{
background
:
none
;
background-color
:
none
;
border
:
none
;
font-size
:
14px
;
color
:
#606266
;
.el-tag__close
{
width
:
14px
;
height
:
14px
;
line-height
:
14px
;
font-size
:
12px
;
color
:
#fff
;
background
:
#DCDFE6
;
}
}
&
.city-slected-opyions
{
.el-tag
{
background
:
#F4F4F5
;
border
:
1px
solid
rgba
(
233
,
233
,
235
,
1
);
font-size
:
12px
;
color
:
#909399
;
.el-tag__close
{
width
:
14px
;
height
:
14px
;
line-height
:
14px
;
font-size
:
12px
;
color
:
#fff
;
background
:
#DCDFE6
;
}
}
}
}
.city-checkbox
{
position
:
relative
;
height
:
50px
;
line-height
:
50px
;
padding
:
0
8px
;
&.city-checkbox-all
{
background
:
#F1F3F7
;
}
}
</
style
>
</
style
>
static/css/public.css
View file @
0571deec
...
@@ -334,6 +334,10 @@ input:focus {
...
@@ -334,6 +334,10 @@ input:focus {
margin-left
:
16px
;
margin-left
:
16px
;
}
}
.m-l-20
{
margin-left
:
20px
;
}
.m-t-10
{
.m-t-10
{
margin-top
:
10px
;
margin-top
:
10px
;
}
}
...
@@ -350,10 +354,18 @@ input:focus {
...
@@ -350,10 +354,18 @@ input:focus {
margin-right
:
8px
;
margin-right
:
8px
;
}
}
.m-r-20
{
margin-right
:
20px
;
}
.m-b-20
{
.m-b-20
{
margin-bottom
:
20px
;
margin-bottom
:
20px
;
}
}
.p-20
{
padding
:
20px
;
}
.p-lr-4
{
.p-lr-4
{
padding
:
0
4px
;
padding
:
0
4px
;
}
}
...
@@ -1071,4 +1083,15 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
...
@@ -1071,4 +1083,15 @@ input:-webkit-autofill, textarea:-webkit-autofill, select:-webkit-autofill {
line-height
:
60px
;
line-height
:
60px
;
}
}
.add-search-select
.el-select
span
{
display
:
none
;
-webkit-transform
:
scale
(
0
);
-ms-transform
:
scale
(
0
);
-o-transform
:
scale
(
0
);
transform
:
scale
(
0
);
}
.city-select-wrap
.el-tabs__content
{
overflow
:
unset
;
}
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment