|
@@ -12,29 +12,32 @@
|
|
|
:allowClear="false"
|
|
|
format="YYYY-MM-DD"
|
|
|
:disabled-date="disabledDate"
|
|
|
- @change="onChange"
|
|
|
+ @change="handleCostTimeChange"
|
|
|
/>
|
|
|
</div>
|
|
|
<div class="costInfo">
|
|
|
<div class="yesterdayInfo">
|
|
|
- <div style="margin-bottom:8px">上阶段花费</div>
|
|
|
- <div style="font-size:14px;font-weight:600">{{ yearCostReportList.lastCost || 0 }}</div>
|
|
|
+ <div style="margin-bottom:8px">昨日花费</div>
|
|
|
+ <div style="font-size:14px;font-weight:600">{{ Number(yearCostReportList.lastCost) | decimalsHandle }}</div>
|
|
|
</div>
|
|
|
<a-divider type="vertical"/>
|
|
|
<div class="tongbi">
|
|
|
- <div style="margin-bottom:8px">
|
|
|
- 环比
|
|
|
+ <div style="margin-bottom:8px;margin-left: 23px;">
|
|
|
+ 同比
|
|
|
<a-tooltip >
|
|
|
<template slot="title">
|
|
|
- <span>截止此时与上一阶段的花费同比</span>
|
|
|
+ <span>截止此时今日与昨日的花费同比</span>
|
|
|
</template>
|
|
|
<a-icon type="question-circle" />
|
|
|
</a-tooltip>
|
|
|
</div>
|
|
|
- <div style="font-size:14px;font-weight:600">{{ yearCostReportList.compare || 0 }}</div>
|
|
|
+ <div style="font-size:14px;font-weight:600">
|
|
|
+ <a-icon type="arrow-down" style="color: #f00"/>
|
|
|
+ {{ yearCostReportList.compare || 0 }}
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div class="costNum">{{ yearCostReportList.nowCost || 0 }}</div>
|
|
|
+ <div class="costNum">{{ Number(yearCostReportList.nowCost) | decimalsHandle }}</div>
|
|
|
</div>
|
|
|
<div class="accountBodyLeftCostRight">
|
|
|
<div
|
|
@@ -45,33 +48,34 @@
|
|
|
>
|
|
|
<a-empty/>
|
|
|
</div>
|
|
|
+ <span class="cost-radio-tool">
|
|
|
+ 花费占比
|
|
|
+ <a-tooltip>
|
|
|
+ <template slot="title">
|
|
|
+ <span>花费占比指花费占账户预算的比例</span>
|
|
|
+ </template>
|
|
|
+ <a-icon type="question-circle"/>
|
|
|
+ </a-tooltip>
|
|
|
+ </span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="accountBodyLeftOther">
|
|
|
<div class="top">
|
|
|
<div class="item" v-for="item in throwColumns" :key="item.dataIndex">
|
|
|
<div class="todyCost">
|
|
|
- <span v-if="item.type === 'double'">{{ item.today }}</span>
|
|
|
- <span v-else-if="item.type === 'string'">{{ item.today }}</span>
|
|
|
- <span v-else-if="item.type === 'int'">{{ item.today }}</span>
|
|
|
+ <span v-if="item.type === 'double'">{{ Number(item.today) | decimalsHandle }}</span>
|
|
|
+ <span v-else-if="item.type === 'string'">{{ Number(item.today) | decimalsHandle }}</span>
|
|
|
+ <span v-else-if="item.type === 'int'">{{ item.today !== 0 ? item.today + '%' : 0 }}</span>
|
|
|
<span class="sign">
|
|
|
<a-icon type="rise" class="rise" v-show="item.today - item.yesterday > 0"/>
|
|
|
<a-icon type="fall" class="fall" v-show="item.today - item.yesterday < 0" />
|
|
|
</span>
|
|
|
</div>
|
|
|
<div class="yesterdayCost">
|
|
|
- <a-tooltip >
|
|
|
- <template slot="title">
|
|
|
- <span>
|
|
|
- <!-- {{dateValue[0].format('YYYY-MM-DD') === dateValue[1].format('YYYY-MM-DD') ? moment(dateValue[0]).subtract(1,'days').format('YYYY-MM-DD') : dateStringShow}}
|
|
|
- 的{{item.title}} -->
|
|
|
- </span>
|
|
|
- </template>
|
|
|
- <a-icon type="question-circle" />
|
|
|
- </a-tooltip>:
|
|
|
- <span v-if="item.type === 'double'">{{ item.yesterday }}</span>
|
|
|
- <span v-else-if="item.type === 'string'">{{ item.yesterday }}</span>
|
|
|
- <span v-else-if="item.type === 'int'">{{ item.yesterday }}</span>
|
|
|
+ <span>/ 昨日: </span>
|
|
|
+ <span v-if="item.type === 'double'">{{ Number(item.yesterday) | decimalsHandle }}</span>
|
|
|
+ <span v-else-if="item.type === 'string'">{{ Number(item.yesterday) | decimalsHandle }}</span>
|
|
|
+ <span v-else-if="item.type === 'int'">{{ item.yesterday !== 0 ? item.yesterday + '%' : 0 }}</span>
|
|
|
</div>
|
|
|
<span
|
|
|
class="IndexName"
|
|
@@ -118,17 +122,12 @@
|
|
|
<div class="accountBodyRightInfo">
|
|
|
<div class="accountBodyRightInfoItem">
|
|
|
<span class="name">余额:</span>
|
|
|
- <span>{{ topAccountMsg.accountMap && topAccountMsg.accountMap.validBalance }}</span>
|
|
|
+ <span>{{ topAccountMsg.accountMap && Number(topAccountMsg.accountMap.validBalance) | decimalsHandle }}</span>
|
|
|
</div>
|
|
|
<div class="accountBodyRightInfoItem">
|
|
|
<span class="name">投放状态:</span>
|
|
|
<span>{{ topAccountMsg.accountMap && topAccountMsg.accountMap.accountStatus === 0 ? '投放中' : '未投放' }}</span>
|
|
|
</div>
|
|
|
- <div class="accountBodyRightInfoItem createNum" @click="gorejectCreativePage">
|
|
|
- <span class="name">被拒创意数:</span>
|
|
|
- <span>0</span>
|
|
|
- <a-icon type="right" style="font-size:12px;position:absolute;right:10px;top:16px"/>
|
|
|
- </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -153,7 +152,6 @@
|
|
|
:columns="planColumns"
|
|
|
:data-source="planData"
|
|
|
:pagination="false"
|
|
|
- @change="handlePlaneSort"
|
|
|
>
|
|
|
<span slot="optStatus" slot-scope="text, record">
|
|
|
<a-switch :checked="text === 'AD_STATUS_ENABLE'" @change="handleSwitchChang($event, record)"/>
|
|
@@ -203,7 +201,6 @@
|
|
|
:columns="materialColumns"
|
|
|
:data-source="materialData"
|
|
|
:pagination="false"
|
|
|
- @change="materialChange"
|
|
|
>
|
|
|
<span slot="posterUrl" slot-scope="text,record">
|
|
|
<div style="background:#e8e8e8;text-align:center;border-radius:3px">
|
|
@@ -212,15 +209,15 @@
|
|
|
<video :src="record.videoUrl" style="width:250px" controls></video>
|
|
|
</template>
|
|
|
<img v-if="text" :src="text" style="width:20px">
|
|
|
- <img v-if="!text" src="@/assets/feishu.png" style="width:20px">
|
|
|
+ <img v-if="!text" src="@/assets/noImg.png" style="width:20px">
|
|
|
</a-popover>
|
|
|
</div>
|
|
|
</span>
|
|
|
</a-table>
|
|
|
<a-pagination
|
|
|
- class="pagin-table-class"
|
|
|
:total="materTotalAll"
|
|
|
:show-total="total => `共 ${materTotalAll} 条`"
|
|
|
+ class="pagin-table-class"
|
|
|
size="small"
|
|
|
show-size-changer
|
|
|
show-quick-jumper
|
|
@@ -233,13 +230,19 @@
|
|
|
<!-- 修改定向的modal -->
|
|
|
<a-modal
|
|
|
v-model="targetVisible"
|
|
|
- title="修改定向"
|
|
|
+ title="修改定向包"
|
|
|
@ok="handleTargethandleOk"
|
|
|
@cancel="handleTargethandleCancel"
|
|
|
>
|
|
|
<div class="linkBody">
|
|
|
<a-row>
|
|
|
<a-col :span="6">
|
|
|
+ <div style="text-align:right">已优先定向:</div>
|
|
|
+ </a-col>
|
|
|
+ <a-col :span="16">{{ packageName }}</a-col>
|
|
|
+ </a-row>
|
|
|
+ <a-row style="margin-top: 20px;">
|
|
|
+ <a-col :span="6">
|
|
|
<div style="text-align:right">修改定向包:</div>
|
|
|
</a-col>
|
|
|
<a-col :span="16">
|
|
@@ -282,8 +285,8 @@
|
|
|
</div>
|
|
|
</a-modal>
|
|
|
<a-modal
|
|
|
- title="修改调价"
|
|
|
v-if="budgetVisible"
|
|
|
+ title="修改调价"
|
|
|
:visible="budgetVisible"
|
|
|
dialog-class="mode-modal-class"
|
|
|
@ok="handleBudgetSure"
|
|
@@ -298,9 +301,7 @@
|
|
|
:wrapper-col="wrapperCol"
|
|
|
>
|
|
|
<a-form-model-item label="调价" prop="budget">
|
|
|
- <a-input-number
|
|
|
- v-model="budgetForm.budget"
|
|
|
- /> 元
|
|
|
+ <a-input-number v-model="budgetForm.budget"/> 元
|
|
|
</a-form-model-item>
|
|
|
</a-form-model>
|
|
|
</div>
|
|
@@ -366,7 +367,7 @@ export default {
|
|
|
key: 'activation',
|
|
|
today: 0,
|
|
|
yesterday: 0,
|
|
|
- type: 'int'
|
|
|
+ type: 'string'
|
|
|
},
|
|
|
{
|
|
|
title: '转化率',
|
|
@@ -403,68 +404,77 @@ export default {
|
|
|
dataIndex: 'adName',
|
|
|
key: 'adName',
|
|
|
align: 'center',
|
|
|
- width: 120,
|
|
|
- ellipsis: true
|
|
|
+ width: 120
|
|
|
},
|
|
|
{
|
|
|
title: '花费',
|
|
|
dataIndex: 'cost',
|
|
|
key: 'cost',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.cost - b.cost
|
|
|
},
|
|
|
{
|
|
|
title: '出价',
|
|
|
- dataIndex: 'bid',
|
|
|
- key: 'bid',
|
|
|
- align: 'center'
|
|
|
+ dataIndex: 'cpaBid',
|
|
|
+ key: 'cpaBid',
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.cpaBid - b.cpaBid
|
|
|
},
|
|
|
{
|
|
|
title: '展示数',
|
|
|
dataIndex: 'showNum',
|
|
|
key: 'showNum',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.showNum - b.showNum
|
|
|
},
|
|
|
{
|
|
|
title: '平均千次展现费用',
|
|
|
dataIndex: 'averageShow',
|
|
|
key: 'averageShow',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.averageShow - b.averageShow
|
|
|
},
|
|
|
{
|
|
|
title: '点击数',
|
|
|
dataIndex: 'click',
|
|
|
key: 'click',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.click - b.click
|
|
|
},
|
|
|
{
|
|
|
title: '平均点击单价',
|
|
|
dataIndex: 'averageClick',
|
|
|
key: 'averageClick',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.averageClick - b.averageClick
|
|
|
},
|
|
|
{
|
|
|
title: '点击率',
|
|
|
dataIndex: 'clickRate',
|
|
|
key: 'clickRate',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.clickRate.split('%')[0] - b.clickRate.split('%')[0]
|
|
|
},
|
|
|
{
|
|
|
title: '转化数',
|
|
|
dataIndex: 'convertNum',
|
|
|
key: 'convertNum',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.convertNum - b.convertNum
|
|
|
},
|
|
|
{
|
|
|
title: '转化率',
|
|
|
dataIndex: 'converRate',
|
|
|
key: 'converRate',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.converRate.split('%')[0] - b.converRate.split('%')[0]
|
|
|
},
|
|
|
{
|
|
|
title: '转化成本',
|
|
|
dataIndex: 'conver',
|
|
|
key: 'conver',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.conver - b.conver
|
|
|
},
|
|
|
{
|
|
|
title: '环比',
|
|
@@ -511,49 +521,56 @@ export default {
|
|
|
title: '花费',
|
|
|
dataIndex: 'cost',
|
|
|
align: 'center',
|
|
|
- sorter: () => {}
|
|
|
+ sorter: (a, b) => a.cost - b.cost
|
|
|
},
|
|
|
{
|
|
|
title: '展示数',
|
|
|
dataIndex: 'showMaterial',
|
|
|
key: 'showMaterial',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.showMaterial - b.showMaterial
|
|
|
},
|
|
|
{
|
|
|
title: '平均千次展现费用',
|
|
|
dataIndex: 'costPerThousandShow',
|
|
|
key: 'costPerThousandShow',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.costPerThousandShow - b.costPerThousandShow
|
|
|
},
|
|
|
{
|
|
|
title: '点击数',
|
|
|
dataIndex: 'click',
|
|
|
key: 'click',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.click - b.click
|
|
|
},
|
|
|
{
|
|
|
- title: '平均店家单价',
|
|
|
+ title: '平均点击单价',
|
|
|
dataIndex: 'costPerClick',
|
|
|
key: 'costPerClick',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.costPerClick - b.costPerClick
|
|
|
},
|
|
|
{
|
|
|
title: '点击率',
|
|
|
dataIndex: 'clickRate',
|
|
|
key: 'clickRate',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.clickRate.split('%')[0] - b.clickRate.split('%')[0]
|
|
|
},
|
|
|
{
|
|
|
title: '转化数',
|
|
|
dataIndex: 'convertMaterial',
|
|
|
key: 'convertMaterial',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.convertMaterial - b.convertMaterial
|
|
|
},
|
|
|
{
|
|
|
title: '转化率',
|
|
|
dataIndex: 'convertRate',
|
|
|
key: 'convertRate',
|
|
|
- align: 'center'
|
|
|
+ align: 'center',
|
|
|
+ sorter: (a, b) => a.convertRate.split('%')[0] - b.convertRate.split('%')[0]
|
|
|
},
|
|
|
{
|
|
|
title: '转化成本',
|
|
@@ -572,8 +589,7 @@ export default {
|
|
|
dataIndex: 'materialUploadTime',
|
|
|
key: 'photoShow',
|
|
|
align: 'center',
|
|
|
- scopedSlots: {customRender: 'photoShow'},
|
|
|
- sorter: () => {}
|
|
|
+ scopedSlots: {customRender: 'photoShow'}
|
|
|
}
|
|
|
],
|
|
|
materialData: [],
|
|
@@ -589,7 +605,8 @@ export default {
|
|
|
topCostList: {},
|
|
|
yearCostReportList: {}, // 环比数据
|
|
|
selectiveList: [],
|
|
|
- currentUnit: {}
|
|
|
+ currentUnit: {},
|
|
|
+ packageName: ''
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
@@ -599,10 +616,7 @@ export default {
|
|
|
...mapGetters(['userInfo']),
|
|
|
// 获取所有的定向包的列表
|
|
|
handleGetAdAudiencePackage(account) {
|
|
|
- const params = {
|
|
|
- accountId: account
|
|
|
- };
|
|
|
- getAction(urlAcount + '/bytedance-api/advertiser/aiBytedanceAdvertiserStrategy/getAdAudiencePackage', params)
|
|
|
+ getAction(urlAcount + '/bytedance-api/advertiser/aiBytedanceAdvertiserStrategy/getAdAudiencePackage', {accountId: account})
|
|
|
.then(result => {
|
|
|
if (result.code === 0) {
|
|
|
this.selectiveList = result.result || [];
|
|
@@ -637,7 +651,24 @@ export default {
|
|
|
console.log(error, 'eeee');
|
|
|
});
|
|
|
},
|
|
|
+ handleGetADAudiencePackageId(actId, id) {
|
|
|
+ const paramsData = {
|
|
|
+ accountId: actId,
|
|
|
+ adId: id
|
|
|
+ };
|
|
|
+ getAction(urlAcount + '/bytedance-api/advertiser/bytedanceReportController/getADAudiencePackageId', paramsData).then(result => {
|
|
|
+ if (result.code === 0) {
|
|
|
+ this.packageName = result.result.packageId ? this.selectiveList.filter(item => item.audience_package_id === Number(result.result.packageId))[0].name : '暂无';
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ this.$message.error(result.message);
|
|
|
+ }
|
|
|
+ }).catch(error => {
|
|
|
+ console.log(error, 'eeee');
|
|
|
+ });
|
|
|
+ },
|
|
|
handleUpdateDirectional(record) {
|
|
|
+ this.handleGetADAudiencePackageId(this.topAccountMsg.accountMap.accountId, record.adId);
|
|
|
this.currentUnit = record;
|
|
|
this.targetVisible = true;
|
|
|
},
|
|
@@ -690,8 +721,10 @@ export default {
|
|
|
};
|
|
|
getAction(urlAcount + '/bytedance-api/advertiser/bytedanceReportController/getReportPlanCost', paramsData).then(result => {
|
|
|
if (result.code === 0) {
|
|
|
- console.log(result.result, '计划列表数据');
|
|
|
- this.planData = result.result.list;
|
|
|
+ this.planData = result.result.list.map(item => {
|
|
|
+ item.converRate = item.converRate + '%';
|
|
|
+ return item;
|
|
|
+ });
|
|
|
this.planTotalAll = result.result.total;
|
|
|
}
|
|
|
else {
|
|
@@ -757,10 +790,7 @@ export default {
|
|
|
},
|
|
|
// 获取头部最右侧数据
|
|
|
handleGetAccountMessage(value) {
|
|
|
- const paramsData = {
|
|
|
- accountId: value
|
|
|
- };
|
|
|
- getAction(urlAcount + '/bytedance-api/advertiser/bytedanceReportController/getAccountCost', paramsData).then(result => {
|
|
|
+ getAction(urlAcount + '/bytedance-api/advertiser/bytedanceReportController/getAccountCost', {accountId: value}).then(result => {
|
|
|
if (result.code === 0) {
|
|
|
this.topAccountMsg = result.result;
|
|
|
}
|
|
@@ -782,7 +812,11 @@ export default {
|
|
|
};
|
|
|
getAction(urlAcount + '/bytedance-api/advertiser/bytedanceReportController/selectMaterialDailyReport', paramsData).then(result => {
|
|
|
if (result.code === 0) {
|
|
|
- this.materialData = result.result.list;
|
|
|
+ this.materialData = result.result.list.map(item => {
|
|
|
+ item.clickRate = item.clickRate + '%';
|
|
|
+ item.convertRate = item.convertRate + '%';
|
|
|
+ return item;
|
|
|
+ });
|
|
|
this.materTotalAll = result.result.total;
|
|
|
}
|
|
|
else {
|
|
@@ -820,6 +854,7 @@ export default {
|
|
|
// 修改定向的取消按钮
|
|
|
handleTargethandleCancel() {
|
|
|
this.adAudiencePackageId = '';
|
|
|
+ this.packageName = '';
|
|
|
this.targetVisible = false;
|
|
|
},
|
|
|
handleAccounthandleOk() {
|
|
@@ -827,8 +862,8 @@ export default {
|
|
|
account: {
|
|
|
accountId: this.selectaccountId
|
|
|
},
|
|
|
- startTime: this.topCostList.startTime,
|
|
|
- endTime: this.topCostList.startTime
|
|
|
+ startTime: this.dateValue[0],
|
|
|
+ endTime: this.dateValue[1]
|
|
|
};
|
|
|
this.topCostList = paramsData;
|
|
|
this.handleGetAccountMessage(this.selectaccountId);
|
|
@@ -845,6 +880,7 @@ export default {
|
|
|
},
|
|
|
// 计划点击分页操作
|
|
|
handleOnShowSizeChange(current, pageSize) {
|
|
|
+ console.log(current, pageSize, 'current, pageSize');
|
|
|
this.planPagin = {
|
|
|
page: current,
|
|
|
size: pageSize
|
|
@@ -868,12 +904,12 @@ export default {
|
|
|
account: {
|
|
|
accountId: this.topCostList.account.accountId
|
|
|
},
|
|
|
- startTime: this.planRangePicker[0],
|
|
|
- endTime: this.planRangePicker[1]
|
|
|
+ startTime: this.materialDate[0],
|
|
|
+ endTime: this.materialDate[1]
|
|
|
};
|
|
|
this.handleGetmaterialData(paramsData);
|
|
|
},
|
|
|
- // have 跳转到拒审重提-创意页面
|
|
|
+ // TODO 暂时功能隐藏 跳转到拒审重提-创意页面
|
|
|
gorejectCreativePage() {
|
|
|
this.$router.push('/Statistics/refuseDataCreatNew');
|
|
|
},
|
|
@@ -896,11 +932,8 @@ export default {
|
|
|
};
|
|
|
this.handleGetPlanTableList(paramsData);
|
|
|
},
|
|
|
- onChange(date, dateString) {
|
|
|
- if (dateString.length > 0 && dateString[0] !== dateString[1]) {
|
|
|
- let interval = date[1].diff(date[0], 'days');
|
|
|
- this.dateStringShow = `${moment(date[0]).subtract(1 + interval, 'days').format('YYYY-MM-DD')}~${moment(date[0]).subtract(1, 'days').format('YYYY-MM-DD')}`;
|
|
|
- }
|
|
|
+ handleCostTimeChange(date, dateString) {
|
|
|
+ this.dateValue = dateString;
|
|
|
const paramsData = {
|
|
|
account: {
|
|
|
accountId: this.topCostList.account.accountId
|
|
@@ -940,6 +973,7 @@ export default {
|
|
|
},
|
|
|
// 默认echarts
|
|
|
initAccountIndexEchart(data, type) {
|
|
|
+ const LastX = data.lastMap.costList.map(item => item.time);
|
|
|
const todayX = data.nowMap.costList.map(item => item.time);
|
|
|
let specialIdentification = '';
|
|
|
if (todayX.length && todayX[0].indexOf('-') !== -1) {
|
|
@@ -971,14 +1005,24 @@ export default {
|
|
|
trigger: 'axis',
|
|
|
formatter: params => {
|
|
|
let isType = '';
|
|
|
+ let showBai = '';
|
|
|
this.throwColumns.forEach(item => {
|
|
|
+ console.log(item, 'item--item');
|
|
|
if (item.dataIndex === this.isActive) {
|
|
|
isType = item.title;
|
|
|
}
|
|
|
+ if (item.type === 'int') {
|
|
|
+ showBai = '%';
|
|
|
+ }
|
|
|
+ else {
|
|
|
+ showBai = '';
|
|
|
+ }
|
|
|
});
|
|
|
+ console.log(showBai, 'showBai');
|
|
|
let option = isType + '<br/>';
|
|
|
for (let i = 0, length = params.length; i < length; i++) {
|
|
|
- option += `<span style="width:8px;height:8px;border-radius:50%;background:${params[i].color};display:inline-block;position:relative;top:-2px;margin-right:5px"></span>` + ' ' + params[i].axisValue + specialIdentification + ' ' + params[i].data + '<br />';
|
|
|
+ const showTime = specialIdentification === '时' ? params[i].seriesName : '';
|
|
|
+ option += `<span style="width:8px;height:8px;border-radius:50%;background:${params[i].color};display:inline-block;position:relative;top:-2px;margin-right:5px"></span>${showTime} ${params[i].axisValue}${specialIdentification} ${params[i].data}${showBai}<br />`;
|
|
|
}
|
|
|
return option;
|
|
|
}
|
|
@@ -1039,11 +1083,14 @@ export default {
|
|
|
y: 0,
|
|
|
x2: 0,
|
|
|
y2: 1,
|
|
|
- colorStops: [{
|
|
|
- offset: 0, color: '#2461F1' // 0% 处的颜色
|
|
|
- }, {
|
|
|
- offset: 1, color: 'white' // 100% 处的颜色
|
|
|
- }]
|
|
|
+ colorStops: [
|
|
|
+ {
|
|
|
+ offset: 0, color: '#2461F1' // 0% 处的颜色
|
|
|
+ },
|
|
|
+ {
|
|
|
+ offset: 1, color: 'white' // 100% 处的颜色
|
|
|
+ }
|
|
|
+ ]
|
|
|
}
|
|
|
}
|
|
|
},
|
|
@@ -1063,12 +1110,28 @@ export default {
|
|
|
color: '#3CC6A5',
|
|
|
borderWidth: 2,
|
|
|
borderColor: '#fff'
|
|
|
+ },
|
|
|
+ areaStyle: {
|
|
|
+ color: {
|
|
|
+ type: 'linear',
|
|
|
+ x: 0,
|
|
|
+ y: 0,
|
|
|
+ x2: 0,
|
|
|
+ y2: 1,
|
|
|
+ colorStops: [
|
|
|
+ {
|
|
|
+ offset: 0, color: '#3CC6A5' // 0% 处的颜色
|
|
|
+ }, {
|
|
|
+ offset: 1, color: 'white' // 100% 处的颜色
|
|
|
+ }
|
|
|
+ ]
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
]
|
|
|
};
|
|
|
option.xAxis[0].data = todayX;
|
|
|
- option.xAxis[1].data = todayX;
|
|
|
+ option.xAxis[1].data = LastX;
|
|
|
option.series[0].data = tadayShowY;
|
|
|
option.series[1].data = yestodayShowY;
|
|
|
return option;
|
|
@@ -1139,10 +1202,12 @@ export default {
|
|
|
fontFamily: 'PingFangSC'
|
|
|
}
|
|
|
},
|
|
|
- data: [{
|
|
|
- name: '花费占比',
|
|
|
- value: dataArr
|
|
|
- }],
|
|
|
+ data: [
|
|
|
+ {
|
|
|
+ name: '',
|
|
|
+ value: dataArr
|
|
|
+ }
|
|
|
+ ],
|
|
|
pointer: {
|
|
|
show: true,
|
|
|
length: '75%',
|
|
@@ -1226,44 +1291,12 @@ export default {
|
|
|
]
|
|
|
};
|
|
|
return option;
|
|
|
- },
|
|
|
- // 投放点击排序功能
|
|
|
- handlePlaneSort(pagination, filters, sorter, {currentDataSource}) {
|
|
|
- if (sorter.order === 'descend') {
|
|
|
- this.newDataSortType = 'DESC';
|
|
|
- this.newDataSortCode = sorter.columnKey;
|
|
|
- }
|
|
|
- else if (sorter.order === 'ascend') {
|
|
|
- this.newDataSortType = 'ASC';
|
|
|
- this.newDataSortCode = sorter.columnKey;
|
|
|
- }
|
|
|
- else {
|
|
|
- this.newDataSortType = 'DESC';
|
|
|
- this.newDataSortCode = 'charge';
|
|
|
- }
|
|
|
- this.getLaunchData();
|
|
|
- },
|
|
|
- // 素材点击排序功能
|
|
|
- materialChange(pagination, filters, sorter) {
|
|
|
- console.log(sorter, 'v--sorter--sorter');
|
|
|
- if (sorter.order === 'descend') {
|
|
|
- this.materialSortType = 'DESC';
|
|
|
- this.materialSortCode = sorter.columnKey;
|
|
|
- }
|
|
|
- else if (sorter.order === 'ascend') {
|
|
|
- this.materialSortType = 'ASC';
|
|
|
- this.materialSortCode = sorter.columnKey;
|
|
|
- }
|
|
|
- else {
|
|
|
- this.materialSortType = 'DESC';
|
|
|
- this.materialSortCode = 'charge';
|
|
|
- }
|
|
|
}
|
|
|
}
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss">
|
|
|
- .accountPage .accountBody{
|
|
|
+ .accountPage .accountBody {
|
|
|
line-height: 1;
|
|
|
.ant-input {
|
|
|
-webkit-box-sizing: border-box;
|
|
@@ -1401,14 +1434,14 @@ export default {
|
|
|
}
|
|
|
.costInfo {
|
|
|
margin: 20px 0 0 0;
|
|
|
- width: 70%;
|
|
|
+ width: 100%;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
- .yesterdayInfo {
|
|
|
- width:50%;
|
|
|
- flex-shrink: 0;
|
|
|
- }
|
|
|
+ // .yesterdayInfo {
|
|
|
+ // width:50%;
|
|
|
+ // flex-shrink: 0;
|
|
|
+ // }
|
|
|
.costNum{
|
|
|
width: 90%;
|
|
|
font-size: 26px;
|
|
@@ -1439,6 +1472,13 @@ export default {
|
|
|
}
|
|
|
.accountBodyLeftCostRight {
|
|
|
width: 45%;
|
|
|
+ margin-left: 15px;
|
|
|
+ position: relative;
|
|
|
+ .cost-radio-tool {
|
|
|
+ position: absolute;
|
|
|
+ bottom: 34px;
|
|
|
+ left: 28%;
|
|
|
+ }
|
|
|
}
|
|
|
.accountBodyLeftOther {
|
|
|
width: 60%;
|