Explorar el Código

账户配置 迭代

jiayufei hace 4 años
padre
commit
721030466a

+ 2 - 2
src/utils/request.js

@@ -16,8 +16,8 @@ else if (process.env.NODE_ENV == 'debug') {
 else if (process.env.NODE_ENV == 'production') { 
   
   // axios.defaults.baseURL = 'http://apipre.tjyourong.com.cn/jeecg-boot';//预生产
-  // axios.defaults.baseURL = 'http://139.186.165.84:8806/jeecg-boot';     
-  axios.defaults.baseURL = 'http://api.tjyourong.com.cn/jeecg-boot';//生产环境
+  axios.defaults.baseURL = 'http://139.186.165.84:8806/jeecg-boot';     
+  // axios.defaults.baseURL = 'http://api.tjyourong.com.cn/jeecg-boot';//生产环境
 }
 const service = axios.create({
 //   baseURL: '/jeecg-boot', // api base_url

+ 47 - 45
src/views/modules/account-config/components/configuration-modal.vue

@@ -207,6 +207,8 @@
                         v-model="configForm.creativeWebUrl"
                         placeholder="请输入应用下载详情页"
                         :disabled="modalTitle === 'edit'"
+                        allow-clear
+                        @change="handleCreativeWebUrl"
                     />
                     <span style="margin-left: 10px;"><a :disabled="modalTitle === 'edit'" @click="handleHaveWebUrl">使用已有</a></span>
                 </a-form-model-item>
@@ -625,7 +627,12 @@
                     </a-input-group>
                 </a-form-model-item>
                 <a-form-model-item label="投放时间">
-                    <a-radio-group :disabled="modalTitle === 'edit'" v-model="configForm.adScheduleType" button-style="solid" @change="handleAdScheduleType">
+                    <a-radio-group
+                        :disabled="modalTitle === 'edit' || configForm.adBudgetMode === 'BUDGET_MODE_TOTAL'"
+                        v-model="configForm.adScheduleType"
+                        button-style="solid"
+                        @change="handleAdScheduleType"
+                    >
                         <a-radio-button value="SCHEDULE_FROM_NOW">从今天起长期投放</a-radio-button>
                         <a-radio-button value="SCHEDULE_START_END">设置开始和结束日期</a-radio-button>
                     </a-radio-group>
@@ -822,14 +829,14 @@
                         <a-icon class="examin-form-icon" type="delete" @click="handleDelOrigin(item)"/>
                     </a-form-model-item>
                 </div>
-                <a-form-model-item v-if="isTomatoStatus || isTAwemeStatus" label="行动号召">
+                <a-form-model-item v-if="isTAwemeStatus" label="行动号召">
                     <a-radio-group v-model="configForm.creativeEnablePersonalAction" button-style="solid">
                         <a-radio-button :value="true">开启智能优选</a-radio-button>
                         <a-radio-button :value="false">关闭智能优选</a-radio-button>
                     </a-radio-group>
                     <span class="especial-label">*</span>
                 </a-form-model-item>
-                <div v-if="isTomatoStatus" class="adver-position-radio">
+                <div v-if="isTAwemeStatus" class="adver-position-radio">
                     <a-form-model-item prop="creativeCallToAction">
                         <a-select
                             class="common-input-long"
@@ -1250,7 +1257,7 @@ export default {
             md5Result: '',
             urlResult: '',
             createOptions: [],
-            adNameTags: ['出价方式', '素材名称', '日期', '创意方式'],
+            adNameTags: ['序号', '出价方式', '素材名称', '日期', '创意方式'],
             fieldNames: {
                 label: 'industryName',
                 value: 'industryId',
@@ -1531,9 +1538,26 @@ export default {
         },
         NewPlatformLoadingType() {
             return this.platformLoadingType;
+        },
+        NewIsTAwemeStatus() {
+            return this.isTAwemeStatus;
         }
     },
     watch: {
+        NewIsTAwemeStatus(newVal) {
+            if (!newVal) {
+                this.md5Result = '';
+                this.urlResult = '';
+                this.imageUrl = '';
+                this.configForm.creativeProductDescription = '';
+                this.configForm.defaultFormList = [];
+                this.configForm.creativeEnablePersonalAction = '';
+                this.configForm.creativeCallToAction = '';
+            }
+            else {
+                this.configForm.creativeEnablePersonalAction = true;
+            }
+        },
         NewPlatformLoadingType(newVal, oldVal) {
             if (newVal) {
                 this.configForm.adAppType = newVal;
@@ -1623,49 +1647,15 @@ export default {
         ...mapGetters(['nickname', 'avatar', 'userInfo']),
         moment,
         NewCheckboxChangeValue(newVal) {
-            if (newVal.includes('INVENTORY_TOMATO_NOVEL')) {
-                this.isTomatoStatus = true;
-                this.configForm.creativeMaterialMode = 'STATIC_ASSEMBLE';
-                this.configForm.creativeImageMode = 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL';
-                this.configForm.creativeIsCommentDisable = 0;
-                this.configForm.creativeDownloadStatus = 1;
-                this.configForm.creativeDisplayMode = 'CREATIVE_DISPLAY_MODE_CTR';
-            }
-            else {
-                this.isTomatoStatus = false;
-                this.configForm.creativeMaterialMode = '';
-                this.configForm.creativeImageMode = '';
-                this.configForm.creativeIsCommentDisable = '';
-                this.configForm.creativeDownloadStatus = '';
-                this.configForm.creativeDisplayMode = '';
-            }
-            if (newVal.includes('INVENTORY_AWEME_FEED')) {
-                this.isTAwemeStatus = true;
-                this.configForm.creativeMaterialMode = '';
-                this.configForm.creativeImageMode = '';
-                this.configForm.creativeIsCommentDisable = '';
-                this.configForm.creativeDownloadStatus = '';
-                this.configForm.creativeDisplayMode = '';
+            if (newVal.length) {
+                if (newVal.includes('INVENTORY_AWEME_FEED')) {
+                    this.isTAwemeStatus = true;
+                }
+                else {
+                    this.isTAwemeStatus = false;
+                }
             }
             else {
-                this.isTAwemeStatus = false;
-                this.configForm.creativeMaterialMode = 'STATIC_ASSEMBLE';
-                this.configForm.creativeImageMode = 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL';
-                this.configForm.creativeIsCommentDisable = 0;
-                this.configForm.creativeDownloadStatus = 1;
-                this.configForm.creativeDisplayMode = 'CREATIVE_DISPLAY_MODE_CTR';
-            }
-            if ((!newVal.includes('INVENTORY_TOMATO_NOVEL') && !newVal.includes('INVENTORY_AWEME_FEED')) || (newVal.includes('INVENTORY_TOMATO_NOVEL') && newVal.includes('INVENTORY_AWEME_FEED'))) {
-                this.isTomatoStatus = true;
-                this.isTAwemeStatus = true;
-                this.configForm.creativeMaterialMode = 'STATIC_ASSEMBLE';
-                this.configForm.creativeImageMode = 'CREATIVE_IMAGE_MODE_VIDEO_VERTICAL';
-                this.configForm.creativeIsCommentDisable = 0;
-                this.configForm.creativeDownloadStatus = 1;
-                this.configForm.creativeDisplayMode = 'CREATIVE_DISPLAY_MODE_CTR';
-            }
-            if (!newVal.length) {
-                this.isTomatoStatus = true;
                 this.isTAwemeStatus = true;
             }
         },
@@ -2107,12 +2097,14 @@ export default {
             if (e.target.value === 'a') {
                 this.configForm.radioChangeValue = '';
                 this.configForm.checkboxChangeValue = [];
+                this.isTAwemeStatus = true;
             }
             else if (e.target.value === 'b') {
                 this.configForm.radioChangeValue = '';
             }
             else if (e.target.value === 'c') {
                 this.configForm.checkboxChangeValue = [];
+                this.isTAwemeStatus = true;
             }
         },
         handleAccountMode(e) {
@@ -2388,6 +2380,12 @@ export default {
                         else if (detailData.creativeInventoryType) {
                             this.configForm.adverPosition = 'b';
                             this.configForm.checkboxChangeValue = detailData.creativeInventoryType.split(',');
+                            if (this.configForm.checkboxChangeValue.includes('INVENTORY_AWEME_FEED')) {
+                                this.isTAwemeStatus = true;
+                            }
+                            else {
+                                this.isTAwemeStatus = false;
+                            }
                         }
                         else {
                             this.configForm.adverPosition = 'a';
@@ -2529,6 +2527,10 @@ export default {
                 });
             });
         },
+        handleCreativeWebUrl(e) {
+            const defaultValue = e.target.value;
+            this.landingPageShowData = {};
+        },
         handleDownloadLink(e) {
             const defaultValue = e.target.value;
             if (defaultValue) {

+ 108 - 64
src/views/modules/headline-view/headline-view.vue

@@ -12,7 +12,7 @@
                                 :allowClear="false"
                                 format="YYYY-MM-DD"
                                 :disabled-date="disabledDate"
-                                @change="handleCostTimeChange"
+                                @change="handleCostTimeChange" 
                             />
                         </div>
                         <div class="costInfo">
@@ -22,18 +22,21 @@
                             </div>
                             <a-divider type="vertical"/>
                             <div class="tongbi">
-                                <div style="margin-bottom:8px;margin-left: 23px;">
+                                <div style="margin-bottom:8px;margin-left: 10px;">
                                     同比
                                     <a-tooltip >
                                         <template slot="title">
                                             <span>截止此时今日与昨日的花费同比</span>
                                         </template>
-                                        <a-icon type="question-circle" />
+                                        <a-icon type="question-circle"/>
                                     </a-tooltip>
                                 </div>
-                                <div style="font-size:14px;font-weight:600">
-                                    <a-icon type="arrow-down" style="color: #f00"/>
-                                    {{ yearCostReportList.compare || 0 }}
+                                <div style="font-size:14px;font-weight:600;text-align: end;">
+                                    <span class="sign">
+                                        <a-icon v-if="Number(yearCostReportList.compare) >= 0" type="rise" class="rise"/>
+                                        <a-icon v-if="Number(yearCostReportList.compare) < 0" type="fall" class="fall"/>
+                                    </span>
+                                    {{ yearCostReportList.compare ? yearCostReportList.compare + '%' : '-' }}
                                 </div>
                             </div>
                         </div>
@@ -63,7 +66,8 @@
                     <div class="top">                       
                         <div class="item" v-for="item in throwColumns" :key="item.dataIndex">
                             <div class="todyCost">
-                                <span v-if="item.type === 'double'">{{ Number(item.today) | decimalsHandle }}</span>
+                                <span v-if="item.type === 'spend'">{{ Number(item.today) | decimalsHandle }}</span>
+                                <span v-else-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">
@@ -73,7 +77,8 @@
                             </div>
                             <div class="yesterdayCost">
                                 <span>/ 昨日: </span>
-                                <span v-if="item.type === 'double'">{{ Number(item.yesterday) | decimalsHandle }}</span>
+                                <span v-if="item.type === 'spend'">{{ Number(item.yesterday) | decimalsHandle }}</span>
+                                <span v-else-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>
@@ -94,6 +99,9 @@
                         </div>
                     </div>
                     <div class="echart" style="margin-top:20px;position:relative">
+                        <div style="position:absolute;right:5px;top:-15px">
+                            更新时间:{{ yearCostReportList.updTime || '-' }}
+                        </div>
                         <a-spin :spinning="accountIndexEchartSpinning">
                             <div
                                 class="accountIndexEchart"
@@ -136,6 +144,7 @@
                 <div class="title">
                     <div class="titleContext">
                         投放数据
+                        <span class="titleTip">更新时间:{{ planData.length ? planData[0].updateTime : '-' }}</span>
                     </div>
                     <div style="float: right;margin-top: -23px;">
                         <a-range-picker 
@@ -152,6 +161,7 @@
                         :columns="planColumns"
                         :data-source="planData"
                         :pagination="false"
+                        :scroll="{x: 1500}"
                     >
                     <span slot="optStatus" slot-scope="text, record">
                         <a-switch :checked="text === 'AD_STATUS_ENABLE'" @change="handleSwitchChang($event, record)"/>
@@ -194,13 +204,16 @@
                     />
                 </div>
             </div>
-            <div class="titleContext source-material"> 素材相关</div>
+            <div class="titleContext source-material">
+                素材相关
+                <span class="titleTip">更新时间:{{ materialData.length ? materialData[0].updateTime : '-' }}</span></div>
             <div class="materialBodyRight">
                 <div class="material-table-class">
                     <a-table
                         :columns="materialColumns"
                         :data-source="materialData"
                         :pagination="false"
+                        :scroll="{x: 1500}"
                     >
                         <span slot="posterUrl" slot-scope="text,record">
                             <div style="background:#e8e8e8;text-align:center;border-radius:3px">
@@ -300,7 +313,7 @@
                     :label-col="labelCol"
                     :wrapper-col="wrapperCol"
                 >
-                    <a-form-model-item label="价" prop="budget">
+                    <a-form-model-item label="价" prop="budget">
                         <a-input-number v-model="budgetForm.budget"/> 元
                     </a-form-model-item>
                 </a-form-model>
@@ -354,6 +367,14 @@ export default {
             accountVisible: false,
             throwColumns: [
                 {
+                    title: '花费',
+                    dataIndex: 'spendCost',
+                    key: 'spendCost',
+                    today: 0,
+                    yesterday: 0,
+                    type: 'spend'
+                },
+                {
                     title: '转化成本',
                     dataIndex: 'activationCost',
                     key: 'activationCost',
@@ -389,9 +410,9 @@ export default {
             newLink: '',
             linkVisible: false,
             targetVisible: false,
-            isActive: 'activationCost',
+            isActive: 'spendCost',
             moment,
-            materialDate: [],
+            materialDate: [moment().subtract(1,'days').format('YYYY-MM-DD'), moment().subtract(1,'days').format('YYYY-MM-DD')],
             dateValue: [],
             planData: [],
             planPagin: {
@@ -404,13 +425,14 @@ export default {
                     dataIndex: 'adName',
                     key: 'adName',
                     align: 'center',
-                    width: 120
+                    width: 240
                 },
                 {
                     title: '花费',
                     dataIndex: 'cost',
                     key: 'cost',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.cost - b.cost
                 },
                 {
@@ -418,6 +440,7 @@ export default {
                     dataIndex: 'cpaBid',
                     key: 'cpaBid',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.cpaBid - b.cpaBid
                 },
                 {
@@ -425,6 +448,7 @@ export default {
                     dataIndex: 'showNum',
                     key: 'showNum',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.showNum - b.showNum
                 },
                 {
@@ -432,6 +456,7 @@ export default {
                     dataIndex: 'averageShow',
                     key: 'averageShow',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.averageShow - b.averageShow
                 },
                 {
@@ -439,6 +464,7 @@ export default {
                     dataIndex: 'click',
                     key: 'click',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.click - b.click
                 },
                 {
@@ -446,6 +472,7 @@ export default {
                     dataIndex: 'averageClick',
                     key: 'averageClick',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.averageClick - b.averageClick
                 },
                 {
@@ -453,6 +480,7 @@ export default {
                     dataIndex: 'clickRate',
                     key: 'clickRate',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.clickRate.split('%')[0] - b.clickRate.split('%')[0]
                 },
                 {
@@ -460,6 +488,7 @@ export default {
                     dataIndex: 'convertNum',
                     key: 'convertNum',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.convertNum - b.convertNum
                 },
                 {
@@ -467,6 +496,7 @@ export default {
                     dataIndex: 'converRate',
                     key: 'converRate',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.converRate.split('%')[0] - b.converRate.split('%')[0]
                 },
                 {
@@ -474,19 +504,22 @@ export default {
                     dataIndex: 'conver',
                     key: 'conver',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.conver - b.conver
                 },
                 {
-                    title: '比',
+                    title: '比',
                     dataIndex: 'compare',
                     key: 'compare',
-                    align: 'center'
+                    align: 'center',
+                    width: 180
                 },
                 {
                     title: '状态',
                     dataIndex: 'optStatus',
                     key: 'optStatus',
                     align: 'center',
+                    width: 180,
                     scopedSlots: {customRender: 'optStatus'}
                 },
                 {
@@ -494,6 +527,8 @@ export default {
                     dataIndex: 'operator',
                     key: 'operator',
                     align: 'center',
+                    fixed: 'right',
+                    width: 200,
                     scopedSlots: {customRender: 'operator'}
                 }
             ],
@@ -515,12 +550,14 @@ export default {
                     title: '素材ID',
                     dataIndex: 'materialId',
                     key: 'materialId',
+                    width: 180,
                     align: 'center'
                 },
                 {
                     title: '花费',
                     dataIndex: 'cost',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.cost - b.cost
                 },
                 {
@@ -528,6 +565,7 @@ export default {
                     dataIndex: 'showMaterial',
                     key: 'showMaterial',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.showMaterial - b.showMaterial
                 },
                 {
@@ -535,6 +573,7 @@ export default {
                     dataIndex: 'costPerThousandShow',
                     key: 'costPerThousandShow',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.costPerThousandShow - b.costPerThousandShow
                 },
                 {
@@ -542,6 +581,7 @@ export default {
                     dataIndex: 'click',
                     key: 'click',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.click - b.click
                 },
                 {
@@ -549,6 +589,7 @@ export default {
                     dataIndex: 'costPerClick',
                     key: 'costPerClick',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.costPerClick - b.costPerClick
                 },
                 {
@@ -556,6 +597,7 @@ export default {
                     dataIndex: 'clickRate',
                     key: 'clickRate',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.clickRate.split('%')[0] - b.clickRate.split('%')[0]
                 },
                 {
@@ -563,6 +605,7 @@ export default {
                     dataIndex: 'convertMaterial',
                     key: 'convertMaterial',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.convertMaterial - b.convertMaterial
                 },
                 {
@@ -570,18 +613,21 @@ export default {
                     dataIndex: 'convertRate',
                     key: 'convertRate',
                     align: 'center',
+                    width: 180,
                     sorter: (a, b) => a.convertRate.split('%')[0] - b.convertRate.split('%')[0]
                 },
                 {
                     title: '转化成本',
                     dataIndex: 'costConvert',
                     key: 'costConvert',
+                    width: 180,
                     align: 'center'
                 },
                 {
                     title: '关联创意数',
                     dataIndex: 'count',
                     key: 'count',
+                    width: 180,
                     align: 'center'
                 },
                 {
@@ -589,6 +635,7 @@ export default {
                     dataIndex: 'materialUploadTime',
                     key: 'photoShow',
                     align: 'center',
+                    width: 180,
                     scopedSlots: {customRender: 'photoShow'}
                 }
             ],
@@ -745,15 +792,17 @@ export default {
                 if (result.code === 0) {
                     this.yearCostReportList = result.result;
                     this.initEchart('gaugeEchart', this.initGaugechart(result.result.costShare));
-                    this.initEchart('accountIndexEchart', this.initAccountIndexEchart(result.result, 'activationCost'));
-                    this.throwColumns[0].today = Number(result.result.nowMap.conver);
-                    this.throwColumns[0].yesterday = Number(result.result.lastMap.conver);
-                    this.throwColumns[1].today = Number(result.result.nowMap.converNum);
-                    this.throwColumns[1].yesterday = Number(result.result.lastMap.converNum);
-                    this.throwColumns[2].today = Number(result.result.nowMap.converRate);
-                    this.throwColumns[2].yesterday = Number(result.result.lastMap.converRate);
-                    this.throwColumns[3].today = Number(result.result.nowMap.averageShow);
-                    this.throwColumns[3].yesterday = Number(result.result.lastMap.averageShow);
+                    this.initEchart('accountIndexEchart', this.initAccountIndexEchart(result.result, 'spendCost'));
+                    this.throwColumns[0].today = Number(result.result.nowCost);
+                    this.throwColumns[0].yesterday = Number(result.result.lastCost);
+                    this.throwColumns[1].today = Number(result.result.nowMap.conver);
+                    this.throwColumns[1].yesterday = Number(result.result.lastMap.conver);
+                    this.throwColumns[2].today = Number(result.result.nowMap.converNum);
+                    this.throwColumns[2].yesterday = Number(result.result.lastMap.converNum);
+                    this.throwColumns[3].today = Number(result.result.nowMap.converRate);
+                    this.throwColumns[3].yesterday = Number(result.result.lastMap.converRate);
+                    this.throwColumns[4].today = Number(result.result.nowMap.averageShow);
+                    this.throwColumns[4].yesterday = Number(result.result.lastMap.averageShow);
                 }
                 else {
                     this.$message.error(result.message);
@@ -774,7 +823,6 @@ export default {
                     const defaultTime = [result.result.startTime, result.result.endTime];
                     this.dateValue = [...defaultTime];
                     this.planRangePicker = [...defaultTime];
-                    this.materialDate = [...defaultTime];
                     this.handleGetAccountMessage(result.result.account.accountId);
                     this.handleYearOnYearCost(result.result);
                     this.handleGetPlanTableList(result.result);
@@ -805,8 +853,8 @@ export default {
         handleGetmaterialData(data) {
             const paramsData = {
                 accountId: data.account.accountId,
-                startTime: data.startTime,
-                endTime: data.endTime,
+                startTime: this.materialDate[0],
+                endTime: this.materialDate[1],
                 pageNum: this.materPagin.page,
                 pageSize: this.materPagin.size
             };
@@ -984,7 +1032,11 @@ export default {
             }
             let tadayShowY = [];
             let yestodayShowY = [];
-            if (type === 'activationCost') {
+            if (type === 'spendCost') {
+                tadayShowY = data.nowMap.costList.map(item => item.cost);
+                yestodayShowY = data.lastMap.costList.map(item => item.cost);
+            }
+            else if (type === 'activationCost') {
                 tadayShowY = data.nowMap.costList.map(item => item.conver);
                 yestodayShowY = data.lastMap.costList.map(item => item.conver);
             }
@@ -1005,20 +1057,12 @@ export default {
                     trigger: 'axis',
                     formatter: params => {
                         let isType = '';
-                        let showBai = '';
+                        let showBai = this.isActive === 'bclick' || this.isActive === 'formCount' ? '%' : '';
                         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++) {
                             const showTime = specialIdentification === '时' ? params[i].seriesName : '';
@@ -1375,6 +1419,31 @@ export default {
         .common-input-long {
             width: 140px !important;
         }
+        .sign {
+            font-size: 18px;
+            .rise {
+                color: #F2637B;
+                width: 16px;
+                height: 16px;
+                text-align: center;
+                transform: rotate(-30deg);
+            }
+            .fall {
+                color: green;
+                width: 16px;
+                height: 16px;
+                text-align: center;
+                transform: rotate(30deg);
+            }
+            .up {
+                width: 16px;
+                height: 16px;
+                text-align: center;
+                background-color: #F2637B;
+                border-radius: 5px;
+                color: white;
+            }
+        }
         .pagin-table-class {
             display: flex;
             justify-content: flex-end;
@@ -1398,14 +1467,14 @@ export default {
             
         }
         .accountBodyLeft {
-            width: 75%;
+            width: 80%;
             margin-right: 26px;
             padding: 20px;
             display: flex;
             justify-content: space-between;
         }
         .accountBodyRight {
-            width: 25%;
+            width: 18%;
             padding: 25px;
         }
         .accountBodyLeft,.accountBodyRight {
@@ -1501,31 +1570,6 @@ export default {
                 margin-bottom: 10px;
                 width: 100%;
             }
-            .sign {
-                font-size: 18px;
-                .rise {
-                    color: #F2637B;
-                    width: 16px;
-                    height: 16px;
-                    text-align: center;
-                    transform: rotate(-30deg);
-                }
-                .fall {
-                    color: green;
-                    width: 16px;
-                    height: 16px;
-                    text-align: center;
-                    transform: rotate(30deg);
-                }
-                .up {
-                    width: 16px;
-                    height: 16px;
-                    text-align: center;
-                    background-color: #F2637B;
-                    border-radius: 5px;
-                    color: white;
-                }
-            }
             .yesterdayCost {
                 font-size: 0.89rem;
                 font-weight: 500;