Skip to content

A
apaas-ui
Commit 5779633d authored by 徐一鸣's avatar 徐一鸣
Browse files
Options

定向推送管理列表页

parent f4583f49
Show whitespace changes
Inline Side-by-side
Showing with 382 additions and 25 deletions
src/components/apass-list.vue
View file @ 5779633d
......@@ -50,7 +50,7 @@
<div class="header-center">
<slot name="header-center"></slot>
</div>
<div class="header-right">
<div class="header-right" v-if="!hideSearch">
<el-input
v-model="searchValue"
prefix-icon="el-icon-search"
......@@ -138,6 +138,10 @@ export default {
type: Boolean,
default: () => false,
},
hideSearch: {
type: Boolean,
default: () => false,
},
searchPlaceholder: {
type: String,
default: () => "请输入关键字",
......@@ -277,3 +281,42 @@ export default {
margin-bottom: 20px;
}
</style>
<style>
.top_fliter {
display: flex;
}
.top_fliter > .filter_list {
flex-grow: 1;
}
.filter_list > .filter_item {
display: inline-block;
vertical-align: middle;
margin-top: 15px;
}
.filter_list > .filter_item + .filter_item {
margin-left: 25px;
}
.filter_list > .filter_item > .filter_title {
font-size: 14px;
font-weight: 700;
color: #242c43;
margin-right: 10px;
white-space: nowrap;
}
.filter_list > .filter_item > .filter_title + * {
width: 300px;
}
.top_fliter > .filter_action {
flex-shrink: 0;
margin-left: 25px;
text-align: right;
}
.filter_action > .el-button {
min-width: 90px;
margin-top: 15px;
}
.filter_action > .el-button + .el-button {
margin-left: 10px;
}
</style>
src/components/apass-table.vue
View file @ 5779633d
<template>
<div class="apass_table">
<el-table :data="data" @sort-change="sortChange">
<el-table-column
v-if="paddingLeft > 10"
:width="paddingLeft - 10"
></el-table-column>
<el-table-column v-if="paddingLeft > 10" :width="paddingLeft - 10">{{
paddingLeft
}}</el-table-column>
<el-table-column
v-for="(item, index) in header"
:label="item.label"
......@@ -75,13 +74,14 @@
/>
</div>
<div v-else-if="item.type === 'tag'" class="table_tag">
<template v-for="(item, index) in scope.row[item.prop]">
<el-tag
v-for="(item, index) in scope.row[item.prop]"
v-if="index <= 1 || tag_flag_arr[scope.$index] == 1"
:key="index + 5515"
:key="'tag_' + index"
>
{{ item }}
</el-tag>
</template>
<div
class="tagclo btn_down"
v-if="
......@@ -122,6 +122,18 @@
:width="item.size"
/>
</div>
<div v-else-if="item.type === 'image-tooltip'" class="img_content">
<el-tooltip
effect="dark"
:content="item.getTooltip ? item.getTooltip(scope.row) : item.tooltip"
placement="top"
>
<img
:src="item.getImage && item.getImage(scope.row)"
:width="item.size"
/>
</el-tooltip>
</div>
<div
v-else-if="
item.type === 'tooltip' &&
......
src/components/table/table-filter.vue
View file @ 5779633d
......@@ -24,7 +24,6 @@
@click.prevent="selectFilter(item.prop, v)"
>
<el-tooltip
class="item"
effect="dark"
:content="v.name"
placement="top"
......
src/pages/message-management/directed-push/directed-push-list.vue
View file @ 5779633d
<template>
<div>
<el-breadcrumb separator="/" class="bread_crumb1 bread_left">
<el-breadcrumb-item :to="{ path: '/message' }">{{ $t("lang.message") }}</el-breadcrumb-item>
<el-breadcrumb-item>{{ $t("lang.directed_push") }}</el-breadcrumb-item>
<div class="list_container">
<apass-list
ref="list"
:list-header="listHeader"
:list-data="listData"
:list-total="listTotal"
:hide-search="true"
:list-padding-left="0"
@list-action="initList"
>
<el-breadcrumb separator="/" slot="breadcrumb">
<el-breadcrumb-item :to="{ path: '/message' }">
{{ $t("lang.message") }}
</el-breadcrumb-item>
<el-breadcrumb-item>
{{ $t("lang.directed_push") }}
</el-breadcrumb-item>
</el-breadcrumb>
<template slot="top">
<div class="top_fliter">
<div class="filter_list">
<div class="filter_item">
<span class="filter_title">消息模板名称：</span>
<el-input
v-model="topFilter.name"
placeholder="请输入消息模板名称"
></el-input>
</div>
<div class="filter_item">
<span class="filter_title">状态：</span>
<el-select v-model="topFilter.state" placeholder="请选择">
<el-option label="全部" value=""> </el-option>
<el-option label="推送成功" value="1"> </el-option>
<el-option label="推送失败" value="0"> </el-option>
</el-select>
</div>
<div class="filter_item">
<span class="filter_title">推送时间：</span>
<el-date-picker
v-model="topFilter.time"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</div>
</div>
<div class="filter_action apass_button">
<el-button type="primary" @click="topFilterAction">
查询
</el-button>
<el-button type="defalut" @click="topFilterClear">
重置
</el-button>
</div>
</div>
</template>
<el-button type="primary" @click="addNew" slot="header-left">
新建
</el-button>
</apass-list>
<apass-dialog
ref="dialog"
:msg="dialogInfo.msg"
:cancel-text="dialogInfo.cancelText"
:cancel-type="dialogInfo.cancelType"
:cancel="dialogInfo.cancel"
:sunbmit-text="dialogInfo.sunbmitText"
:submit="dialogInfo.submit"
></apass-dialog>
</div>
</template>
<script>
import helper from "@/services/helper.js";
import apassList from "@/components/apass-list";
import apassDialog from "@/components/apass-dialog";
export default {
components: {},
data: () => ({}),
mounted() {},
methods: {}
components: {
apassList,
apassDialog,
},
data: () => ({
listHeader: [],
listData: [],
listTotal: 0,
dialogInfo: {
msg: "",
cancelText: "",
cancelType: "",
cancel: null,
sunbmitText: "",
submit: null,
},
topFilter: {
name: "",
state: "",
time: "",
},
tempFilter: null,
}),
methods: {
initList(filter) {
let fullFilter = {
...filter,
...this.topFilter,
};
this.tempFilter = fullFilter; // filter存档，用于页面刷新
console.log(fullFilter);
this.listTotal = 55;
this.listData = [
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["张三", "李四", "王五"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["张三", "李四", "王五"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 0,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 0,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["张三", "李四", "王五"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 1,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["张三", "李四", "王五"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 0,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
{
state: 0,
push_num: "propelling2020001",
name: "服务定向推送的消息",
detail:
"亲爱的用户，根据您的服务调用情况，我们向您推荐地图视频融合服务，欢迎使用！",
users: ["杨过", "小龙女", "冯宝宝"],
push_time: "2020-07-18T14:25:09+08:00",
},
];
/* this.$http
.get("/apaas/service/v3/resource/apply/approveList", {
params: {
search: filter.keyword,
page: filter.page,
limit: filter.size,
state: filter.state,
},
})
.then(({ data }) => {
if (data.success == 1) {
this.listTotal = data.total;
this.listData = data.data;
} else {
this.$message({
message: data.errMsg || "获取列表失败",
type: "warning",
});
}
})
.catch((error) => {
console.log(error);
}); */
},
topFilterAction() {
this.initList(this.tempFilter);
},
topFilterClear() {
this.topFilter = {
name: "",
state: "",
time: "",
};
this.initList(this.tempFilter);
},
showDialog() {
this.$refs.dialog.show();
},
addNew() {
console.log("新建模板");
},
detailAction(item) {
console.log(`查看${item.name}`);
},
},
created() {
this.listHeader = [
{
label: "",
prop: "state",
type: "image-tooltip",
getImage(item) {
return item.state == 1
? require("@/assets/imgs/ic_true.png")
: require("@/assets/imgs/ic_failed.png");
},
getTooltip(item) {
return item.state == 1 ? "推送成功" : "推送失败";
},
align: "center",
width: 60,
},
{
label: "推送流水号",
prop: "push_num",
width: 240,
},
{
label: "消息模板名称",
prop: "name",
type: "button",
callback: this.detailAction,
width: 300,
},
{
label: "消息详情",
prop: "detail",
},
{
label: "接收用户",
prop: "users",
getText(item) {
let users = item.users || [];
return users.join("，");
},
width: 300,
},
{
label: "推送时间",
prop: "push_time",
getText(item) {
let date = item.push_time || "";
return helper.dateStringTransform(date);
},
align: "center",
width: 180,
},
];
},
};
</script>
<style scoped>
.list_container {
height: 100%;
}
</style>
src/pages/message-management/message.vue
View file @ 5779633d
......@@ -81,11 +81,11 @@ export default {
align-items: stretch;
}
.side_nav_bar {
width: 180px;
width: 200px;
flex-shrink: 0;
}
.main_container {
width: calc(100% - 180px);
width: calc(100% - 200px);
flex-grow: 1;
flex-shrink: 1;
background-color: #f6f7fb;
......
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