提交 cc23b8e6 authored 作者: huhuiqing's avatar huhuiqing

Merge branch 'master' of http://8.140.26.4:10003/caijian/risk-monitor into dev_hhq

......@@ -153,3 +153,16 @@ export function getBillInfoGlobal(params) {
params,
})
}
// 获取流程概要-根据法案ID获取动议流程概要
/**
* @param {id}
* @header token
*/
export function getBillDyqkSummary(params) {
return request({
method: 'GET',
url: `/api/billDeepDive/processSummary/${params.id}`,
params,
})
}
\ No newline at end of file
import request from "@/api/request.js";
// 获取人物全局信息
/**
* @param {personId}
* @header token
*/
export function getCharacterGlobalInfo(params) {
return request({
method: 'GET',
url: `/api/personHomepage/summaryInfo/${params.personId}`,
params,
})
}
// 获取人物基本信息
/**
* @param {personId}
* @header token
*/
export function getCharacterBasicInfo(params) {
return request({
method: 'GET',
url: `/api/personHomepage/basicInfo/${params.personId}`,
params,
})
}
// 科技人物详情,获取领域观点
/**
* @param {areaId}
* @header token
*/
export function getCharacterFieldView(params) {
return request({
method: 'GET',
url: `/api/personHomepage/areaOptions/${params.areaId}`,
params,
})
}
// 获取最新动态
/**
* @param {personId,cRelated,currentPage,pageSize}
* @header token
*/
export function getCharacterLatestDynamic(params) {
return request({
method: 'GET',
url: `/api/personHomepage/dynamics/${params.personId}`,
params,
})
}
// 获取人物成果报告
/**
* @param {personId,industryId,currentPage,pageSize,year}
* @header token
*/
export function getCharacterAchievementReport(params) {
return request({
method: 'GET',
url: `/api/personHomepage/findingsReport/${params.personId}/${params.year}`,
params,
})
}
// 获取人物历史提案
/**
* @param {personId,industryId,currentPage,pageSize}
* @header token
*/
export function getCharacterProposal(params) {
return request({
method: 'GET',
url: `/api/personHomepage/historyBill/${params.personId}`,
params,
})
}
// 获取履历
/**
* @param {personId}
* @header token
*/
export function getCharacterResume(params) {
return request({
method: 'GET',
url: `/api/personHomepage/jobResume/${params.personId}`,
params,
})
}
// 获取观点
/**
* @param {personId,year}
* @header token
*/
export function getCharacterView(params) {
return request({
method: 'GET',
url: `/api/personHomepage/option/${params.personId}/${params.year}`,
params,
})
}
// 国会议员,获取资金来源
/**
* @param {personId,year}
* @header token
*/
export function getCharacterFundSource(params) {
return request({
method: 'GET',
url: `/api/personHomepage/personFunds/${params.personId}/${params.year}`,
params,
})
}
// 获取人物关系
/**
* @param {personId}
* @header token
*/
export function getCharacterRelation(params) {
return request({
method: 'GET',
url: `/api/personHomepage/personRelation/${params.personId}`,
params,
})
}
// 获取相关实体
/**
* @param {personId,startTime}
* @header token
*/
export function getCharacterRelatedEntity(params) {
return request({
method: 'GET',
url: `/api/personHomepage/personRelation/${params.personId}/${params.startTime}`,
params,
})
}
\ No newline at end of file
......@@ -269,7 +269,7 @@
@click="handleClickToNewsDetail()"
>
<div class="left">
<img :src="news.newsImage || News1" alt="" />
<img :src="getProxyUrl(news.newsImage) || News1" alt="" referrerpolicy="no-referrer" @error="e => e.target.src = News1" />
</div>
<div class="right">
<div class="right-top">
......@@ -293,7 +293,7 @@
<div class="box4-main">
<div class="box4-main-item" v-for="(item, index) in messageList" :key="index">
<div class="left" @click="handleClcikToCharacter(item, index)">
<img :src="item.personImage" alt="" />
<img :src="getProxyUrl(item.personImage) || Message3" alt="" referrerpolicy="no-referrer" @error="e => e.target.src = Message3" />
</div>
<div class="right">
<div class="right-top">
......@@ -442,7 +442,7 @@
@click="handleClcikToCharacter(item, index)"
>
<div class="box8-main-item-left">
<img :src="item.img" alt="" referrerpolicy="no-referrer" class="left-img" />
<img :src="getProxyUrl(item.img)" alt="" referrerpolicy="no-referrer" class="left-img" />
<div class="left-icon1">
<img :src="item.dangpai" alt="" />
</div>
......@@ -670,10 +670,10 @@
<div class="item-left">{{ "最新动议:" }}</div>
<div class="item-right">{{ item.zxdy }}</div>
</div>
<div class="item">
<!-- <div class="item">
<div class="item-left">{{ "法案进展:" }}</div>
<div class="item-right2"></div>
</div>
</div> -->
</div>
</div>
<div class="right-footer">
......@@ -773,6 +773,19 @@ import { iteratee } from "lodash";
const searchBillText = ref("");
// 处理图片代理
const getProxyUrl = (url) => {
if (!url) return "";
const urlStr = String(url);
// 排除非 http 开头(相对路径)、已经是代理链接、或者是本地链接
if (!urlStr.startsWith('http') || urlStr.includes('images.weserv.nl') || urlStr.includes('localhost') || urlStr.includes('127.0.0.1')) {
return url;
}
// 移除协议头 http:// 或 https://
const cleanUrl = urlStr.replace(/^https?:\/\//i, '');
return `https://images.weserv.nl/?url=${encodeURIComponent(cleanUrl)}`;
};
const formatMessageTime = timeStr => {
if (!timeStr) return "";
// 假设格式为 2025-11-02T12:09:45
......
......@@ -15,7 +15,7 @@
<div class="main">
<div class="left">
<div class="top">
<div class="top-line" :style="{ width: 4 * 280 + 30 + 'px' }">
<div class="top-line" :style="{ width: lineWidth }">
<div class="top-line1"></div>
</div>
<div class="start">
......@@ -24,125 +24,37 @@
</div>
<div class="name">{{ "参议院" }}</div>
</div>
<div class="content-box">
<div class="item-box">
<div class="content-box" :style="senateBoxStyle">
<div class="item-box" v-for="(item, index) in senateList" :key="item.id" style="width: 280px; flex-shrink: 0;">
<div class="item-box-dot">
<img src="./assets/images/top-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "参议院修订框架" }} <span>(S.Con.Res.7)</span>
<div class="item-title" :title="item.actionTitle">
{{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
</div>
<div class="item-header-icon" @click="handleClickDetail(true)">
<div class="item-header-icon" @click="handleClickDetail(true, item)">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "债务上限提高至5万亿美元" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "削减支出降至400亿美元" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "新增2017年减税措施永久化" }}</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "米奇·麦康奈尔" }}</div>
</div>
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "迈克·约翰逊" }}</div>
</div>
</div>
<div class="item-time">
{{ "2025年4月" }}
</div>
</div>
<div class="item-box">
<div class="item-box-dot">
<img src="./assets/images/top-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "参议院程序性投票" }} <span>(S.Con.Res.7)</span>
</div>
<div class="item-header-icon">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info">
{{ "51赞成:49反对" }}
</div>
<div class="item-time">
{{ "2025年6月28日" }}
</div>
</div>
<div class="item-box">
<div class="item-box-dot">
<img src="./assets/images/top-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "众议院最终投票" }} <span>(S.Con.Res.7)</span>
</div>
<div class="item-header-icon">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info">
{{ "51赞成:50反对" }}
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "儿童税收抵免至2200美元(永久)" }}</div>
<div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
{{ (item.agreeVote || 0) + "赞成:" + (item.disagreeVote || 0) + "反对" }}
</div>
<div class="item-main-item">
<div class="item-main" v-if="item.fynrList && item.fynrList.length">
<div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
<div class="icon"></div>
<div class="text">{{ "阿拉斯加医保豁免" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "FEOC限制放宽供应链占比要求" }}</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "詹姆斯·戴维·万斯" }}</div>
<div class="text">{{ sub }}</div>
</div>
</div>
<div class="item-time">
{{ "2025年7月1日" }}
{{ item.actionDate }}
</div>
</div>
</div>
</div>
<div class="bottom">
<div class="bottom-line" :style="{ width: 4 * 280 + 30 + 'px' }">
<div class="bottom-line" :style="{ width: lineWidth }">
<div class="bottom-line1"></div>
</div>
<div class="start">
......@@ -152,194 +64,43 @@
<img src="./assets/images/logo2.png" alt="" />
</div>
</div>
<div class="content-box">
<div class="item-box">
<div class="content-box" :style="houseBoxStyle">
<div class="item-box" v-for="(item, index) in houseList" :key="item.id" style="width: 280px; flex-shrink: 0;">
<div class="item-time">
{{ "2025年2月" }}
{{ item.actionDate }}
</div>
<div class="item-box-dot">
<img src="./assets/images/bottom-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "众议院初始框架" }} <span>(S.Con.Res.7)</span>
<div class="item-title" :title="item.actionTitle">
{{ item.actionTitle }} <span v-if="item.versionId">({{ item.versionId }})</span>
</div>
<div class="item-header-icon">
<div class="item-header-icon" @click="handleClickDetail(true, item)">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "债务上限提高4万亿美元" }}</div>
<div class="item-info" v-if="item.agreeVote !== null || item.disagreeVote !== null">
{{ (item.agreeVote || 0) + "赞成:" + (item.disagreeVote || 0) + "反对" }}
</div>
<div class="item-main-item">
<div class="item-main" v-if="item.fynrList && item.fynrList.length">
<div class="item-main-item" v-for="(sub, subIndex) in item.fynrList" :key="subIndex">
<div class="icon"></div>
<div class="text">{{ "削减支出200亿美元" }}</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "迈克·约翰逊" }}</div>
</div>
<div class="text">{{ sub }}</div>
</div>
</div>
<div class="item-box">
<div class="item-time">
{{ "2025年5月22日" }}
</div>
<div class="item-box-dot">
<img src="./assets/images/bottom-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "众议院首次通过" }} <span>(H.R.1)</span>
</div>
<div class="item-header-icon">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info">
{{ "215赞成:214反对" }}
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "减税延至2029年(非永久)" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">
{{ "严格限制外国敏感实体(FEOC)参与补贴" }}
</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "儿童税收抵免临时提至2500美元" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "储能税收抵免2028年硬性截止" }}</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "迈克·约翰逊" }}</div>
</div>
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "贾森·史密斯" }}</div>
</div>
</div>
</div>
<div class="item-box">
<div class="item-time">
{{ "2025年7月2日" }}
</div>
<div class="item-box-dot">
<img src="./assets/images/bottom-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "众议院二次审议" }} <span>(H.R.1)</span>
</div>
<div class="item-header-icon">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info">
{{ "219赞成:213反对" }}
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">{{ "儿童税收抵免临时提至2500美元" }}</div>
</div>
<div class="item-main-item">
<div class="icon"></div>
<div class="text">
{{ "严格限制外国敏感实体(FEOC)参与补贴" }}
</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "詹姆斯·布莱尔" }}</div>
</div>
</div>
</div>
<div class="item-box">
<div class="item-time">
{{ "2025年7月2日" }}
</div>
<div class="item-box-dot">
<img src="./assets/images/bottom-line-dot.png" alt="" />
</div>
<div class="item-header">
<div class="item-title">
{{ "众议院最终表决" }} <span>(S.Con.Res.7)</span>
</div>
<div class="item-header-icon">
<img src="./assets/images/item-header-icon.png" alt="" />
</div>
</div>
<div class="item-info">
{{ "218赞成:214反对" }}
</div>
<div class="item-main">
<div class="item-main-item">
<div class="icon"></div>
<div class="text">
{{ "2027年起对进口小额包裹征收30%关税或25美元/件" }}
</div>
</div>
</div>
<div class="item-footer">
<div class="item-footer-box">
<div class="icon">
<div class="inner-icon">
<img src="./assets/images/user-inner-icon.png" alt="" />
</div>
<img src="./assets/images/user-icon.png" alt="" />
</div>
<div class="text">{{ "詹姆斯·布莱尔" }}</div>
<div class="right" :style="{ left: rightPos }">
<div class="junction-dot">
<div class="inner-dot"></div>
</div>
</div>
</div>
</div>
</div>
<div class="right" :style="{ left: 4 * 280 + 222 + 'px' }">
<div class="right-line"></div>
<div class="right-info">
{{ "2025年7月4日总统签署生效" }}
</div>
</div>
</div>
</div>
<div class="footer">
<!-- <div class="footer">
<div class="footer-left">
<img src="./assets/icons/right-icon1.png" alt="" />
</div>
......@@ -349,21 +110,34 @@
<div class="footer-right">
<img src="./assets/icons/arrow-right.png" alt="" />
</div>
</div>
<div class="dialog-wrapper" v-if="isShowDetailDialog">
<div class="dialog-box1">
</div> -->
<div class="dialog-wrapper" v-if="isShowDetailDialog" ref="dialogRef">
<div class="dialog-box1" @mousedown="handleMouseDown">
<div class="icon">
<img src="./assets/images/logo2.png" alt="" />
<img v-if="currentDetailItem.orgName === '参议院'" src="./assets/images/logo1.png" alt="" />
<img v-else src="./assets/images/logo2.png" alt="" />
</div>
<div class="title">
2025年5月22日众议院首次通过<span>(H.R.1)</span>
<div class="date">{{ currentDetailItem.actionDate }}</div>
<div class="text">
{{ currentDetailItem.actionTitle }}
</div>
</div>
<div class="close" @click="handleClickDetail(false)">
<img src="./assets/images/close.png" alt="" />
</div>
</div>
<div class="dialog-box2"></div>
<div class="dialog-box3">
<div class="dialog-box2" v-if="currentDetailItem.agreeVote !== null || currentDetailItem.disagreeVote !== null">
<div class="vote-bar">
<div class="agree-bar" :style="{ flex: currentDetailItem.agreeVote || 1 }"></div>
<div class="disagree-bar" :style="{ flex: currentDetailItem.disagreeVote || 1 }"></div>
</div>
<div class="vote-text">
<div class="agree-text">{{ (currentDetailItem.agreeVote || 0) + "赞成" }}</div>
<div class="disagree-text">{{ (currentDetailItem.disagreeVote || 0) + "反对" }}</div>
</div>
</div>
<!-- <div class="dialog-box3">
<div class="box3-left">
<img src="./assets/icons/right-icon1.png" alt="" />
</div>
......@@ -373,7 +147,8 @@
<div class="box3-right">
<img src="./assets/icons/arrow-right.png" alt="" />
</div>
</div>
</div> -->
<template v-if="currentDetailItem.fynrList && currentDetailItem.fynrList.length">
<div class="dialog-box4">
<div class="box4-left">
<div class="icon">
......@@ -386,34 +161,13 @@
</div>
</div>
<div class="dialog-box5">
<div class="box5-item">
<div class="icon"></div>
<div class="text">{{ "减税延至2029年(非永久)" }}</div>
</div>
<div class="box5-item">
<div class="icon"></div>
<div class="text">{{ "严格限制外国敏感实体(FEOC)参与补贴" }}</div>
</div>
<div class="box5-item">
<div class="icon"></div>
<div class="text">{{ "儿童税收抵免 ​2028年前提至2500美元​" }}</div>
</div>
<div class="box5-item">
<div class="box5-item" v-for="(sub, subIndex) in currentDetailItem.fynrList" :key="subIndex">
<div class="icon"></div>
<div class="text">{{ "小费/加班费免税 ​无上限" }}</div>
<div class="text">{{ sub }}</div>
</div>
<div class="box5-item">
<div class="icon"></div>
<div class="text">
{{ "储能项目须 ​2028年底前投入使用​ 才享税收抵免" }}
</div>
</div>
<div class="box5-item">
<div class="icon"></div>
<div class="text">{{ "取消电动汽车补贴(2025年底生效)" }}</div>
</div>
</div>
<div class="dialog-box6">
</template>
<!-- <div class="dialog-box6">
<div class="icon">
<img src="./assets/images/dialog-box6-icon.png" alt="" />
</div>
......@@ -450,7 +204,7 @@
</div>
</div>
</div>
</div>
</div> -->
</div>
<div class="dialog-wrapper1" v-if="isShowCompareDialog">
<div class="dialog-header">
......@@ -690,7 +444,84 @@
</template>
<script setup>
import { ref } from "vue";
import { ref, onMounted, computed } from "vue";
import { getBillDyqkSummary } from "@/api/bill";
// 获取法案流程
const actionList = ref([]);
const getBillDyqkSummaryList = async () => {
try {
const billId = window.sessionStorage.getItem("billId");
if (!billId) return; // 防止 id 为空
const params = {
id: billId
};
const res = await getBillDyqkSummary(params);
if (res && res.code === 200) {
console.log("法案流程概要:", res);
// 确保赋值的是数组,如果 data 为 null 则给空数组
actionList.value = Array.isArray(res.data) ? res.data : [];
} else {
actionList.value = [];
}
} catch (error) {
console.log(error);
actionList.value = []; // 出错时也重置为空数组
}
};
// 总统签署节点
const presidentAction = computed(() => {
return actionList.value.find(item => item.actionTitle && item.actionTitle.includes("呈递给总统")) || null;
});
// 参议院列表
const senateList = computed(() => {
return actionList.value
.filter(item => item.orgName === "参议院" && (!presidentAction.value || item.id !== presidentAction.value.id))
.sort((a, b) => new Date(a.actionDate) - new Date(b.actionDate));
});
// 众议院列表
const houseList = computed(() => {
return actionList.value
.filter(item => item.orgName === "众议院" && (!presidentAction.value || item.id !== presidentAction.value.id))
.sort((a, b) => new Date(a.actionDate) - new Date(b.actionDate));
});
// 计算最大线条宽度数值
const maxLineWidth = computed(() => {
const senateWidth = 254 + senateList.value.length * 280;
const houseWidth = 150 + houseList.value.length * 280;
return Math.max(1100, senateWidth, houseWidth);
});
// 绑定给线条的样式
const lineWidth = computed(() => {
return maxLineWidth.value + 'px';
});
// 参议院容器宽度:线条总长 + 线条左偏移(110) - 容器左偏移(254)
const senateBoxStyle = computed(() => {
return {
width: (maxLineWidth.value + 110 - 254) + 'px',
justifyContent: 'space-between'
};
});
// 众议院容器宽度:线条总长 + 线条左偏移(110) - 容器左偏移(150)
const houseBoxStyle = computed(() => {
return {
width: (maxLineWidth.value + 110 - 150) + 'px',
justifyContent: 'space-between'
};
});
const rightPos = computed(() => {
// 右侧节点位置 = 线条宽度 + 斜线水平投影长度(约90px)
return (maxLineWidth.value + 90) + 'px';
});
const isShowCompareDialog = ref(false)
const handleSwitchCompareDialog = (isShow) => {
......@@ -722,10 +553,52 @@ const curVersionList = ref([
]);
const isShowDetailDialog = ref(false);
const currentDetailItem = ref({});
const handleClickDetail = (isShow) => {
const handleClickDetail = (isShow, item = {}) => {
isShowDetailDialog.value = isShow;
if (isShow) {
currentDetailItem.value = item;
}
};
const dialogRef = ref(null);
const handleMouseDown = (e) => {
const dialog = dialogRef.value;
if (!dialog) return;
const startX = e.clientX;
const startY = e.clientY;
// 获取当前的 offsetLeft 和 offsetTop
// 注意:如果是第一次拖动,且原本是 right 定位的,offsetLeft 也是可以直接获取到的
const initialLeft = dialog.offsetLeft;
const initialTop = dialog.offsetTop;
const move = (moveEvent) => {
const deltaX = moveEvent.clientX - startX;
const deltaY = moveEvent.clientY - startY;
// 清除 right 定位,改用 left
dialog.style.right = 'auto';
dialog.style.left = `${initialLeft + deltaX}px`;
dialog.style.top = `${initialTop + deltaY}px`;
};
const stop = () => {
document.removeEventListener('mousemove', move);
document.removeEventListener('mouseup', stop);
};
document.addEventListener('mousemove', move);
document.addEventListener('mouseup', stop);
};
// 挂载阶段调用
onMounted(() => {
getBillDyqkSummaryList();
});
</script>
<style lang="scss" scoped>
......@@ -779,6 +652,7 @@ const handleClickDetail = (isShow) => {
margin-left: 59px;
height: 680px;
padding: 3px 10px;
overflow: hidden;
.left {
height: 680px;
position: relative;
......@@ -799,13 +673,13 @@ const handleClickDetail = (isShow) => {
background: url("./assets/images/top-line-icon.png");
.top-line1 {
position: absolute;
right: -120px;
left: 100%;
top: 0;
height: 8px;
width: 120px;
width: 127px;
background: url("./assets/images/top-line-icon.png");
transform: rotate(45deg);
transform-origin: top left;
transform-origin: 0 0;
}
}
.start {
......@@ -879,17 +753,19 @@ const handleClickDetail = (isShow) => {
}
.item-header {
display: flex;
align-items: center;
height: 30px;
border-left: 1px solid rgb(20, 89, 187);
padding: 0 10px;
.item-title {
height: 30px;
line-height: 30px;
color: rgba(59, 65, 75, 1);
line-height: 26px;
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-size: 20px;
font-weight: 700;
line-height: 30px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
span {
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
......@@ -899,10 +775,11 @@ const handleClickDetail = (isShow) => {
}
}
.item-header-icon {
margin-top: 7px;
margin-left: 5px;
width: 16px;
height: 16px;
cursor: pointer;
flex-shrink: 0;
img {
width: 100%;
height: 100%;
......@@ -910,35 +787,35 @@ const handleClickDetail = (isShow) => {
}
}
.item-info {
height: 30px;
border-left: 1px solid rgb(20, 89, 187);
padding: 0 10px;
color: rgba(132, 136, 142, 1);
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
line-height: 24px;
}
.item-main {
border-left: 1px solid rgb(20, 89, 187);
padding: 5px 10px;
.item-main-item {
display: flex;
height: 30px;
align-items: baseline;
width: 269px;
.icon {
margin: 12px;
margin: 9px 12px;
width: 6px;
height: 6px;
border-radius: 3px;
background: #84888e;
}
.text {
height: 30px;
color: rgba(132, 136, 142, 1);
width: 240px;
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
line-height: 24px;
}
}
}
......@@ -1005,13 +882,13 @@ const handleClickDetail = (isShow) => {
background: url("./assets/images/bottom-line-icon.png");
.bottom-line1 {
position: absolute;
right: -120px;
left: 100%;
top: 0;
height: 8px;
width: 120px;
width: 127px;
background: url("./assets/images/bottom-line-icon.png");
transform: rotate(-45deg);
transform-origin: top left;
transform-origin: 0 100%;
}
}
.start {
......@@ -1041,8 +918,9 @@ const handleClickDetail = (isShow) => {
padding: 1px 8px;
box-sizing: border-box;
border-radius: 4px;
background: rgba(230, 244, 255, 1);
color: rgba(22, 119, 255, 1);
border: 1px solid rgba(255, 229, 143, 1);
background: rgba(255, 251, 230, 1);
color: rgba(250, 173, 20, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
......@@ -1083,17 +961,19 @@ const handleClickDetail = (isShow) => {
}
.item-header {
display: flex;
align-items: center;
height: 30px;
border-left: 1px solid rgba(255, 172, 77, 1);
padding: 5px 10px;
.item-title {
height: 30px;
line-height: 30px;
color: rgba(59, 65, 75, 1);
line-height: 26px;
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-size: 20px;
font-weight: 700;
line-height: 30px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
span {
color: rgba(132, 136, 142, 1);
font-family: Microsoft YaHei;
......@@ -1103,11 +983,11 @@ const handleClickDetail = (isShow) => {
}
}
.item-header-icon {
margin-top: 7px;
margin-left: 5px;
width: 16px;
height: 16px;
cursor: pointer;
flex-shrink: 0;
img {
width: 100%;
height: 100%;
......@@ -1115,24 +995,23 @@ const handleClickDetail = (isShow) => {
}
}
.item-info {
height: 30px;
border-left: 1px solid rgba(255, 172, 77, 1);
padding: 0 10px;
color: rgba(132, 136, 142, 1);
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
line-height: 24px;
}
.item-main {
border-left: 1px solid rgba(255, 172, 77, 1);
padding: 5px 10px;
.item-main-item {
display: flex;
// height: 30px;
align-items: baseline;
width: 269px;
.icon {
margin: 12px;
margin: 9px 12px;
width: 6px;
height: 6px;
border-radius: 3px;
......@@ -1140,12 +1019,11 @@ const handleClickDetail = (isShow) => {
}
.text {
width: 240px;
// height: 30px;
color: rgba(132, 136, 142, 1);
color: rgb(59, 65, 75);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 400;
line-height: 30px;
line-height: 24px;
}
}
}
......@@ -1199,31 +1077,32 @@ const handleClickDetail = (isShow) => {
.right {
position: absolute;
left: 1295px;
top: calc(50% - 50px);
top: 370px;
margin-left: 90px;
display: flex;
align-items: center;
.junction-dot {
width: 24px;
height: 24px;
border-radius: 50%;
background: #5f656c;
display: flex;
justify-content: center;
align-items: center;
z-index: 10;
margin-right: -4px; // 稍微重叠
.inner-dot {
width: 10px;
height: 10px;
border-radius: 50%;
background: #fff;
}
}
.right-line {
width: 140px;
width: 70px;
height: 8px;
background: url("./assets/images/right-line-icon.png");
}
.right-info {
height: 60px;
width: 159px;
box-sizing: border-box;
border: 1px solid rgba(95, 101, 108, 1);
border-radius: 4px;
background: rgba(255, 255, 255, 1);
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 22px;
text-align: center;
box-sizing: border-box;
padding: 8px 20px;
}
}
}
}
......@@ -1277,41 +1156,57 @@ const handleClickDetail = (isShow) => {
top: 56px;
right: 17px;
width: 480px;
height: 692px;
// height: 692px; // 去掉固定高度,由内容撑开
padding-bottom: 20px;
box-sizing: border-box;
border: 1px solid rgba(230, 231, 232, 1);
border-radius: 4px;
background: rgba(255, 255, 255, 1);
z-index: 10000; // 提高层级,超过节点的 9999
box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.15); // 加个阴影更好看
.dialog-box1 {
display: flex;
height: 65px;
min-height: 90px; // 改为最小高度,允许撑开
height: auto; // 高度自动
padding-bottom: 15px; // 底部留白
position: relative;
border-bottom: 1px solid rgba(240, 242, 244, 1);
cursor: move; // 鼠标变为移动手势
.icon {
width: 48px;
height: 48px;
margin-left: 18px;
margin-top: 17px;
margin-top: 20px;
img {
width: 100%;
height: 100%;
}
}
.title {
margin-top: 20px;
margin-left: 16px;
width: 350px;
.date {
height: 22px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 22px;
}
.text {
margin-top: 4px;
color: rgba(59, 65, 75, 1);
font-family: Microsoft YaHei;
font-size: 16px;
font-weight: 700;
line-height: 22px;
margin-top: 19px;
margin-left: 16px;
// width: 118px;
width: 158px;
span {
color: rgba(95, 101, 108, 1);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 22px;
}
}
}
.close {
......@@ -1320,6 +1215,7 @@ const handleClickDetail = (isShow) => {
right: 15px;
width: 16px;
height: 16px;
cursor: pointer;
img {
width: 100%;
height: 100%;
......@@ -1328,7 +1224,36 @@ const handleClickDetail = (isShow) => {
}
.dialog-box2 {
height: 59px;
border-bottom: 1px solid rgba(240, 242, 244, 1);
padding: 0 23px;
// border-bottom: 1px solid rgba(240, 242, 244, 1);
.vote-bar {
display: flex;
height: 4px;
width: 100%;
margin-top: 20px;
border-radius: 2px;
overflow: hidden;
.agree-bar {
background: #52C41A;
margin-right: 2px;
}
.disagree-bar {
background: #F5222D;
}
}
.vote-text {
display: flex;
justify-content: space-between;
margin-top: 8px;
.agree-text {
color: #52C41A;
font-size: 14px;
}
.disagree-text {
color: #F5222D;
font-size: 14px;
}
}
}
.dialog-box3 {
width: 438px;
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论