Skip to content

R
risk-monitor
提交 e3e744b6 authored 作者: 张伊明's avatar 张伊明
浏览文件
操作

合并分支 'zym-dev' 到 'master'

style refactor 法案详情 查看合并请求 !133
上级 4cd6ce99 00c31bff
全部展开 显示空白字符变更
内嵌 并排
正在显示 包含 476 行增加 和 158 行删除
src/api/bill.js
浏览文件 @ e3e744b6
...@@ -20,7 +20,7 @@ export function getBillInfo(params) { ...@@ -20,7 +20,7 @@ export function getBillInfo(params) {
export function getBillPerson(params) { export function getBillPerson(params) {
return request({ return request({
method: 'GET', method: 'GET',
url: `/api/billInfoBean/person/${params.billId}`, url: `/bill/billInfoBean/person/${params.billId}`,
params, params,
}) })
} }
......
src/views/bill/billHome/ResourceLibrarySection.vue
浏览文件 @ e3e744b6
...@@ -2,13 +2,13 @@ ...@@ -2,13 +2,13 @@
<div class="resource-library-section"> <div class="resource-library-section">
<div class="home-content-footer-header"> <div class="home-content-footer-header">
<div class="btn-box"> <div class="btn-box">
<div class="btn" :class="{ btnActive: activeTabName === cate.name, disabled: index > 2 }" <div class="btn" :class="{ btnActive: activeTabName === cate.name, disabled: cate.active === false}"
v-for="(cate, index) in tabList" :key="index" @click="index <= 2 && handleClickTab(cate)"> v-for="(cate, index) in tabList" :key="index" @click="cate.active === true && handleClickTab(cate)">
{{ cate.name }} {{ cate.name }}
</div> </div>
</div> </div>
</div> </div>
<div class="home-content-footer-main"> <div class="home-content-footer-main" :class="{ 'committee-full-layout': activeTabName === '委员会' }">
<div class="left" v-if="['国会法案', '国会议员', '议员合作关系'].includes(activeTabName)"> <div class="left" v-if="['国会法案', '国会议员', '议员合作关系'].includes(activeTabName)">
<div class="select-box"> <div class="select-box">
<div class="select-box-header"> <div class="select-box-header">
...@@ -77,8 +77,8 @@ ...@@ -77,8 +77,8 @@
</div> </div>
</div> </div>
</div> </div>
<div class="right"> <div class="right" :class="{ 'right-full': activeTabName === '委员会' }">
<div class="right-header"> <div class="right-header" v-if="activeTabName !== '委员会'">
<div class="right-header-box"> <div class="right-header-box">
<el-select v-model="footerSelect1" placeholder="选择委员会" style="width: 240px" @change="handleFooterSelect1Change"> <el-select v-model="footerSelect1" placeholder="选择委员会" style="width: 240px" @change="handleFooterSelect1Change">
<el-option v-for="item in postOrgList" :key="item.departmentId" :label="item.departmentName" :value="item.departmentId" /> <el-option v-for="item in postOrgList" :key="item.departmentId" :label="item.departmentName" :value="item.departmentId" />
...@@ -177,6 +177,22 @@ ...@@ -177,6 +177,22 @@
<div class="member-info">关注领域：{{ item.focus || '-' }}</div> <div class="member-info">关注领域：{{ item.focus || '-' }}</div>
</div> </div>
</div> </div>
<div v-else-if="activeTabName === '委员会'" class="committee-list">
<div class="committee-card" v-for="item in committeeList" :key="item.id">
<div class="committee-info">
<img class="committee-avatar" :src="item.avatar || defaultAvatar" alt="committee-avatar" />
<div class="committee-text">
<div class="committee-name">{{ item.name }}</div>
<div class="committee-desc">{{ item.desc }}</div>
</div>
</div>
<div class="committee-bill-grid">
<div class="committee-bill-item" v-for="(bill, idx) in item.bills" :key="`${item.id}-bill-${idx}`">
{{ bill }}
</div>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -201,9 +217,9 @@ const props = defineProps({ ...@@ -201,9 +217,9 @@ const props = defineProps({
const tabList = ref([ const tabList = ref([
{ name: "国会法案", active: true }, { name: "国会法案", active: true },
{ name: "国会议员", active: false }, { name: "国会议员", active: true },
{ name: "议员合作关系", active: false }, { name: "议员合作关系", active: false },
{ name: "涉华委员会", active: false } { name: "委员会", active: true }
]); ]);
const activeTabName = ref("国会法案"); const activeTabName = ref("国会法案");
const handleClickTab = tab => { const handleClickTab = tab => {
...@@ -216,6 +232,10 @@ const handleClickTab = tab => { ...@@ -216,6 +232,10 @@ const handleClickTab = tab => {
if (tab.name === "国会法案") { if (tab.name === "国会法案") {
currentPage.value = 1; currentPage.value = 1;
handleGetBills(); handleGetBills();
return;
}
if (tab.name === "委员会") {
handleGetCommitteeList();
} }
}; };
...@@ -249,6 +269,30 @@ const memberTotal = ref(0); ...@@ -249,6 +269,30 @@ const memberTotal = ref(0);
const memberPageSize = ref(15); const memberPageSize = ref(15);
const memberCurrentPage = ref(1); const memberCurrentPage = ref(1);
const committeeList = ref([
{
id: "committee-1",
avatar: "",
name: "美中经济与安全审查委员会",
desc: "聚焦中美经贸、科技与国家安全议题，跟踪涉华政策与立法动态。",
bills: ["2025年涉华关键技术审查法案", "供应链安全与关键矿产保障法案", "对华投资限制与透明度加强法案", "联邦科研合作安全审查法案"]
},
{
id: "committee-2",
avatar: "",
name: "众议院外交事务委员会",
desc: "负责对外政策与国际关系立法，持续推进对华议题相关审议与听证。",
bills: ["印太战略资源配置法案", "对外援助合规与问责法案", "跨境数据安全与执法协作法案", "关键基础设施网络韧性法案"]
},
{
id: "committee-3",
avatar: "",
name: "参议院军事委员会",
desc: "围绕国防授权、军费及安全合作展开审查，关注涉华国防与技术议题。",
bills: ["国防授权法涉华条款（示例）", "先进半导体供应安全法案", "军民两用技术出口管制法案", "海外关键设施安全评估法案"]
}
]);
const bills = ref([]); const bills = ref([]);
const total = ref(0); const total = ref(0);
const pageSize = ref(4); const pageSize = ref(4);
...@@ -263,6 +307,20 @@ const getRiskTagClass = riskSignal => { ...@@ -263,6 +307,20 @@ const getRiskTagClass = riskSignal => {
return ""; return "";
}; };
// 获取委员会列表（占位）
const handleGetCommitteeList = async () => {
loading.value = true;
try {
// TODO: 接入委员会列表接口后，在此替换为真实请求并赋值 committeeList
// const res = await getCommitteeList(params);
// committeeList.value = res?.data?.content || [];
} catch (error) {
committeeList.value = [];
} finally {
loading.value = false;
}
};
const handleGetHylyList = async () => { const handleGetHylyList = async () => {
try { try {
const res = await getHylyList(); const res = await getHylyList();
...@@ -551,6 +609,17 @@ onMounted(() => { ...@@ -551,6 +609,17 @@ onMounted(() => {
justify-content: space-between; justify-content: space-between;
align-items: flex-start; align-items: flex-start;
&.committee-full-layout {
.right {
margin-left: 0;
width: 1600px;
.right-main {
height: auto;
}
}
}
.left { .left {
width: 300px; width: 300px;
padding-bottom: 33px; padding-bottom: 33px;
...@@ -662,6 +731,14 @@ onMounted(() => { ...@@ -662,6 +731,14 @@ onMounted(() => {
.right-main { .right-main {
height: 1264px; height: 1264px;
.member-grid,
.coop-list,
.committee-list {
display: grid;
column-gap: 16px;
row-gap: 16px;
}
.member-grid, .member-grid,
.coop-list { .coop-list {
display: grid; display: grid;
...@@ -834,6 +911,72 @@ onMounted(() => { ...@@ -834,6 +911,72 @@ onMounted(() => {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
.committee-list {
grid-template-columns: 1fr;
.committee-card {
padding: 20px 24px;
border-radius: 10px;
box-shadow: 0px 0px 20px 0px rgba(25, 69, 130, 0.1);
background: #fff;
}
.committee-info {
display: flex;
gap: 16px;
align-items: flex-start;
padding-bottom: 16px;
border-bottom: 1px solid #eaeced;
}
.committee-avatar {
width: 64px;
height: 64px;
border-radius: 50%;
object-fit: cover;
flex-shrink: 0;
}
.committee-name {
color: #3b414b;
font-family: "Microsoft YaHei";
font-size: 20px;
font-weight: 700;
line-height: 28px;
}
.committee-desc {
margin-top: 8px;
color: #5f656c;
font-family: "Microsoft YaHei";
font-size: 16px;
font-weight: 400;
line-height: 24px;
}
.committee-bill-grid {
margin-top: 16px;
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 12px;
}
.committee-bill-item {
height: 48px;
padding: 0 14px;
border-radius: 6px;
background: #f5f8fc;
color: #3b414b;
font-family: "Microsoft YaHei";
font-size: 15px;
font-weight: 400;
line-height: 48px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
.right-main-box { .right-main-box {
position: relative; position: relative;
width: 1280px; width: 1280px;
......
src/views/bill/billHome/utils/worldCloudChart.js
浏览文件 @ e3e744b6
import "echarts-wordcloud";
const getWordCloudChart = (data = []) => {
const getWordCloudChart = (data) => {
const option = { const option = {
grid: { grid: {
left: 0, left: 0,
......
src/views/bill/introdoction/SBillProgressTimeline.vue 0 → 100644
浏览文件 @ e3e744b6
<template>
<div class="container">
<div class="svg-timeline">
<svg :viewBox="`0 0 ${svgWidth} ${svgHeight}`" width="100%" height="100%">
<line
v-if="nodes.length > 0"
:x1="nodes[0].x - 100"
:y1="nodes[0].y"
:x2="nodes[0].x"
:y2="nodes[0].y"
stroke="#e8f2ff"
stroke-width="2"
marker-end="url(#arrow)"
/>
<path :d="arcPaths" fill="none" stroke="#e8f2ff" stroke-width="2" marker-end="url(#arrow)" />
<circle
v-for="(node, idx) in nodes"
:key="'circle' + idx"
:cx="node.x"
:cy="node.y"
r="4"
fill="#fff"
stroke="#1677ff"
stroke-width="3"
/>
<line
v-for="(node, idx) in nodes"
:key="'line' + idx"
:x1="node.x"
:y1="node.y + 4"
:x2="node.x"
:y2="node.y + verticalLineLength"
stroke="#1677ff"
:stroke-width="verticalLineWidth"
/>
<foreignObject
v-for="(node, idx) in nodes"
:key="'fo-' + idx"
:x="node.x + 15"
:y="node.y + 5"
:width="nodeGapX - 30"
height="100"
style="overflow: visible;"
>
<div class="node-content" xmlns="http://www.w3.org/1999/xhtml">
<div class="date">{{ node.formattedDate }}</div>
<el-tooltip
effect="dark"
:content="node.actionTitle"
popper-class="common-prompt-popper"
placement="top"
:show-after="500"
>
<div class="title">{{ node.actionTitle }}</div>
</el-tooltip>
<div class="votes" v-if="node.voteString">{{ node.voteString }}</div>
</div>
</foreignObject>
<text
v-if="startMonth && nodes.length > 0"
:x="nodes[0].x - 110"
:y="nodes[0].y + 5"
text-anchor="end"
fill="rgb(5, 95, 194)"
font-size="16"
font-weight="700"
>
{{ startMonth }}
</text>
<line
v-if="nodes.length > 0"
:x1="nodes[nodes.length - 1].x"
:y1="nodes[nodes.length - 1].y"
:x2="nodes[nodes.length - 1].row % 2 === 0 ? nodes[nodes.length - 1].x + 100 : nodes[nodes.length - 1].x - 100"
:y2="nodes[nodes.length - 1].y"
stroke="#e8f2ff"
stroke-width="2"
marker-end="url(#arrow)"
/>
<text
v-if="endMonth && nodes.length > 0"
:x="nodes[nodes.length - 1].row % 2 === 0 ? nodes[nodes.length - 1].x + 110 : nodes[nodes.length - 1].x - 110"
:y="nodes[nodes.length - 1].y + 5"
:text-anchor="nodes[nodes.length - 1].row % 2 === 0 ? 'start' : 'end'"
fill="rgb(5, 95, 194)"
font-size="16"
font-weight="700"
>
{{ endMonth }}
</text>
</svg>
</div>
</div>
</template>
<script>
export default {
name: "SBillProgressTimeline",
props: ["dataList"],
data() {
return {
maxPerRow: 5,
nodeGapX: 200,
nodeGapY: 180,
leftMargin: 150,
verticalLineLength: 80,
verticalLineWidth: 1
};
},
computed: {
startMonth() {
if (this.sortedDataList.length === 0) return '';
const date = new Date(this.sortedDataList[0].actionDate);
return `${date.getFullYear()}年${date.getMonth() + 1}月`;
},
endMonth() {
if (this.sortedDataList.length === 0) return '';
const date = new Date(this.sortedDataList[this.sortedDataList.length - 1].actionDate);
return `${date.getFullYear()}年${date.getMonth() + 1}月`;
},
sortedDataList() {
if (!this.dataList || !Array.isArray(this.dataList)) return [];
return [...this.dataList]
.filter(item => item && item.actionDate)
.sort((a, b) => new Date(a.actionDate) - new Date(b.actionDate));
},
nodes() {
return this.sortedDataList.map((item, idx) => {
const row = Math.floor(idx / this.maxPerRow);
const col = idx % this.maxPerRow;
let x, y;
if (row % 2 === 0) {
x = this.leftMargin + col * this.nodeGapX + 50;
} else {
x = this.leftMargin + (this.maxPerRow - 1 - col) * this.nodeGapX + 50;
}
y = 60 + row * this.nodeGapY;
let formattedDate = "";
if (item.actionDate) {
const dateObj = new Date(item.actionDate);
if (!isNaN(dateObj.getTime())) {
formattedDate = `${dateObj.getMonth() + 1}月${dateObj.getDate()}日`;
}
}
let voteString = "";
if (item.agreeVote !== null && item.agreeVote !== undefined && item.disagreeVote !== null && item.disagreeVote !== undefined) {
voteString = `${item.agreeVote}票赞成 : ${item.disagreeVote}票反对`;
}
return { ...item, x, y, row, formattedDate, voteString };
});
},
arcPaths() {
if (this.nodes.length < 2) return "";
let path = `M ${this.nodes[0].x} ${this.nodes[0].y}`;
for (let i = 1; i < this.nodes.length; i++) {
const prev = this.nodes[i - 1];
const curr = this.nodes[i];
const isTurnPoint = i % this.maxPerRow === 0;
if (isTurnPoint) {
const radius = 10 / 2;
if (prev.row % 2 === 0) {
path += ` L ${prev.x + radius} ${prev.y} A ${radius} ${radius} 0 0 1 ${curr.x - radius} ${curr.y} L ${curr.x} ${curr.y}`;
} else {
path += ` L ${prev.x - radius} ${prev.y} A ${radius} ${radius} 0 0 0 ${curr.x + radius} ${curr.y} L ${curr.x} ${curr.y}`;
}
} else {
path += ` L ${curr.x} ${curr.y}`;
}
}
return path;
},
svgWidth() {
return this.leftMargin + this.maxPerRow * this.nodeGapX + 50;
},
svgHeight() {
const listLength = (this.dataList && Array.isArray(this.dataList)) ? this.dataList.length : 0;
return Math.ceil(listLength / this.maxPerRow) * this.nodeGapY + 40;
}
}
};
</script>
<style lang="scss" scoped>
.container {
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.svg-timeline {
width: 100%;
.node-content {
font-family: Microsoft YaHei, sans-serif;
text-align: left;
padding-left: 4px;
.date {
color: rgb(5, 95, 194);
font-weight: 700;
font-size: 16px;
line-height: 22px;
margin-bottom: 0px;
margin-top: 6px;
}
.title {
color: rgb(59, 65, 75);
font-weight: 700;
font-size: 16px;
line-height: 22px;
margin-bottom: 0px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 100%;
display: block;
}
.votes {
color: rgb(95, 101, 108);
font-size: 16px;
font-weight: 400;
line-height: 22px;
}
}
}
</style>
<style>
.common-prompt-popper.el-popper {
padding: 8px 16px !important;
border-radius: 10px !important;
background-color: rgb(59, 65, 75) !important;
font-size: 16px !important;
font-weight: 400 !important;
font-family: "Microsoft YaHei" !important;
line-height: 30px !important;
color: #fff !important;
border: none !important;
max-width: 600px;
}
.common-prompt-popper.el-popper .el-popper__arrow::before {
background-color: rgb(59, 65, 75) !important;
border-color: rgb(59, 65, 75) !important;
}
</style>
src/views/bill/introdoction/assets/icons/arrow-down.svg 0 → 100644
浏览文件 @ e3e744b6
<svg viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="16.000000" height="16.000000" fill="none" customFrame="#000000">
<rect id="Icon图标/Line/double right" width="16.000000" height="16.000000" x="0.000000" y="0.000000" transform="matrix(0,1,-1,0,16,0)" />
<path id="形状" d="M5.519 5.19219L1.52994 0.0953125C1.48307 0.034375 1.40963 0 1.33307 0L0.125253 0C0.0205652 0 -0.0372473 0.120312 0.0268152 0.201562L4.17369 5.5L0.0268152 10.7984C-0.0372473 10.8797 0.0205652 11 0.125253 11L1.33307 11C1.40963 11 1.48307 10.9641 1.52994 10.9047L5.519 5.80937C5.66119 5.62656 5.66119 5.37344 5.519 5.19219ZM6.27994 0.0953125L10.269 5.19219C10.4112 5.37344 10.4112 5.62656 10.269 5.80937L6.27994 10.9047C6.23306 10.9641 6.15963 11 6.08307 11L4.87525 11C4.77056 11 4.71275 10.8797 4.77681 10.7984L8.92369 5.5L4.77681 0.201562C4.71275 0.120312 4.77056 0 4.87525 0L6.08307 0C6.15963 0 6.23306 0.034375 6.27994 0.0953125Z" fill="rgb(5,95,194)" fill-rule="evenodd" transform="matrix(0,1,-1,0,13.5,3.8125)" />
</svg>
src/views/bill/introdoction/index.vue
浏览文件 @ e3e744b6
...@@ -89,7 +89,7 @@ ...@@ -89,7 +89,7 @@
<div class="item-left">相关领域：</div> <div class="item-left">相关领域：</div>
<div class="item-right1"> <div class="item-right1">
<!-- <div class="right1-item" v-for="item in basicInfo.hylyList" :key="item">{{ item }}</div> --> <!-- <div class="right1-item" v-for="item in basicInfo.hylyList" :key="item">{{ item }}</div> -->
<AreaTag v-for="item, index in basicInfo.hylyList" :key="index" :tagName="item"></AreaTag> <AreaTag v-for="item, index in basicInfo.hylyList" :key="index" :tagName="item"/>
</div> </div>
</div> </div>
<div class="box1-right-item"> <div class="box1-right-item">
...@@ -144,9 +144,19 @@ ...@@ -144,9 +144,19 @@
</div> </div>
</div> --> </div> -->
<AnalysisBox title="法案进展" :showAllBtn="false"> <AnalysisBox title="法案进展" :showAllBtn="false">
<template #header-btn>
<div class="progress-header-btns">
<div class="btn" :class="{ btnActive: progressMode === 'latest' }" @click="handleSwitchProgressMode('latest')">
最新进展
</div>
<div class="btn" :class="{ btnActive: progressMode === 'early' }" @click="handleSwitchProgressMode('early')">
前期进程
</div>
</div>
</template>
<div class="box2-main"> <div class="box2-main">
<div class="box2-main-center"> <div class="box2-main-center">
<STimeline :dataList="timelineData" /> <STimeline :dataList="timelineData" :mode="progressMode" :maxCount="5" />
</div> </div>
</div> </div>
</AnalysisBox> </AnalysisBox>
...@@ -261,7 +271,7 @@ ...@@ -261,7 +271,7 @@
</div> </div>
<div class="info-box"> <div class="info-box">
<div class="info-left"> <div class="info-left">
<img :src="defaultAvatar" alt="" @click="handleClickAvatar(curPerson)" /> <img class="person-avatar" :src="curPerson.imageUrl || defaultAvatar" alt="" @click="handleClickAvatar(curPerson)" />
<div class="usr-icon1"> <div class="usr-icon1">
<img src="./assets/images/usr-icon1.png" alt="" /> <img src="./assets/images/usr-icon1.png" alt="" />
</div> </div>
...@@ -292,13 +302,8 @@ ...@@ -292,13 +302,8 @@
</div> </div>
<div class="right-main-box2" v-if="curPerson.tagList && curPerson.tagList.length"> <div class="right-main-box2" v-if="curPerson.tagList && curPerson.tagList.length">
<!-- <WordCloudMap :data="wordCloudData" :shape="circle" /> --> <!-- <WordCloudMap :data="wordCloudData" :shape="circle" /> -->
<div class="tag-box" :class="{ <div class="tag-box status"v-for="(tag, index) in curPerson.tagList" :key="index">
status0: index % 4 === 0, {{ tag }}
status1: index % 4 === 1,
status2: index % 4 === 2,
status3: index % 4 === 3
}" v-for="(tag, index) in curPerson.tagList" :key="index">
{{ tag.industryName }}
</div> </div>
</div> </div>
<div class="right-main-box3"> <div class="right-main-box3">
...@@ -329,88 +334,10 @@ ...@@ -329,88 +334,10 @@
</el-timeline-item> --> </el-timeline-item> -->
</el-timeline> </el-timeline>
</div> </div>
<div class="right-main-box3-footer">
<div class="btn-more" @click="handleClickMore2">
<img src="../assets/images/btn-more.png" alt="" />
</div>
</div>
</div> </div>
</div> </div>
</AnalysisBox> </AnalysisBox>
</div> </div>
<el-dialog v-model="isShowDialog" class="dialog-box" width="1280">
<div class="dialog-inner-box">
<div class="inner-left">
<div class="info-box">
<div class="info-top">
<img :src="defaultAvatar" alt="" />
<div class="usr-icon1">
<img src="./assets/images/usr-icon1.png" alt="" />
</div>
<div class="usr-icon2">
<img src="./assets/images/usr-icon2.png" alt="" />
</div>
</div>
<div class="info-footer">
<div class="info-right-title">{{ curPerson.name }}</div>
<div class="info-right-item">
<div class="item-left">英文名:</div>
<div class="item-right">{{ curPerson.ename }}</div>
</div>
<div class="info-right-item">
<div class="item-left">党派:</div>
<div class="item-right">{{ curPerson.dp }}</div>
</div>
<div class="info-right-item">
<div class="item-left">选区:</div>
<div class="item-right">{{ curPerson.xq }}</div>
</div>
<div class="info-right-item">
<div class="item-left">职位:</div>
<div class="item-right">{{ curPerson.zw }}</div>
</div>
</div>
</div>
<div class="tag-wrapper" v-if="curPerson.tagList && curPerson.tagList.length">
<div class="tag-box" :class="{
status0: index % 4 === 0,
status1: index % 4 === 1,
status2: index % 4 === 2,
status3: index % 4 === 3
}" v-for="(tag, index) in curPerson.tagList" :key="index">
{{ tag.industryName }}
</div>
</div>
<div class="more">更多议员 ></div>
</div>
<div class="inner-right">
<div class="btn-box">
<div class="btn" :class="{ btnActive: dialogBoxBtnActive === 0 }" @click="handleClcikDialogBoxBtn(0)">
新闻动态
</div>
<div class="btn" :class="{ btnActive: dialogBoxBtnActive === 1 }" @click="handleClcikDialogBoxBtn(1)">
人物履历
</div>
</div>
<div class="inner-right-main">
<el-timeline style="max-width: 840px">
<el-timeline-item :timestamp="item.newsDate" placement="top" v-for="(item, index) in curPerson.newsList"
:key="index">
<div class="timeline-content1">
<div class="text">
{{ item.newsContent }}
</div>
<div class="pic">
<img :src="defaultNew" alt="" />
</div>
</div>
</el-timeline-item>
</el-timeline>
</div>
</div>
</div>
</el-dialog>
</div> </div>
</template> </template>
...@@ -446,11 +373,10 @@ const handleClcikDialogBoxBtn = index => { ...@@ -446,11 +373,10 @@ const handleClcikDialogBoxBtn = index => {
}; };
const timelineData = ref([]); const timelineData = ref([]);
const progressMode = ref("latest");
const isShowDialog = ref(false); const handleSwitchProgressMode = mode => {
progressMode.value = mode;
const handleClickMore2 = () => {
isShowDialog.value = true;
}; };
// 获取基本信息 // 获取基本信息
...@@ -529,6 +455,32 @@ onMounted(() => { ...@@ -529,6 +455,32 @@ onMounted(() => {
height: 880px; height: 880px;
display: flex; display: flex;
.progress-header-btns {
display: flex;
gap: 8px;
.btn {
height: 28px;
padding: 0 12px;
box-sizing: border-box;
border: 1px solid var(--btn-plain-border-color);
border-radius: 4px;
background: var(--btn-plain-bg-color);
color: var(--btn-plain-text-color);
font-family: Microsoft YaHei;
font-size: 14px;
font-weight: 400;
line-height: 26px;
cursor: pointer;
}
.btnActive {
border: 1px solid var(--btn-active-border-color);
background: var(--btn-active-bg-color);
color: var(--btn-active-text-color);
}
}
.box-header { .box-header {
height: 56px; height: 56px;
display: flex; display: flex;
...@@ -913,17 +865,6 @@ onMounted(() => { ...@@ -913,17 +865,6 @@ onMounted(() => {
left: 50%; left: 50%;
transform: translateX(-50%); transform: translateX(-50%);
z-index: 99; z-index: 99;
.btn-more {
width: 108px;
height: 32px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
} }
} }
} }
...@@ -1007,6 +948,13 @@ onMounted(() => { ...@@ -1007,6 +948,13 @@ onMounted(() => {
.info-left { .info-left {
cursor: pointer; cursor: pointer;
.person-avatar {
width: 128px;
height: 128px;
border-radius: 50%;
object-fit: cover;
}
img { img {
width: 128px; width: 128px;
height: 128px; height: 128px;
...@@ -1117,28 +1065,10 @@ onMounted(() => { ...@@ -1117,28 +1065,10 @@ onMounted(() => {
display: inline-block; display: inline-block;
} }
.status0 { .status {
border: 1px solid rgba(217, 247, 190, 1); // border: 1px solid rgba(217, 247, 190, 1);
color: rgba(82, 196, 26, 1); color: rgb(5, 95, 194);
background: rgba(246, 255, 237, 1); background: rgb(231, 243, 255);
}
.status1 {
border: 1px solid rgba(186, 224, 255, 1);
color: rgba(22, 119, 255, 1);
background: rgba(230, 244, 255, 1);
}
.status2 {
border: 1px solid rgba(255, 241, 184, 1);
color: rgba(250, 173, 20, 1);
background: rgba(255, 251, 230, 1);
}
.status3 {
border: 1px solid rgba(255, 204, 199, 1);
color: rgba(255, 77, 79, 1);
background: rgba(255, 241, 240, 1);
} }
} }
...@@ -1156,37 +1086,19 @@ onMounted(() => { ...@@ -1156,37 +1086,19 @@ onMounted(() => {
.title { .title {
margin-left: 12px; margin-left: 12px;
height: 22px; height: 24px;
color: rgba(95, 101, 108, 1); color: rgb(59, 65, 75);
font-family: Microsoft YaHei; font-family: Microsoft YaHei;
font-size: 14px; font-size: 18px;
font-weight: 600; font-weight: 700;
line-height: 22px; line-height: 24px;
} }
} }
.right-main-box3-main { .right-main-box3-main {
margin-top: 18px; margin-top: 18px;
height: 412px;
overflow-y: auto; overflow-y: auto;
} }
.right-main-box3-footer {
margin-top: 1px;
display: flex;
justify-content: center;
.btn-more {
width: 108px;
height: 32px;
cursor: pointer;
img {
width: 100%;
height: 100%;
}
}
}
} }
} }
} }
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论