流量池

This commit is contained in:
邓皓元 2019-04-13 19:47:33 +08:00
parent 6f71277e9a
commit ba10fb5274
4 changed files with 335 additions and 261 deletions

View File

@ -1,19 +1,23 @@
import * as API from 'api/virtual/flow_pools'; import * as API from "api/virtual/flow_pools";
export default { export default {
name: 'FlowPools', name: "FlowPools",
components: { components: {
UiEdit: resolve => require(['views/virtual/flow_pools/edit'], resolve), UiEdit: resolve => require(["views/virtual/flow_pools/edit"], resolve),
UiDetail: resolve => require(['views/virtual/flow_pools/detail'], resolve), UiDetail: resolve => require(["views/virtual/flow_pools/detail"], resolve),
UiSetting: resolve => require(['views/virtual/flow_pools/setting'], resolve), UiSetting: resolve =>
UiFlows: resolve => require(['views/virtual/flow_pools/flows'], resolve) require(["views/virtual/flow_pools/setting"], resolve),
UiFlows: resolve => require(["views/virtual/flow_pools/flows"], resolve)
}, },
data() { data() {
return { return {
options: { options: {
company_name: '', company_name: "",
name: '', name: "",
carrier_operator: '', carrier_operator: "",
month: this.moment().subtract('1', 'months').startOf('month').format('YYYY-MM') month: this.moment()
.subtract("1", "months")
.startOf("month")
.format("YYYY-MM")
}, },
list_data: null, list_data: null,
reals: [], reals: [],
@ -37,215 +41,247 @@ export default {
show: true show: true
}, },
importModel: false, importModel: false,
table_titles: [{ table_titles: [
title: 'ID', {
key: 'id', title: "ID",
key: "id",
width: 75 width: 75
}, },
{ {
title: '名称', title: "名称",
key: '', key: "",
width: 110, width: 110,
render: (h, { render: (h, { row, column, index }) => {
row,
column,
index
}) => {
if (row.setting_status) { if (row.setting_status) {
return h('span', row.name); return h("span", row.name);
} }
return h('Tooltip', { return h(
"Tooltip",
{
props: { props: {
theme: 'light' theme: "light"
} }
}, [ },
h('Badge', { [
h("Badge", {
props: { props: {
status: 'error' status: "error"
} }
}), }),
h('span', row.name), h("span", row.name),
h('div', { h(
slot: 'content' "div",
}, [ {
h('p', '当前月份计费规则未设置'), slot: "content"
h('p', '或套餐保底流量未设置') },
]) [
]); h("p", "当前月份计费规则未设置"),
h("p", "或套餐保底流量未设置")
]
)
]
);
} }
}, },
{ {
title: '运营商', title: "运营商",
key: 'carrier_operator_name', key: "carrier_operator_name",
width: 80 width: 80
}, },
{ {
title: '客户名称', title: "客户名称",
key: 'company_name', key: "company_name",
width: 300 width: 300
}, },
{ {
title: '保底流量', title: "保底流量",
key: 'minimum_flows', key: "minimum_flows",
width: 110 width: 110
}, },
{ {
title: '超出流量', title: "超出流量",
key: 'excess_flows', key: "excess_flows",
width: 110 width: 110
}, },
{ {
title: '保底收入(元)', title: "保底收入(元)",
key: 'minimum_price', key: "minimum_price",
width: 150 width: 150
}, },
{ {
title: '超出收入(元)', title: "超出收入(元)",
key: 'excess_price', key: "excess_price",
width: 150 width: 150
}, },
{ {
title: '收费用户数', title: "收费用户数",
key: 'members', key: "members",
width: 110 width: 110
}, },
{ {
title: '总收入(元)', title: "总收入(元)",
key: 'total_price', key: "total_price",
width: 150 width: 150
}, },
{ {
title: '状态', title: "状态",
key: '', key: "",
width: 100, width: 100,
render: (h, { render: (h, { row, column, index }) => {
row, return h(
column, "Tag",
index {
}) => {
return h('Tag', {
props: { props: {
color: row.status ? 'error' : 'primary' color: row.status ? "error" : "primary"
} }
}, row.status ? '已禁用' : '启用中'); },
row.status ? "已禁用" : "启用中"
);
} }
}, },
{ {
title: '更新时间', title: "更新时间",
key: 'created_at', key: "created_at",
width: 170 width: 170
}, },
{ {
title: '操作', title: "操作",
key: 'action', key: "action",
width: 450, width: 450,
render: (h, { render: (h, { row, column, index }) => {
row,
column,
index
}) => {
let html = []; let html = [];
if (row.deleted_at) { if (row.deleted_at) {
return h('Tag', { return h(
"Tag",
{
props: { props: {
color: 'default' color: "default"
} }
}, '该流量池已被删除'); },
"该流量池已被删除"
);
} }
if (this.haveJurisdiction('show')) { if (this.haveJurisdiction("show")) {
html.push(h('Button', { html.push(
h(
"Button",
{
props: { props: {
type: 'success', type: "success",
size: 'small', size: "small",
disabled: false, disabled: false,
icon: 'md-eye' icon: "md-eye"
}, },
class: ['btn'], class: ["btn"],
on: { on: {
click: (event) => { click: event => {
this.detailObj = { this.detailObj = {
show: true, show: true,
data: row data: row
}; };
} }
} }
}, '查看')); },
"查看"
)
);
} }
if (this.haveJurisdiction('update')) { if (this.haveJurisdiction("update")) {
html.push(h('Button', { html.push(
h(
"Button",
{
props: { props: {
type: 'primary', type: "primary",
size: 'small', size: "small",
disabled: false, disabled: false,
icon: 'md-create' icon: "md-create"
}, },
class: ['btn'], class: ["btn"],
on: { on: {
click: (event) => { click: event => {
this.openEdit(true, row); this.openEdit(true, row);
} }
} }
}, '编辑')); },
"编辑"
)
);
} }
if (this.haveJurisdiction('update')) { if (this.haveJurisdiction("update")) {
html.push(h('Button', { html.push(
h(
"Button",
{
props: { props: {
type: 'info', type: "info",
size: 'small', size: "small",
disabled: false, disabled: false,
icon: 'md-card' icon: "md-card"
}, },
class: ['btn'], class: ["btn"],
on: { on: {
click: (event) => { click: event => {
this.openFlows(true, row); this.openFlows(true, row);
} }
} }
}, '数据设置')); },
"数据设置"
)
);
} }
if (this.haveJurisdiction('update')) { if (this.haveJurisdiction("update")) {
html.push(h('Button', { html.push(
h(
"Button",
{
props: { props: {
type: 'warning', type: "warning",
size: 'small', size: "small",
disabled: false, disabled: false,
icon: 'logo-yen' icon: "logo-yen"
}, },
class: ['btn'], class: ["btn"],
on: { on: {
click: (event) => { click: event => {
this.openSetting(true, row); this.openSetting(true, row);
} }
} }
}, '计费规则')); },
"计费规则"
)
);
} }
if (this.haveJurisdiction('destroy')) { if (this.haveJurisdiction("destroy")) {
html.push(h('Button', { html.push(
h(
"Button",
{
props: { props: {
type: 'error', type: "error",
size: 'small', size: "small",
disabled: false, disabled: false,
icon: 'md-trash' icon: "md-trash"
}, },
class: ['btn'], class: ["btn"],
on: { on: {
click: () => { click: () => {
this.$Modal.confirm({ this.$Modal.confirm({
title: '提示', title: "提示",
content: '删除后该流量池不可使用,请谨慎操作', content: "删除后该流量池不可使用,请谨慎操作",
onOk: () => { onOk: () => {
API.destroy({ API.destroy({
ids: row.id ids: row.id
}).then(res => { }).then(res => {
if (res.code == 0) { if (res.code == 0) {
this.$Message.success('删除成功'); this.$Message.success("删除成功");
this.request(); this.request();
} }
}); });
@ -253,11 +289,14 @@ export default {
}); });
} }
} }
}, '删除')); },
"删除"
)
);
} }
if (html.length) { if (html.length) {
return h('div', html); return h("div", html);
} }
} }
} }
@ -274,32 +313,42 @@ export default {
* @return {[type]} [description] * @return {[type]} [description]
*/ */
index(page = 1) { index(page = 1) {
let data = this.searchDataHandle({}, { let data = this.searchDataHandle(
page {},
}, this.params()); {
page,
limit: 5
},
this.params()
);
this.isShowLoading(true); this.isShowLoading(true);
API.index(data).then(res => { API.index(data)
.then(res => {
this.isShowLoading(false); this.isShowLoading(false);
if (res.code == 0) { if (res.code == 0) {
this.list_data = res.data; this.list_data = res.data;
} }
}).catch(() => { })
.catch(() => {
this.isShowLoading(false); this.isShowLoading(false);
}); });
}, },
params() { params() {
if (!this.options.month) { if (!this.options.month) {
this.options.month = this.moment().subtract('1', 'months').startOf('month').format('YYYY-MM'); this.options.month = this.moment()
.subtract("1", "months")
.startOf("month")
.format("YYYY-MM");
} }
let params = { let params = {
name: this.options.name, name: this.options.name,
company_name: this.options.company_name, company_name: this.options.company_name,
carrier_operator: this.options.carrier_operator, carrier_operator: this.options.carrier_operator,
month: this.moment(this.options.month).format('YYYY-MM'), month: this.moment(this.options.month).format("YYYY-MM"),
orderBy: 'id', orderBy: "id",
sortedBy: 'asc' sortedBy: "asc"
}; };
return params; return params;
@ -347,7 +396,11 @@ export default {
let page = result.current_page; let page = result.current_page;
if (this.list_data.data.length == 1) { if (this.list_data.data.length == 1) {
page = this.returnPage(result.total, result.current_page, result.per_page); page = this.returnPage(
result.total,
result.current_page,
result.per_page
);
} }
this.index(page); this.index(page);
@ -355,10 +408,13 @@ export default {
resetSearch() { resetSearch() {
for (let k in this.options) { for (let k in this.options) {
if (k === 'month') { if (k === "month") {
this.options[k] = this.moment().subtract('1', 'months').startOf('month').format('YYYY-MM'); this.options[k] = this.moment()
.subtract("1", "months")
.startOf("month")
.format("YYYY-MM");
} else { } else {
this.options[k] = ''; this.options[k] = "";
} }
} }
@ -369,20 +425,23 @@ export default {
this.isShowLoading(true); this.isShowLoading(true);
API.exportList(data).then(res => { API.exportList(data)
.then(res => {
if (res.code === 0) { if (res.code === 0) {
if (res.data) { if (res.data) {
this.downloadFile(res.data); this.downloadFile(res.data);
} else { } else {
this.$Modal.success({ this.$Modal.success({
title: '提示', title: "提示",
content: '当前导出数据量大,已进入后台队列导出模式,请稍后至导出列表查看下载。' content:
"当前导出数据量大,已进入后台队列导出模式,请稍后至导出列表查看下载。"
}); });
} }
} }
this.isShowLoading(false); this.isShowLoading(false);
}).catch(() => { })
.catch(() => {
this.isShowLoading(false); this.isShowLoading(false);
}); });
}, },

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -1 +1 @@
<!DOCTYPE html><html><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=\favicon.ico><script src=\config.js></script><title></title><link href=/css/chunk-4443c580.c09b5b64.css rel=prefetch><link href=/css/chunk-996b1e80.5cadf3d0.css rel=prefetch><link href=/js/chunk-00ae0766.d130b440.js rel=prefetch><link href=/js/chunk-07a274ec.55e1b3b0.js rel=prefetch><link href=/js/chunk-4443c580.754ef273.js rel=prefetch><link href=/js/chunk-996b1e80.92847c4e.js rel=prefetch><link href=/css/app.8e379248.css rel=preload as=style><link href=/css/chunk-vendors.3c3b2e85.css rel=preload as=style><link href=/js/app.63b37964.js rel=preload as=script><link href=/js/chunk-vendors.ed6443e8.js rel=preload as=script><link href=/css/chunk-vendors.3c3b2e85.css rel=stylesheet><link href=/css/app.8e379248.css rel=stylesheet></head><body><noscript><strong>很抱歉如果没有启用JavaScript程序不能正常工作若要继续使用请启用它。</strong></noscript><div id=app></div><script src=/js/chunk-vendors.ed6443e8.js></script><script src=/js/app.63b37964.js></script></body></html> <!DOCTYPE html><html><head><meta charset=utf-8><meta http-equiv=X-UA-Compatible content="IE=edge"><meta name=viewport content="width=device-width,initial-scale=1"><link rel=icon href=\favicon.ico><script src=\config.js></script><title></title><link href=/css/chunk-4443c580.c09b5b64.css rel=prefetch><link href=/css/chunk-996b1e80.5cadf3d0.css rel=prefetch><link href=/js/chunk-00ae0766.d130b440.js rel=prefetch><link href=/js/chunk-07a274ec.55e1b3b0.js rel=prefetch><link href=/js/chunk-4443c580.0ce681dd.js rel=prefetch><link href=/js/chunk-996b1e80.92847c4e.js rel=prefetch><link href=/css/app.8e379248.css rel=preload as=style><link href=/css/chunk-vendors.3c3b2e85.css rel=preload as=style><link href=/js/app.02a931c9.js rel=preload as=script><link href=/js/chunk-vendors.ed6443e8.js rel=preload as=script><link href=/css/chunk-vendors.3c3b2e85.css rel=stylesheet><link href=/css/app.8e379248.css rel=stylesheet></head><body><noscript><strong>很抱歉如果没有启用JavaScript程序不能正常工作若要继续使用请启用它。</strong></noscript><div id=app></div><script src=/js/chunk-vendors.ed6443e8.js></script><script src=/js/app.02a931c9.js></script></body></html>