Skip to content

A
apaas-ui
"src/components/bg-menu/index.vue" did not exist on "aeb7ef92377141f0766d3dfde84bd002734bcfff"
Commit 7d0e65fa authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

新建定向推送调试完成

parent ba907652
Hide whitespace changes
Inline Side-by-side
Showing with 403 additions and 187 deletions
src/components/app-build-steps/app-build-step.vue
View file @ 7d0e65fa
<template>
<div class="app_build_step" v-if="isActive">
<div class="app_build_step" v-show="isActive">
<slot></slot>
</div>
</template>
......
src/components/message-steps/select-service.vue
View file @ 7d0e65fa
......@@ -3,6 +3,8 @@
<screen-type
class="service_fliter"
:data="filterList"
:top_data="serviceTypes"
@topselect="changeType"
@getselect="getFilters"
></screen-type>
<div class="service_list apaas_scroll">
......@@ -29,6 +31,23 @@ export default {
},
data() {
return {
serviceTypes: {
name: "服务分类",
arr: [
{
id: 5,
name: "数据服务",
},
{
id: 6,
name: "时空服务",
},
{
id: 21,
name: "综合应用服务",
},
],
},
serviceType: 5, // 5：数据服务，6：时空服务，21：综合应用服务
filterList: [],
serviceList: [],
......@@ -63,8 +82,6 @@ export default {
organizations: organizations[serviceType],
};
this.filterList = [];
this.$http
.get("/apaas/serviceapp/v3/servicemarket/profileInfo", {
params: {
......@@ -72,6 +89,8 @@ export default {
},
})
.then(({ data }) => {
this.filterList = [];
if (data.success == 1) {
let filters = data.data;
......@@ -89,14 +108,6 @@ export default {
}
});
},
getFilters(filters) {
this.getServiceList({
serviceName: filters.word,
serviceType2s: filters.serviceTypeInfo.join(),
dataDomains: filters.serviceDomain.join(),
organizeIds: filters.organizations.join(),
});
},
getServiceList(params = {}) {
this.$http
.get("/apaas/serviceapp/v3/servicemarket/list", {
......@@ -111,6 +122,19 @@ export default {
}
});
},
changeType(typeId) {
this.serviceType = typeId;
this.getFilterList();
this.getServiceList();
},
getFilters(filters) {
this.getServiceList({
serviceName: filters.word,
serviceType2s: filters.serviceTypeInfo.join(),
dataDomains: filters.serviceDomain.join(),
organizeIds: filters.organizations.join(),
});
},
changeValue(item) {
if (item.check) {
this.selected.push(item.data);
......
src/components/message-steps/select-template.vue
View file @ 7d0e65fa
<template>
<div class="select_template">
<div class="top_fliter template_fliter">
<show-more-filter class="filter_list">
<show-more-filter class="filter_list" ref="filters">
<div class="filter_item">
<span class="filter_title">消息模板搜索：</span>
<el-input
......@@ -162,6 +162,16 @@ export default {
},
};
},
computed: {
parentIsActive() {
return this.$parent.isActive;
},
},
watch: {
parentIsActive() {
this.$refs.filters.resize();
},
},
created() {
let _self = this;
......
src/components/message-steps/select-users.vue
View file @ 7d0e65fa
<template>
<div class="selected_user">
<p class="selected_title">目标用户：</p>
<div class="selected_list">
<span class="selected_item" v-for="item in selectedList" :key="item.id">
<span v-text="item.label"></span>
<i class="el-icon-close" @click="deleteItem(item)"></i>
</span>
<div class="selected_list" ref="selectedList">
<template v-for="(item, index) in selectedList">
<span
class="selected_more"
v-if="index + 1 === selectedList.length && showSelectedMore"
:key="'last_' + index"
>...</span
>
<span class="selected_item" :key="item.id">
<span v-text="item.label"></span>
<i class="el-icon-close" @click="deleteItem(item)"></i>
</span>
</template>
</div>
<div class="user_list apass_checkbox">
<el-input
......@@ -41,11 +49,19 @@ export default {
label: "label",
},
selectedList: [],
showSelectedMore: false,
};
},
created() {
this.getTargetUserList();
},
mounted() {
this.selectedListResize();
window.addEventListener("resize", this.selectedListResize);
},
destroyed() {
window.removeEventListener("resize", this.selectedListResize);
},
methods: {
getTargetUserList() {
this.$http
......@@ -152,10 +168,59 @@ export default {
}
});
this.selectedListResize();
// console.log(users);
this.$emit("change", users);
},
selectedListResize() {
this.$nextTick(() => {
let container = this.$refs.selectedList;
let containerWidth = container.getBoundingClientRect().width - 10;
let items = container.querySelectorAll(".selected_item");
let itemsLength = items.length;
let itemsWidth = [];
let totalWidth = 0;
if (items.length < 1) {
return;
}
this.showSelectedMore = false;
for (let i = 0; i < itemsLength; i++) {
let item = items[i];
let itemWidth = 0;
item.style.display = "inline-block";
itemWidth = Math.ceil(item.getBoundingClientRect().width) + 10;
itemsWidth.push(itemWidth);
totalWidth += itemWidth;
if (totalWidth > containerWidth) {
this.showSelectedMore = true;
}
}
if (this.showSelectedMore) {
let showItemWidth = itemsWidth[itemsLength - 1] + 30; // 最后一个元素的宽度 + 省略号的宽度
for (let i = 0; i < itemsLength - 1; i++) {
let item = items[i];
showItemWidth += itemsWidth[i];
if (showItemWidth > containerWidth) {
item.style.display = "none";
}
}
}
});
},
},
};
</script>
......@@ -178,13 +243,14 @@ export default {
}
.selected_list {
flex-shrink: 0;
min-height: 44px;
height: 44px;
padding: 4px;
border: 1px solid #e3e5ef;
box-sizing: border-box;
border-radius: 7px;
overflow: hidden;
margin-top: 10px;
font-size: 0;
}
.selected_list .selected_item {
display: inline-block;
......@@ -193,10 +259,22 @@ export default {
border-radius: 3px;
overflow: hidden;
padding: 0 5px;
box-sizing: border-box;
min-width: 20px;
margin: 5px;
font-size: 12px;
line-height: 24px;
color: #0f2683;
}
.selected_more {
display: inline-block;
vertical-align: middle;
width: 20px;
margin: 5px;
font-size: 12px;
line-height: 24px;
color: #0f2683;
text-align: center;
}
.selected_list .selected_item > i {
cursor: pointer;
......
src/components/recommen/screen-type.vue
View file @ 7d0e65fa
<template>
<div class="type_contain">
<div class="type_header">
<div class="openbox" @click="openflag_func">
<span>{{openflag?'收起':'筛选'}}</span>
<i v-if="!openflag" class="el-icon-caret-bottom"></i>
<i v-if="openflag" class="el-icon-caret-top"></i>
<div class="type_contain">
<div class="type_header">
<div class="openbox" @click="openflag_func">
<span>{{ openflag ? "收起" : "筛选" }}</span>
<i v-if="!openflag" class="el-icon-caret-bottom"></i>
<i v-if="openflag" class="el-icon-caret-top"></i>
</div>
<el-input
class="search"
placeholder="请输入内容"
prefix-icon="el-icon-search"
@input="post_value()"
v-model="input2"
>
</el-input>
</div>
<div class="type_select" v-show="openflag">
<div class="line_data" style="overflow:hidden;">
<div class="select_name">{{ top_data.name }}：</div>
<div
ref="select_arr_box_top"
class="select_arr_box"
:style="
show_selected_top ? {} : { height: '52px', overflow: 'hidden' }
"
>
<div ref="select_item_top" style="overflow:hidden;">
<div
class="select_item"
v-for="(it, idx) in top_data.arr"
:key="idx + 7000"
:style="
it.id === selected_top
? { color: '#515fe7', fontWeight: 600 }
: {}
"
@click="set_top(it.id)"
>
{{ it.name }}
</div>
<el-input
class="search"
placeholder="请输入内容"
prefix-icon="el-icon-search"
@input="post_value()"
v-model="input2">
</el-input>
</div>
<div
v-show="show_open_top"
class="select_item_open"
@click="set_open_top"
>
<span>{{ show_selected_top ? "收起" : "展开" }}</span>
<i v-if="!show_selected_top" class="el-icon-caret-bottom"></i>
<i v-if="show_selected_top" class="el-icon-caret-top"></i>
</div>
</div>
<div class="type_select" v-show="openflag">
<div style="overflow:hidden;" class="line_data" v-for="(item,index) in data" :key="index+5000">
<div class="select_name">
{{item.name}}：
</div>
<div :ref="'select_arr_box'+index" class="select_arr_box" :style="show_selected[index]?{}:{height:'52px',overflow:'hidden'}">
<div :ref="'select_item'+index" style="overflow:hidden;">
<div class="select_item" :style="selected_arr[index].length==0?{color:'#515fe7',fontWeight:600}:''" @click="set_select(0,index)">全部</div>
<div class="select_item" :style="selected_arr[index].indexOf(it.id)!==-1?{color:'#515fe7',fontWeight:600}:{}" @click="set_select(1,index,it.id)" v-for="(it,idx) in item.arr" :key="idx+6000">
{{it.name}}
</div>
</div>
<div v-show="show_open[index]" class="select_item_open" @click="set_open(index)">
<span>{{show_selected[index]?'收起':'展开'}}</span>
<i v-if="!show_selected[index]" class="el-icon-caret-bottom"></i>
<i v-if="show_selected[index]" class="el-icon-caret-top"></i>
</div>
</div>
</div>
<div
v-for="(item, index) in filter_list"
:key="index + 5000"
class="line_data"
style="overflow:hidden;"
>
<div class="select_name">{{ item.name }}：</div>
<div
:ref="'select_arr_box' + index"
class="select_arr_box"
:style="
show_selected[index] ? {} : { height: '52px', overflow: 'hidden' }
"
>
<div :ref="'select_item' + index" style="overflow:hidden;">
<div
class="select_item"
v-for="(it, idx) in item.arr"
:key="idx + 6000"
:style="
selected_arr[index].indexOf(it.id) !== -1
? { color: '#515fe7', fontWeight: 600 }
: {}
"
@click="set_select(index, it.id)"
>
{{ it.name }}
</div>
</div>
<div
v-show="show_open[index]"
class="select_item_open"
@click="set_open(index)"
>
<span>{{ show_selected[index] ? "收起" : "展开" }}</span>
<i v-if="!show_selected[index]" class="el-icon-caret-bottom"></i>
<i v-if="show_selected[index]" class="el-icon-caret-top"></i>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
props: ['data'],
components: {
props: {
top_data: {
type: Object,
default: () => null,
},
data() {
return {
input2:'',
openflag:false,
selected_arr:[
[],
[],
[],
],
show_selected:[
false,
false,
false
],
show_open:[
false,
false,
false
]
};
data: {
type: Array,
default: () => [],
},
watch: {
},
components: {},
data() {
return {
input2: "",
openflag: false,
selected_arr: [],
show_selected: [],
show_open: [],
filter_list: [],
selected_top: "",
show_selected_top: false,
show_open_top: false,
};
},
watch: {
data: {
handler() {
this.init();
},
deep: true,
},
computed: {
},
computed: {},
created() {
if (this.top_data) {
this.selected_top = this.top_data.arr[0].id;
}
this.init(true);
},
mounted() {
window.addEventListener("resize", this.pageResize);
},
destroyed() {
window.removeEventListener("resize", this.pageResize);
},
methods: {
init() {
this.selected_arr = [];
this.show_selected = [];
this.show_open = [];
this.filter_list = [];
this.data.forEach((item, index) => {
let arr = [
{
id: "",
name: "全部",
},
...item.arr,
];
this.selected_arr.push([arr[0].id]);
this.show_selected.push(false);
this.show_open.push(false);
this.filter_list.push({
name: item.name,
arr: arr,
key: item.key,
});
});
},
openflag_func() {
this.openflag = !this.openflag;
setTimeout(() => {
this.pageResize();
}, 100);
this.$emit("open_select", this.openflag);
},
created() {
pageResize() {
this.$nextTick(() => {
if (
this.$refs.select_item_top &&
this.$refs.select_item_top.clientHeight >
this.$refs.select_arr_box_top.clientHeight + 2
) {
this.show_open_top = true;
} else {
this.show_open_top = false;
}
this.data.forEach((item, index) => {
if (
this.$refs["select_item" + index] &&
this.$refs["select_item" + index][0].clientHeight >
this.$refs["select_arr_box" + index][0].clientHeight + 2
) {
this.$set(this.show_open, index, true);
} else {
this.$set(this.show_open, index, false);
}
});
});
},
mounted() {
window.addEventListener("resize", this.pageResize);
set_select(index, id) {
if (this.selected_arr[index].indexOf(id) == -1) {
this.selected_arr[index].push(id);
} else {
this.selected_arr[index].splice(
this.selected_arr[index].indexOf(id),
1
);
}
this.post_value();
},
destroyed(){
window.removeEventListener("resize", this.pageResize);
set_open(index) {
this.$set(this.show_selected, index, !this.show_selected[index]);
},
methods: {
openflag_func(){
this.openflag = !this.openflag;
setTimeout(()=>{
this.pageResize()
},100)
this.$emit('open_select',this.openflag)
},
pageResize(){
if(this.$refs.select_item0[0].clientHeight>this.$refs.select_arr_box0[0].clientHeight+2){
this.$set(this.show_open,0,true)
}else{
this.$set(this.show_open,0,false)
}
if(this.$refs.select_item1[0].clientHeight>this.$refs.select_arr_box1[0].clientHeight+2){
this.$set(this.show_open,1,true)
}else{
this.$set(this.show_open,1,false)
}
if(this.$refs.select_item2[0].clientHeight>this.$refs.select_arr_box2[0].clientHeight+2){
this.$set(this.show_open,2,true)
}else{
this.$set(this.show_open,2,false)
}
},
set_select(n,index,id){
if(n==0){
this.$set(this.selected_arr,index,[])
}else{
if(this.selected_arr[index].indexOf(id)==-1){
this.selected_arr[index].push(id)
}else{
this.selected_arr[index].splice(this.selected_arr[index].indexOf(id), 1)
}
}
this.post_value()
},
set_open(index){
this.$set(this.show_selected,index,!this.show_selected[index])
},
post_value(){
var temp = {
word:this.input2,
}
this.data.forEach((e,idx) => {
temp[e.key] = this.selected_arr[idx]
});
this.$emit('getselect',temp)
}
set_open_top(index) {
this.show_selected_top = !this.show_selected_top;
},
set_top(id) {
this.selected_top = id;
this.$emit("topselect", this.selected_top);
},
post_value() {
var temp = {
word: this.input2,
};
this.data.forEach((e, idx) => {
temp[e.key] = this.selected_arr[idx];
});
this.$emit("getselect", temp);
},
},
};
</script>
<style>
.type_header .el-input__inner{
width: 240px;
background-color: #f7f8f9;
.type_header .el-input__inner {
width: 240px;
background-color: #f7f8f9;
}
.type_header .el-input{
width: 240px;
.type_header .el-input {
width: 240px;
}
</style>
<style scoped>
.type_contain{
width: 100%;
padding: 20px;
border-bottom: 1px solid #e9ecf3;
.type_contain {
width: 100%;
padding: 20px;
border-bottom: 1px solid #e9ecf3;
}
.type_header{
width: 100%;
overflow: hidden;
.type_header {
width: 100%;
overflow: hidden;
}
.openbox{
width: 105px;
height: 40px;
line-height: 40px;
text-align: center;
background-color: #f7f8f9;
border-radius: 8px;
border: solid 1px #e3e5ef;
float: left;
color: #58617a;
font-size: 14px;
cursor: pointer;
.openbox {
width: 105px;
height: 40px;
line-height: 40px;
text-align: center;
background-color: #f7f8f9;
border-radius: 8px;
border: solid 1px #e3e5ef;
float: left;
color: #58617a;
font-size: 14px;
cursor: pointer;
}
.search{
float: right;
.search {
float: right;
}
.select_name{
width: 100px;
text-align: right;
font-size: 14px;
color: #8890a7;
height: 52px;
line-height: 52px;
float: left;
.select_name {
width: 100px;
text-align: right;
font-size: 14px;
color: #8890a7;
height: 52px;
line-height: 52px;
float: left;
}
.select_arr_box{
width: calc(100% - 100px);
float: left;
border-bottom: 1px solid #e9ecf3;
overflow: hidden;
padding-left: 20px;
padding-right: 50px;
position: relative;
.select_arr_box {
width: calc(100% - 100px);
float: left;
border-bottom: 1px solid #e9ecf3;
overflow: hidden;
padding-left: 20px;
padding-right: 50px;
position: relative;
}
.type_select {
margin-top: 20px;
margin-top: 20px;
}
.type_select .line_data:nth-last-of-type(1) .select_arr_box{
border-bottom:0;
.type_select .line_data:nth-last-of-type(1) .select_arr_box {
border-bottom: 0;
}
.select_item,.select_item_open{
height: 52px;
line-height: 52px;
margin-right: 40px;
float: left;
color: #58617a;
cursor: pointer;
.select_item,
.select_item_open {
height: 52px;
line-height: 52px;
margin-right: 40px;
float: left;
color: #58617a;
cursor: pointer;
}
.select_arr_box .select_item_open{
position: absolute;
right:0;
margin-right: 10px;
top:0;
.select_arr_box .select_item_open {
position: absolute;
right: 0;
margin-right: 10px;
top: 0;
}
</style>
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