|
|
<template>
|
|
|
<div class="home-box">
|
|
|
<el-row type="flex" class="main-row">
|
|
|
<el-col :span="16" class="home-main-left">
|
|
|
<div class="enterprise-header">
|
|
|
<span class="dataCloudMap-birght"></span>
|
|
|
<div class="enterprise-header-title">专项资金、荣誉、投资等统计</div>
|
|
|
</div>
|
|
|
<el-row class="home-enterprise-top">
|
|
|
<el-col
|
|
|
:span="12"
|
|
|
class="enterprise-honor"
|
|
|
id="one-table"
|
|
|
style="margin-right: 10px"
|
|
|
>
|
|
|
<div class="box-header" id="one-table-header">
|
|
|
<span class="garden"></span>
|
|
|
<span class="box-header-title">企业荣誉资质</span>
|
|
|
</div>
|
|
|
<div
|
|
|
class="two-tables"
|
|
|
:style="{ height: tabOneHeader + 'px' }"
|
|
|
v-if="enterpriseHonor.length > 0"
|
|
|
>
|
|
|
<div
|
|
|
class="table-items"
|
|
|
v-for="item in enterpriseHonor"
|
|
|
:key="item.id"
|
|
|
>
|
|
|
<div class="promoteProject-top">
|
|
|
<span class="span-one" @click="goProjectInfo(item)"
|
|
|
><dict-tag
|
|
|
:options="dict.type.project_small_type"
|
|
|
:value="item.projectSmallType"
|
|
|
/></span>
|
|
|
</div>
|
|
|
<div class="promoteProject-bottom">
|
|
|
<div class="promoteProject-bottom-left">
|
|
|
项目类别：
|
|
|
<span class="span-two"
|
|
|
><dict-tag
|
|
|
:options="dict.type.project_categories"
|
|
|
:value="item.projectBigType"
|
|
|
/></span>
|
|
|
</div>
|
|
|
<div class="promoteProject-bottom-right">
|
|
|
申报时间：
|
|
|
<span class="span-three">{{ formatYear(item) }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<el-empty
|
|
|
:style="{ height: tabOneHeader + 'px' }"
|
|
|
:image-size="160"
|
|
|
v-else
|
|
|
></el-empty>
|
|
|
</el-col>
|
|
|
<el-col :span="12" class="relevancy-project">
|
|
|
<div class="box-header">
|
|
|
<span class="garden"></span>
|
|
|
<span class="box-header-title">关联项目进展</span>
|
|
|
</div>
|
|
|
<div
|
|
|
class="promoteProject-box-wai-box"
|
|
|
:style="{ height: tableTwoHeight + 'px' }"
|
|
|
v-if="tableTwoData.length > 0"
|
|
|
>
|
|
|
<div
|
|
|
class="promoteProject-box-div"
|
|
|
v-for="(item, index) in tableTwoData"
|
|
|
:key="index"
|
|
|
>
|
|
|
<div class="promoteProject-top">
|
|
|
<span class="span-one" @click="goProjectInfo(item)"
|
|
|
>【<dict-tag
|
|
|
:options="dict.type.project_small_type"
|
|
|
:value="item.projectSmallType"
|
|
|
/>】</span
|
|
|
>
|
|
|
</div>
|
|
|
<div class="promoteProject-bottom">
|
|
|
<div class="promoteProject-bottom-left">
|
|
|
项目类别：
|
|
|
<span class="span-two"
|
|
|
><dict-tag
|
|
|
:options="dict.type.project_categories"
|
|
|
:value="item.projectBigType"
|
|
|
/></span>
|
|
|
</div>
|
|
|
<div class="promoteProject-bottom-right">
|
|
|
申报时间：
|
|
|
<span class="span-three">{{ formatYear(item) }}</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
class="promoteProject-position"
|
|
|
:class="
|
|
|
item.status == 0 ||
|
|
|
item.status == 1 ||
|
|
|
item.status == 2 ||
|
|
|
item.status == 3
|
|
|
? 'orange'
|
|
|
: item.status == 6
|
|
|
? 'green'
|
|
|
: item.status == 7 ||
|
|
|
item.status == 8 ||
|
|
|
item.status == 9 ||
|
|
|
item.status == 10
|
|
|
? 'red'
|
|
|
: ''
|
|
|
"
|
|
|
>
|
|
|
{{
|
|
|
item.status == 0
|
|
|
? "待填报"
|
|
|
: item.status == 1
|
|
|
? "初审中"
|
|
|
: item.status == 2
|
|
|
? "复审中"
|
|
|
: item.status == 3
|
|
|
? "终审中"
|
|
|
: item.status == 6
|
|
|
? "已填报"
|
|
|
: item.status == 7
|
|
|
? "复审不通过"
|
|
|
: item.status == 8
|
|
|
? "初审不通过"
|
|
|
: item.status == 9
|
|
|
? "终审不通过"
|
|
|
: item.status == 10
|
|
|
? "初审驳回"
|
|
|
: ""
|
|
|
}}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<el-empty
|
|
|
:style="{ height: tableTwoHeight + 'px' }"
|
|
|
:image-size="160"
|
|
|
v-else
|
|
|
></el-empty>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-row class="home-enterprise-bottom">
|
|
|
<el-col :span="24" class="capital-declare" id="table-two">
|
|
|
<div class="box-header" id="table-two-title">
|
|
|
<span class="garden"></span>
|
|
|
<span class="box-header-title">往年专项资金拨付情况</span>
|
|
|
</div>
|
|
|
<section>
|
|
|
<el-table
|
|
|
v-loading="loadingTab"
|
|
|
class="dataMap-two-table"
|
|
|
:data="tableData"
|
|
|
:height="tableTwoHeight"
|
|
|
border
|
|
|
:header-cell-style="{ background: '#E8F3FC' }"
|
|
|
>
|
|
|
<el-table-column
|
|
|
label="项目名称"
|
|
|
prop="projectName"
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<div
|
|
|
class="project-trace-table"
|
|
|
:class="
|
|
|
scope.row.projectName == '区级总部' ||
|
|
|
scope.row.projectName == '市级服务业领军'
|
|
|
? ''
|
|
|
: 'project-trace-table-gray'
|
|
|
"
|
|
|
@click="goProjectInfoLeft(scope.row)"
|
|
|
>
|
|
|
{{ scope.row.projectName }}
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="项目类别"
|
|
|
prop="projectType"
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<div v-if="scope.row.projectBigType">
|
|
|
<dict-tag
|
|
|
:options="dict.type.project_categories"
|
|
|
:value="scope.row.projectBigType"
|
|
|
/>
|
|
|
</div>
|
|
|
<span v-else>其他</span>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column
|
|
|
label="拨付金额(万元)"
|
|
|
prop="fundAmount"
|
|
|
align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
label="专项资金拨付时间"
|
|
|
prop="time"
|
|
|
align="center"
|
|
|
>
|
|
|
<template slot-scope="scope">
|
|
|
<div class="project-trace-table-number">
|
|
|
{{
|
|
|
scope.row.appropriationTime
|
|
|
? formatDate(scope.row.appropriationTime, 2)
|
|
|
: ""
|
|
|
}}
|
|
|
</div>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
<el-table-column label="企业名称" prop="qymc" align="center" />
|
|
|
<el-table-column
|
|
|
label="专项类型"
|
|
|
prop="specialType"
|
|
|
align="center"
|
|
|
/>
|
|
|
<el-table-column label="摘要" prop="summary" align="center" />
|
|
|
</el-table>
|
|
|
</section>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-col>
|
|
|
<el-col :span="8" class="home-main-right">
|
|
|
<el-row type="flex" class="main-two-row">
|
|
|
<el-col :span="24" class="work-main-left" style="height: 49.5%">
|
|
|
<div class="main-left">
|
|
|
<div class="left-header">
|
|
|
<div class="left-header-titleS">
|
|
|
<span class="dataCloudMap-birght"></span>
|
|
|
<div class="left-header-title">智能提醒</div>
|
|
|
</div>
|
|
|
<el-button
|
|
|
@click="enterjump"
|
|
|
type="text"
|
|
|
v-if="remindList.length > 0"
|
|
|
>>> 更多记录</el-button
|
|
|
>
|
|
|
</div>
|
|
|
<div class="left-main" v-if="remindList.length > 0">
|
|
|
<el-card
|
|
|
shadow="never"
|
|
|
v-for="(item, index) in remindList"
|
|
|
:key="index"
|
|
|
:class="item.isRead == 1 ? 'el-card-border' : ''"
|
|
|
>
|
|
|
<div class="warn-main">
|
|
|
<div class="warn-main-left" v-if="item.alertManner == 2">
|
|
|
<div class="warn-main-img">
|
|
|
<img src="@/assets/images/warn-green.png" alt="" />
|
|
|
</div>
|
|
|
<div class="warn-main-content">
|
|
|
<div class="content-title">
|
|
|
【{{ item.declarationName }}】【预计{{
|
|
|
item.daysAdvance
|
|
|
}}天后填报结束】
|
|
|
</div>
|
|
|
<div class="content-middle">
|
|
|
{{ item.alertContent }}
|
|
|
</div>
|
|
|
<!-- <div class="content-time">{{ item.alertTime }}</div> -->
|
|
|
<div class="tixing-duanxin">
|
|
|
<div class="content-time">{{ item.alertTime }}</div>
|
|
|
<div class="content-time content-time-two">
|
|
|
已发送短信
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
class="warn-main-left"
|
|
|
v-else-if="
|
|
|
item.alertManner == 1 &&
|
|
|
item.qymc &&
|
|
|
item.alertRecipients == 2
|
|
|
"
|
|
|
>
|
|
|
<div class="warn-main-img">
|
|
|
<img src="@/assets/images/warn-orange.png" alt="" />
|
|
|
</div>
|
|
|
<div class="warn-main-content">
|
|
|
<div class="content-title" style="display: flex">
|
|
|
【{{ item.qymc }}】<dict-tag
|
|
|
:options="dict.type.project_small_type"
|
|
|
:value="item.declarationName"
|
|
|
/>
|
|
|
</div>
|
|
|
<div class="content-middle">
|
|
|
{{ item.alertContent }}
|
|
|
</div>
|
|
|
<!-- <div class="content-time">{{ item.alertTime }}</div> -->
|
|
|
<div class="tixing-duanxin">
|
|
|
<div class="content-time">{{ item.alertTime }}</div>
|
|
|
<div class="content-time content-time-two">
|
|
|
已发送短信
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
class="warn-main-left"
|
|
|
v-else-if="item.alertManner == 1 && item.projectId"
|
|
|
>
|
|
|
<div class="warn-main-img">
|
|
|
<img src="@/assets/images/warn-orange.png" alt="" />
|
|
|
</div>
|
|
|
<div class="warn-main-content">
|
|
|
<div class="content-title">
|
|
|
【{{ item.declarationName }}】
|
|
|
</div>
|
|
|
<div class="content-middle">
|
|
|
{{ item.alertContent }}
|
|
|
</div>
|
|
|
<!-- <div class="content-time">{{ item.alertTime }}</div> -->
|
|
|
<div class="tixing-duanxin">
|
|
|
<div class="content-time">{{ item.alertTime }}</div>
|
|
|
<div class="content-time content-time-two">
|
|
|
已发送短信
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div
|
|
|
class="warn-main-left different-left"
|
|
|
v-else-if="item.alertManner == 1 && !item.projectId"
|
|
|
>
|
|
|
<div class="warn-main-img">
|
|
|
<img src="@/assets/images/warn-blue.png" alt="" />
|
|
|
</div>
|
|
|
<div class="warn-main-content">
|
|
|
<div class="content-title">{{ item.alertContent }}</div>
|
|
|
<!-- <div class="content-time">{{ item.alertTime }}</div> -->
|
|
|
<div class="tixing-duanxin">
|
|
|
<div class="content-time">{{ item.alertTime }}</div>
|
|
|
<div class="content-time content-time-two">
|
|
|
已发送短信
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="warn-main-right">
|
|
|
<div
|
|
|
class="warn-main-right-chakan"
|
|
|
@click="putMemo(item)"
|
|
|
>
|
|
|
查看
|
|
|
</div>
|
|
|
<div
|
|
|
class="warn-main-right-status"
|
|
|
:class="item.isRead == 1 ? 'status-unread' : ''"
|
|
|
>
|
|
|
{{ item.isRead == 1 ? "未读" : "已读" }}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
<el-empty class="left-main" :image-size="160" v-else></el-empty>
|
|
|
<!-- <div class="right-main" v-else>
|
|
|
<el-divider content-position="center">暂无</el-divider>
|
|
|
</div> -->
|
|
|
</div>
|
|
|
</el-col>
|
|
|
<el-col :span="24" class="work-main-right" style="height: 49.5%">
|
|
|
<div class="main-right" id="task-box">
|
|
|
<div class="right-header" id="task-header">
|
|
|
<div class="right-header-box">
|
|
|
<span class="dataCloudMap-birght"></span>
|
|
|
<div class="right-header-title">待办任务</div>
|
|
|
</div>
|
|
|
<el-button
|
|
|
@click="enterjumpTask"
|
|
|
type="text"
|
|
|
v-if="backlogArray.length > 0"
|
|
|
>>> 更多记录</el-button
|
|
|
>
|
|
|
</div>
|
|
|
<div
|
|
|
class="right-main"
|
|
|
:style="{ height: tabHeader + 'px' }"
|
|
|
v-if="backlogArray.length > 0"
|
|
|
v-loading="loading"
|
|
|
>
|
|
|
<div
|
|
|
class="main-items"
|
|
|
v-for="(item, index) in backlogArray"
|
|
|
:key="index"
|
|
|
:class="index % 2 == 0 ? '' : 'main-item'"
|
|
|
>
|
|
|
<div>{{ item.enterpriseDirectory }}</div>
|
|
|
<!-- <div>{{ item.enterpriseName }}</div> -->
|
|
|
<div>
|
|
|
{{
|
|
|
item.status == 0
|
|
|
? "待填报"
|
|
|
: item.status == 8
|
|
|
? "初审不通过"
|
|
|
: item.status == 10
|
|
|
? "初审退回修改"
|
|
|
: item.status == 7
|
|
|
? "复审不通过"
|
|
|
: item.status == 9
|
|
|
? "终审不通过"
|
|
|
: item.status == 5
|
|
|
? "终审通过"
|
|
|
: item.status == 1
|
|
|
? "初审中"
|
|
|
: item.status == 2
|
|
|
? "复审中"
|
|
|
: item.status == 3
|
|
|
? "终审中"
|
|
|
: item.status == 6
|
|
|
? "已填报"
|
|
|
: ""
|
|
|
}}
|
|
|
</div>
|
|
|
<!-- <div>审批【知识产权】材料</div> -->
|
|
|
<div
|
|
|
@click="MoreRecords(item.status)"
|
|
|
class="last_child_item"
|
|
|
:class="
|
|
|
item.status == 0
|
|
|
? 'tab-red'
|
|
|
: item.status == 10
|
|
|
? 'tab-red'
|
|
|
: 'last_child_item'
|
|
|
"
|
|
|
>
|
|
|
{{
|
|
|
item.status == 0
|
|
|
? "去填报"
|
|
|
: item.status == 10
|
|
|
? "去修改"
|
|
|
: "去查看"
|
|
|
}}
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<el-empty
|
|
|
:style="{ height: tabHeader + 'px' }"
|
|
|
:image-size="160"
|
|
|
v-else
|
|
|
></el-empty>
|
|
|
<!-- <div class="right-main" v-else>
|
|
|
<el-divider content-position="center">暂无</el-divider>
|
|
|
</div> -->
|
|
|
</div>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-dialog
|
|
|
title="详情"
|
|
|
:visible.sync="open"
|
|
|
width="400px"
|
|
|
append-to-body
|
|
|
:close-on-click-modal="false"
|
|
|
>
|
|
|
<div class="team-main">
|
|
|
<div>提醒时间:</div>
|
|
|
<div>{{ info.alertTime }}</div>
|
|
|
</div>
|
|
|
<div class="team-main">
|
|
|
<div>提醒内容:</div>
|
|
|
<div>{{ info.alertContent }}</div>
|
|
|
</div>
|
|
|
</el-dialog>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
import { listRecords } from "@/api/onlineDeclartion/records";
|
|
|
import {
|
|
|
chiefAll,
|
|
|
enterpriseAll,
|
|
|
changeIsRead,
|
|
|
} from "@/api/jin_ji_hu/intelligentReminder";
|
|
|
import { usualFund, enterpriseProject } from "@/api/jin_ji_hu/zijinbiao";
|
|
|
export default {
|
|
|
dicts: ["project_small_type", "project_categories"],
|
|
|
data() {
|
|
|
// 项目类别展示大类； 项目名称展示小类
|
|
|
return {
|
|
|
// 判断登陆用户是何身份⌈ 01 ： 企业 02 ： 政务 ⌋
|
|
|
// userType: this.$store.state.user.userType,
|
|
|
backlogArray: [],
|
|
|
queryParams: {
|
|
|
current: 1,
|
|
|
size: 10,
|
|
|
creditCode: this.$store.state.user.name,
|
|
|
orderChange: 1,
|
|
|
// statusStr: [0, 5, 7, 8, 9, 10],
|
|
|
},
|
|
|
// 是否显示弹出层
|
|
|
open: false,
|
|
|
fileList: [],
|
|
|
uploadList: [],
|
|
|
loading: false,
|
|
|
loadingTab: false,
|
|
|
remindList: [],
|
|
|
info: {},
|
|
|
tabHeader: 200,
|
|
|
tabOneHeader: 200,
|
|
|
tableTwoHeight: null,
|
|
|
tableData: [],
|
|
|
tableTwoData: [],
|
|
|
enterpriseHonor: [],
|
|
|
};
|
|
|
},
|
|
|
mounted() {
|
|
|
this.getListTwo();
|
|
|
this.cancalDebounce();
|
|
|
window.addEventListener("resize", this.cancalDebounce);
|
|
|
this.entRemind();
|
|
|
// 往年资金拨付比例
|
|
|
this.getUsualFund();
|
|
|
// 企业荣誉资质
|
|
|
this.getEnterpriseProjectOne();
|
|
|
// 关联项目进展
|
|
|
this.getEnterpriseProjectTwo();
|
|
|
},
|
|
|
beforeDestroy() {
|
|
|
window.removeEventListener("resize", this.cancalDebounce);
|
|
|
},
|
|
|
methods: {
|
|
|
// 企业荣誉资质
|
|
|
getEnterpriseProjectOne() {
|
|
|
enterpriseProject({ type: 1 }).then((res) => {
|
|
|
this.enterpriseHonor = res.data;
|
|
|
});
|
|
|
},
|
|
|
// 关联项目进展
|
|
|
getEnterpriseProjectTwo() {
|
|
|
enterpriseProject({ type: 2 }).then((res) => {
|
|
|
this.tableTwoData = res.data;
|
|
|
});
|
|
|
},
|
|
|
// 往年资金拨付比例
|
|
|
getUsualFund() {
|
|
|
usualFund().then((res) => {
|
|
|
this.tableData = res.data;
|
|
|
});
|
|
|
},
|
|
|
// 待填报
|
|
|
getListTwo() {
|
|
|
this.loading = true;
|
|
|
listRecords(this.queryParams).then((response) => {
|
|
|
this.backlogArray = response.data.records;
|
|
|
this.loading = false;
|
|
|
});
|
|
|
},
|
|
|
// 企业端智能提醒
|
|
|
entRemind() {
|
|
|
enterpriseAll({ current: 1, size: 20 }).then((res) => {
|
|
|
this.remindList = res.data.records;
|
|
|
});
|
|
|
},
|
|
|
// 企业荣誉资质/关联项目进展跳转
|
|
|
goProjectInfo(item) {
|
|
|
this.$router.push({
|
|
|
name: "projectInfo",
|
|
|
query: { userId: Number(item.id) },
|
|
|
});
|
|
|
},
|
|
|
// 往年专项资金申报
|
|
|
goProjectInfoLeft(item) {
|
|
|
// console.log(item,"item");
|
|
|
if (
|
|
|
item.projectName == "区级总部" ||
|
|
|
item.projectName == "市级服务业领军"
|
|
|
) {
|
|
|
if (item.projectId) {
|
|
|
this.$router.push({
|
|
|
name: "projectInfo",
|
|
|
query: { userId: Number(item.projectId) },
|
|
|
});
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
// 智能提醒跳转
|
|
|
enterjump() {
|
|
|
this.$router.push({
|
|
|
name: "WarningReminder",
|
|
|
});
|
|
|
},
|
|
|
// 智能提醒去查看并修改状态
|
|
|
putMemo(item) {
|
|
|
if (item.isRead == 1) {
|
|
|
changeIsRead({ id: item.id }).then((res) => {
|
|
|
this.entRemind();
|
|
|
});
|
|
|
}
|
|
|
if (item.projectId) {
|
|
|
this.$router.push({
|
|
|
name: "projectInfo",
|
|
|
query: { userId: Number(item.projectId) },
|
|
|
});
|
|
|
} else if (item.alertRecipients == 1 && item.alertManner == 2) {
|
|
|
this.$router.push({
|
|
|
name: "Online",
|
|
|
params: { statusChange: "0" },
|
|
|
});
|
|
|
} else if (item.alertManner == 1) {
|
|
|
this.open = true;
|
|
|
this.info = item;
|
|
|
}
|
|
|
},
|
|
|
// 更多记录待办任务
|
|
|
enterjumpTask() {
|
|
|
this.$router.push({
|
|
|
name: "AbnormalRemind",
|
|
|
});
|
|
|
},
|
|
|
// 更多记录
|
|
|
MoreRecords(status) {
|
|
|
if (status == 0 || status == 10) {
|
|
|
this.$router.push({
|
|
|
name: "Online",
|
|
|
params: { statusChange: "0" },
|
|
|
});
|
|
|
} else {
|
|
|
this.$router.push({
|
|
|
name: "Online",
|
|
|
params: { statusChange: "1" },
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
formatYear(time) {
|
|
|
if (time.fileJson) {
|
|
|
return this.parseTime(time.createTime, "{y}-{m}-{d}");
|
|
|
} else {
|
|
|
return time.projectYear;
|
|
|
}
|
|
|
},
|
|
|
formatDate(dateString, id) {
|
|
|
const year = dateString.slice(0, 4);
|
|
|
const month = dateString.slice(4, 6);
|
|
|
const day = dateString.slice(6, 8);
|
|
|
if (id == 1) {
|
|
|
return `${year}年${month}月${day}日`;
|
|
|
} else {
|
|
|
return `${year}-${month}-${day}`;
|
|
|
}
|
|
|
},
|
|
|
// 屏幕尺寸变化
|
|
|
cancalDebounce() {
|
|
|
const element = document.getElementById("task-box"); // 通过元素的 ID 获取元素
|
|
|
const header = document.getElementById("task-header"); // 通过元素的 ID 获取元素
|
|
|
const elementHeight = element.offsetHeight;
|
|
|
const headerHeight = header.offsetHeight;
|
|
|
this.tabHeader = elementHeight - headerHeight - 30;
|
|
|
|
|
|
const oneTable = document.getElementById("one-table"); // 通过元素的 ID 获取元素
|
|
|
const oneHeader = document.getElementById("one-table-header"); // 通过元素的 ID 获取元素
|
|
|
const oneTableHeight = oneTable.offsetHeight;
|
|
|
const oneHeaderHeight = oneHeader.offsetHeight;
|
|
|
this.tabOneHeader = oneTableHeight - oneHeaderHeight - 45;
|
|
|
|
|
|
const twoTable = document.getElementById("table-two"); // 通过元素的 ID 获取元素
|
|
|
const twoHeader = document.getElementById("table-two-title"); // 通过元素的 ID 获取元素
|
|
|
const twoTableHeight = twoTable.offsetHeight;
|
|
|
const twoHeaderHeight = twoHeader.offsetHeight;
|
|
|
this.tableTwoHeight = twoTableHeight - twoHeaderHeight - 45;
|
|
|
},
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped></style>
|
