|
|
@@ -1,6 +1,12 @@
|
|
|
<template>
|
|
|
<div class="hardAdvertisement">
|
|
|
<el-loading></el-loading>
|
|
|
+ <div class="titleHead" v-if="channleList[channel_act]">
|
|
|
+ <div class="line"></div>
|
|
|
+ <div class="titleText">
|
|
|
+ {{ channleList[channel_act].channelName }}硬广分析报告
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
<el-card class="box-card">
|
|
|
<el-row>
|
|
|
<el-col :span="2" class="colTime channelSelect">
|
|
|
@@ -212,56 +218,61 @@
|
|
|
}}
|
|
|
单位（{{ customer_list[customer_act].company }}）
|
|
|
</div>
|
|
|
- <el-table
|
|
|
- :data="customerData.now"
|
|
|
- :show-header="false"
|
|
|
- style="width: 100%;"
|
|
|
- max-height="400"
|
|
|
+ <div
|
|
|
+ style="position: relative;height: 400px;overflow-y: auto; "
|
|
|
+ ref="left"
|
|
|
>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- type="index"
|
|
|
- label="序号"
|
|
|
- width="50"
|
|
|
- />
|
|
|
- <el-table-column align="center" prop="brand" />
|
|
|
- <el-table-column align="center" prop="state" />
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- :prop="customer_list[customer_act].customerType"
|
|
|
- >
|
|
|
- <template #default="scope">
|
|
|
- <span
|
|
|
- v-if="customer_list[customer_act].customerType === 'fee'"
|
|
|
- >{{
|
|
|
- (scope.row.fee / 10000)
|
|
|
- .toFixed(2)
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
+ <div
|
|
|
+ class="customer_list_act"
|
|
|
+ :style="'top:' + hoverList[0] + 'px'"
|
|
|
+ ></div>
|
|
|
+ <table style="width: 100%">
|
|
|
+ <tbody>
|
|
|
+ <tr
|
|
|
+ class="tr"
|
|
|
+ v-for="(item, i) in customerData.now"
|
|
|
+ :key="item"
|
|
|
+ @mouseenter="() => hoverTableLeft(item, i)"
|
|
|
>
|
|
|
- <span
|
|
|
- v-if="
|
|
|
- customer_list[customer_act].customerType === 'timeSize'
|
|
|
- "
|
|
|
- >{{
|
|
|
- (scope.row.timeSize / 1000)
|
|
|
- .toFixed(2)
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
- >
|
|
|
- <span
|
|
|
- v-if="
|
|
|
- customer_list[customer_act].customerType === 'pinci'
|
|
|
- "
|
|
|
- >{{
|
|
|
- scope.row.pinci
|
|
|
- .toString()
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
- >
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
+ <td class="td" v-text="i + 1"></td>
|
|
|
+ <td class="td" v-text="item.brand"></td>
|
|
|
+ <td class="td">
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType === 'fee'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ (item.fee / 10000)
|
|
|
+ .toFixed(2)
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType ===
|
|
|
+ 'timeSize'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ (item.timeSize / 1000)
|
|
|
+ .toFixed(2)
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType === 'pinci'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ item.pinci
|
|
|
+ .toString()
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col
|
|
|
@@ -275,56 +286,62 @@
|
|
|
}}
|
|
|
单位（{{ customer_list[customer_act].company }}）
|
|
|
</div>
|
|
|
- <el-table
|
|
|
- :data="customerData.before"
|
|
|
- :show-header="false"
|
|
|
- style="width: 100%;"
|
|
|
- max-height="400"
|
|
|
+
|
|
|
+ <div
|
|
|
+ style="position: relative;height: 400px;overflow-y: auto;"
|
|
|
+ ref="right"
|
|
|
>
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- type="index"
|
|
|
- label="序号"
|
|
|
- width="50"
|
|
|
- />
|
|
|
- <el-table-column align="center" prop="brand" />
|
|
|
- <el-table-column align="center" prop="state" />
|
|
|
- <el-table-column
|
|
|
- align="center"
|
|
|
- :prop="customer_list[customer_act].customerType"
|
|
|
- >
|
|
|
- <template #default="scope">
|
|
|
- <span
|
|
|
- v-if="customer_list[customer_act].customerType === 'fee'"
|
|
|
- >{{
|
|
|
- (scope.row.fee / 10000)
|
|
|
- .toFixed(2)
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
+ <div
|
|
|
+ class="customer_list_act"
|
|
|
+ :style="'top:' + hoverList[1] + 'px'"
|
|
|
+ ></div>
|
|
|
+ <table style="width: 100%">
|
|
|
+ <tbody>
|
|
|
+ <tr
|
|
|
+ class="tr"
|
|
|
+ v-for="(item, i) in customerData.before"
|
|
|
+ :key="item"
|
|
|
+ @mouseenter="() => hoverTableRight(item, i)"
|
|
|
>
|
|
|
- <span
|
|
|
- v-if="
|
|
|
- customer_list[customer_act].customerType === 'timeSize'
|
|
|
- "
|
|
|
- >{{
|
|
|
- (scope.row.timeSize / 1000)
|
|
|
- .toFixed(2)
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
- >
|
|
|
- <span
|
|
|
- v-if="
|
|
|
- customer_list[customer_act].customerType === 'pinci'
|
|
|
- "
|
|
|
- >{{
|
|
|
- scope.row.pinci
|
|
|
- .toString()
|
|
|
- .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
- }}</span
|
|
|
- >
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
+ <td class="td" v-text="i + 1"></td>
|
|
|
+ <td class="td" v-text="item.brand"></td>
|
|
|
+ <td class="td">
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType === 'fee'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ (item.fee / 10000)
|
|
|
+ .toFixed(2)
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType ===
|
|
|
+ 'timeSize'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ (item.timeSize / 1000)
|
|
|
+ .toFixed(2)
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ <span
|
|
|
+ v-if="
|
|
|
+ customer_list[customer_act].customerType === 'pinci'
|
|
|
+ "
|
|
|
+ >{{
|
|
|
+ item.pinci
|
|
|
+ .toString()
|
|
|
+ .replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
+ }}</span
|
|
|
+ >
|
|
|
+ </td>
|
|
|
+ </tr>
|
|
|
+ </tbody>
|
|
|
+ </table>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
@@ -361,7 +378,14 @@
|
|
|
label="厂商名称"
|
|
|
/>
|
|
|
<el-table-column align="center" prop="customer" label="产品数量" />
|
|
|
- <el-table-column align="center" prop="fee" label="费用（万元）">
|
|
|
+ <el-table-column align="center" prop="fee">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="advantage_act === 1"
|
|
|
+ title="费用（万元）"
|
|
|
+ @click="() => advantageSort(1)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
(scope.row.fee / 10000)
|
|
|
@@ -370,7 +394,14 @@
|
|
|
}}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column align="center" prop="timeSize" label="时长（秒）">
|
|
|
+ <el-table-column align="center" prop="timeSize">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="advantage_act === 2"
|
|
|
+ title="时长（秒）"
|
|
|
+ @click="() => advantageSort(2)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
(scope.row.timeSize / 1000)
|
|
|
@@ -379,7 +410,14 @@
|
|
|
}}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column align="center" prop="pinci" label="频次（次）">
|
|
|
+ <el-table-column align="center" prop="pinci">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="advantage_act === 3"
|
|
|
+ title="频次（次）"
|
|
|
+ @click="() => advantageSort(3)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
scope.row.pinci.toFixed(0).replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
@@ -417,7 +455,14 @@
|
|
|
prop="pruducter"
|
|
|
label="厂商名称"
|
|
|
/>
|
|
|
- <el-table-column align="center" prop="fee" label="费用（万元）">
|
|
|
+ <el-table-column align="center" prop="fee">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="potential_act === 1"
|
|
|
+ title="费用（万元）"
|
|
|
+ @click="() => potentialSort(1)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
(scope.row.fee / 10000)
|
|
|
@@ -426,7 +471,14 @@
|
|
|
}}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column align="center" prop="timeSize" label="时长（秒）">
|
|
|
+ <el-table-column align="center" prop="timeSize">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="potential_act === 2"
|
|
|
+ title="时长（秒）"
|
|
|
+ @click="() => potentialSort(2)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
(scope.row.timeSize / 1000)
|
|
|
@@ -435,7 +487,14 @@
|
|
|
}}</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
- <el-table-column align="center" prop="pinci" label="频次（次）">
|
|
|
+ <el-table-column align="center" prop="pinci">
|
|
|
+ <template #header>
|
|
|
+ <down
|
|
|
+ :act="potential_act === 3"
|
|
|
+ title="频次（次）"
|
|
|
+ @click="() => potentialSort(3)"
|
|
|
+ ></down>
|
|
|
+ </template>
|
|
|
<template #default="scope">
|
|
|
<span>{{
|
|
|
scope.row.pinci.toFixed(0).replace(/(?=(\B)(\d{3})+\.)/g, ",")
|
|
|
@@ -480,12 +539,14 @@ import {
|
|
|
saturationList,
|
|
|
} from "@/api/index.js";
|
|
|
// import config from "@/config/index";
|
|
|
+import down from "./components/down.vue";
|
|
|
import * as echarts from "echarts";
|
|
|
export default {
|
|
|
name: "hardAdvertisement",
|
|
|
data() {
|
|
|
return {
|
|
|
channleList: [],
|
|
|
+ hoverList: [0, 0],
|
|
|
active: 0,
|
|
|
timeSelect: [],
|
|
|
channel_act: 0,
|
|
|
@@ -493,6 +554,8 @@ export default {
|
|
|
customer_act: 0,
|
|
|
launch_act: 0,
|
|
|
trend_act: 0,
|
|
|
+ advantage_act: 1,
|
|
|
+ potential_act: 1,
|
|
|
launch_list: [
|
|
|
{
|
|
|
text: "费用",
|
|
|
@@ -614,6 +677,7 @@ export default {
|
|
|
channelId: this.channleList[this.channel_act].channelId,
|
|
|
start: sel.startDate,
|
|
|
end: sel.endDate,
|
|
|
+ order: this.advantage_act,
|
|
|
}).then(advantageous => {
|
|
|
this.advantageous = advantageous || [];
|
|
|
});
|
|
|
@@ -779,8 +843,8 @@ export default {
|
|
|
numFor(num) {
|
|
|
if (!num) return 0;
|
|
|
if (isNaN(num)) return 0;
|
|
|
- if (num >= 100000000) return (num / 100000000).toFixed(0) - 0 + "亿";
|
|
|
- if (num >= 10000) return (num / 10000).toFixed(0) - 0 + "万";
|
|
|
+ if (num >= 100000000) return (num / 100000000).toFixed(2) - 0 + "亿";
|
|
|
+ if (num >= 10000) return (num / 10000).toFixed(2) - 0 + "万";
|
|
|
return Number(num).toFixed(2);
|
|
|
},
|
|
|
launchChart(list) {
|
|
|
@@ -818,16 +882,28 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
+ color: ["#1b9ade", "#fd5555"],
|
|
|
tooltip: {
|
|
|
trigger: "axis",
|
|
|
+ textStyle: {
|
|
|
+ color: "#000000",
|
|
|
+ },
|
|
|
+ extraCssText: "box-shadow: 0 0 3px 1b9ade;",
|
|
|
formatter: item => {
|
|
|
+ let s = item[0] || {},
|
|
|
+ e = item[1] || {};
|
|
|
let bf = list.before || [],
|
|
|
no = list.now || [];
|
|
|
- let vb = this.numFor(item[0].value || 0),
|
|
|
- vn = this.numFor(item[1].value || 0);
|
|
|
- return `${this.launch_list[this.launch_act].text} <br /> ${
|
|
|
- bf[item[0].dataIndex].dt
|
|
|
- } ${vb} <br />${no[item[0].dataIndex].dt} ${vn}`;
|
|
|
+ let vb = this.numFor(s.value || 0),
|
|
|
+ vn = this.numFor(e.value || 0),
|
|
|
+ launch_list = this.launch_list[this.launch_act] || {};
|
|
|
+ let out = "";
|
|
|
+ if (s.dataIndex >= 0)
|
|
|
+ out += `${launch_list.text} <br /> ${bf[s.dataIndex].dt} ${vb +
|
|
|
+ launch_list.unit}`;
|
|
|
+ if (e.dataIndex >= 0)
|
|
|
+ out += `<br />${no[e.dataIndex].dt} ${vn + launch_list.unit}`;
|
|
|
+ return out;
|
|
|
},
|
|
|
},
|
|
|
grid: [{ left: 150, top: "10%", buttom: 0, right: 100 }],
|
|
|
@@ -837,6 +913,21 @@ export default {
|
|
|
data,
|
|
|
type: "line",
|
|
|
smooth: true,
|
|
|
+ showSymbol: false,
|
|
|
+ itemStyle: {
|
|
|
+ emphasis: {
|
|
|
+ borderWidth: 3,
|
|
|
+ borderColor: i === 0 ? "#1b9ade" : "#fd5555",
|
|
|
+ color: i === 0 ? "#1b9ade" : "#fd5555",
|
|
|
+ shadowColor:
|
|
|
+ i === 0
|
|
|
+ ? "rgba(27, 154, 222, 0.5)"
|
|
|
+ : "rgba(253, 85, 85, 0.5)",
|
|
|
+ shadowBlur: 10,
|
|
|
+ shadowOffsetX: 0,
|
|
|
+ shadowOffsetY: 0,
|
|
|
+ },
|
|
|
+ },
|
|
|
};
|
|
|
}),
|
|
|
};
|
|
|
@@ -865,15 +956,14 @@ export default {
|
|
|
tooltip: {
|
|
|
trigger: "axis",
|
|
|
formatter: item => {
|
|
|
- let s = item[0] || {}, e = item[1] || {};
|
|
|
+ let s = item[0] || {},
|
|
|
+ e = item[1] || {};
|
|
|
let vb = this.numFor(s.value || 0),
|
|
|
vn = this.numFor(e.value || 0),
|
|
|
sele = this.launch_list[this.trend_act];
|
|
|
- return `${sele.text} <br />${s.seriesName} ${
|
|
|
- s.name
|
|
|
- }时 ${vb + (sele.unit || "")} <br />${e.seriesName || ""} ${
|
|
|
- s.name
|
|
|
- }时 ${vn + (sele.unit || "")}`;
|
|
|
+ return `${sele.text} <br />${s.seriesName} ${s.name}时 ${vb +
|
|
|
+ (sele.unit || "")} <br />${e.seriesName || ""} ${s.name}时 ${vn +
|
|
|
+ (sele.unit || "")}`;
|
|
|
},
|
|
|
},
|
|
|
yAxis: {
|
|
|
@@ -885,6 +975,7 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
+ color: ["#1b9ade", "#fd5555"],
|
|
|
grid: [{ left: 150, top: "10%", buttom: 0, right: 100 }],
|
|
|
series: chartData.value.map((v, i) => {
|
|
|
return {
|
|
|
@@ -937,6 +1028,7 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
grid: [{ left: 50, top: "10%", buttom: 0, right: 100 }],
|
|
|
+ color: ["#1b9ade", "#fd5555"],
|
|
|
series: [
|
|
|
{
|
|
|
name: "饱和度",
|
|
|
@@ -999,6 +1091,65 @@ export default {
|
|
|
|
|
|
option && proportion_chart.setOption(option);
|
|
|
},
|
|
|
+ advantageSort(type) {
|
|
|
+ let sel = this.timeSelect[this.active];
|
|
|
+ this.advantage_act = type;
|
|
|
+ advantageousList({
|
|
|
+ channelId: this.channleList[this.channel_act].channelId,
|
|
|
+ start: sel.startDate,
|
|
|
+ end: sel.endDate,
|
|
|
+ order: this.advantage_act,
|
|
|
+ }).then(advantageous => {
|
|
|
+ this.advantageous = advantageous || [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ potentialSort(type) {
|
|
|
+ let sel = this.timeSelect[this.active];
|
|
|
+ this.potential_act = type;
|
|
|
+ potentialList({
|
|
|
+ channelId: this.channleList[this.channel_act].channelId,
|
|
|
+ start: sel.startDate,
|
|
|
+ end: sel.endDate,
|
|
|
+ order: this.potential_act,
|
|
|
+ }).then(potential => {
|
|
|
+ this.potentialData = potential || [];
|
|
|
+ });
|
|
|
+ },
|
|
|
+ hoverTableLeft(row, thisIndex) {
|
|
|
+ let ortherList = this.customerData.before || [];
|
|
|
+ let ortherIndex = ortherList.findIndex(item => {
|
|
|
+ return item.brand === row.brand;
|
|
|
+ });
|
|
|
+
|
|
|
+ let left = { item: this.customerData.now || {}, index: thisIndex },
|
|
|
+ right = { item: this.customerData.before || {}, index: ortherIndex };
|
|
|
+
|
|
|
+ this.hoverList = this.linkScroll(left, right);
|
|
|
+
|
|
|
+ this.$refs.right.scrollTop = this.hoverList[1] - 100;
|
|
|
+ },
|
|
|
+ hoverTableRight(row, thisIndex) {
|
|
|
+ let ortherList = this.customerData.now || [];
|
|
|
+ let ortherIndex = ortherList.findIndex(item => {
|
|
|
+ return item.brand === row.brand;
|
|
|
+ });
|
|
|
+
|
|
|
+ let left = { item: this.customerData.now || {}, index: ortherIndex },
|
|
|
+ right = { item: this.customerData.before || {}, index: thisIndex };
|
|
|
+
|
|
|
+ this.hoverList = this.linkScroll(left, right);
|
|
|
+ this.$refs.left.scrollTop = this.hoverList[0] - 100;
|
|
|
+ },
|
|
|
+ linkScroll(left, right) {
|
|
|
+ let scrollTop = [];
|
|
|
+ scrollTop[0] = this.$refs.left.querySelectorAll("tr")[
|
|
|
+ left.index
|
|
|
+ ].offsetTop;
|
|
|
+ scrollTop[1] = this.$refs.right.querySelectorAll("tr")[
|
|
|
+ right.index
|
|
|
+ ].offsetTop;
|
|
|
+ return scrollTop;
|
|
|
+ },
|
|
|
},
|
|
|
beforeUnmount: function() {
|
|
|
launch_chart.dispose();
|
|
|
@@ -1010,7 +1161,9 @@ export default {
|
|
|
proportion_chart = undefined;
|
|
|
saturation_chart = undefined;
|
|
|
},
|
|
|
- components: {},
|
|
|
+ components: {
|
|
|
+ down,
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
|
|
|
@@ -1097,6 +1250,16 @@ export default {
|
|
|
border: 1px solid #d2e7fc;
|
|
|
border-top: 3px solid #40a1f3;
|
|
|
}
|
|
|
+.hardAdvertisement .customer_list_act {
|
|
|
+ position: absolute;
|
|
|
+ border: 2px solid #65aaff;
|
|
|
+ width: 405px;
|
|
|
+ z-index: 1;
|
|
|
+ height: 47px;
|
|
|
+ top: 42px;
|
|
|
+ left: 16px;
|
|
|
+ transition: all 0.2s;
|
|
|
+}
|
|
|
.hardAdvertisement .customer_list_head {
|
|
|
line-height: 42px;
|
|
|
height: 42px;
|
|
|
@@ -1111,4 +1274,53 @@ export default {
|
|
|
font-weight: 600;
|
|
|
color: #000;
|
|
|
}
|
|
|
+.hardAdvertisement .titleHead {
|
|
|
+ text-align: center;
|
|
|
+ position: relative;
|
|
|
+ height: 135px;
|
|
|
+ line-height: 135px;
|
|
|
+}
|
|
|
+.hardAdvertisement .line {
|
|
|
+ border-top: 1px solid #1989fa;
|
|
|
+ position: absolute;
|
|
|
+ width: 100%;
|
|
|
+ top: 50%;
|
|
|
+ z-index: 0;
|
|
|
+}
|
|
|
+.hardAdvertisement .titleText {
|
|
|
+ background-color: #fff;
|
|
|
+ color: #1989fa;
|
|
|
+ position: relative;
|
|
|
+ z-index: 1;
|
|
|
+ padding: 0 10px;
|
|
|
+ display: inline-block;
|
|
|
+ font-weight: 700;
|
|
|
+ font-size: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+.hardAdvertisement .is-plain {
|
|
|
+ background-color: #ffffff !important;
|
|
|
+ border-color: #1989fa;
|
|
|
+ border-right: 1px solid #1989fa !important;
|
|
|
+ border-left: 1px solid #1989fa !important;
|
|
|
+ color: #1989fa;
|
|
|
+}
|
|
|
+.hardAdvertisement .is-plain:hover {
|
|
|
+ color: #1989fa;
|
|
|
+ border-color: #1989fa;
|
|
|
+}
|
|
|
+
|
|
|
+.hardAdvertisement .tr {
|
|
|
+ border-bottom: 1px solid rgb(128, 128, 128);
|
|
|
+}
|
|
|
+.hardAdvertisement .td {
|
|
|
+ padding: 12px 0;
|
|
|
+ -webkit-box-sizing: border-box;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ vertical-align: middle;
|
|
|
+ position: relative;
|
|
|
+ text-align: center;
|
|
|
+ color: #439ff4;
|
|
|
+}
|
|
|
</style>
|
liyongli