update:优化规则限制详情页面并对接后端接口

src/api/ruleRestriction/index.js

@@ -126,17 +126,42 @@ export function getSanctionOverview(params) {
   })
 }
 
+// 规则限制-背景分析
+export function getBackGround(params) {
+  return request({
+    method: 'GET',
+    url: `/api/ruleLimitInfo/getBackGround/${params}`
+  })
+}
 
-// 实体清单-制裁概况-获取发布机构机构动态
-/**
- * @param {Object} data
- * @param {string} data.orgId
- * @header token
- */
-export function getPublishOrgInfo(data) {
+// 规则限制-限制条款
+export function getLimitClause(params) {
   return request({
-    method: 'POST',
-    url: `/api/organization/relate/news`,
-    data,
+    method: 'GET',
+    url: `/api/ruleLimitInfo/getLimitClause/${params}`
   })
-}
\ No newline at end of file
+}
+
+// 规则限制-相关举措
+export function getRelevantMeasures(params) {
+  return request({
+    method: 'GET',
+    url: `/api/ruleLimitInfo/getRelevantMeasures/${params}`
+  })
+}
+
+
+
+// // 实体清单-制裁概况-获取发布机构机构动态
+// /**
+//  * @param {Object} data
+//  * @param {string} data.orgId
+//  * @header token
+//  */
+// export function getPublishOrgInfo(data) {
+//   return request({
+//     method: 'POST',
+//     url: `/api/organization/relate/news`,
+//     data,
+//   })
+// }
\ No newline at end of file

src/views/ruleRestriction/components/resLib/index.vue

@@ -51,7 +51,7 @@
 								<div class="title">{{ item.RULENAME }}</div>
 								<div class="content">{{ item.RULEINTRODUCTION }}</div>
 								<div class="domain">
-									<div v-for="(domain, i) in item.ruleAreas" :key="i" class="domain-item">{{ domain }}</div>
+									<div v-for="(domain, i) in item.ruleAreas" :key="i" class="domain-item" :class="getClassName(domain)">{{ domain }}</div>
 								</div>
 								<div
 									class="type"
@@ -132,7 +132,7 @@
 										<div
 											v-for="(ele, index) in item.area"
 											:key="index"
-											:class="{ type1: ele !== '', type3: ele === '' }"
+											:class="[{ type1: ele !== '', type3: ele === '' }, getClassName(ele)]"
 										>{{ ele }}</div>
 									</div>
 								</div>
@@ -470,6 +470,41 @@ const getDate = (item) => {
   }
 }
 
+const getClassName = (type) => {
+  let className = ''
+
+  switch (type) {
+    case '人工智能':
+      className = 'ai'
+      break
+    case '新材料':
+      className = 'material'
+      break
+    case '量子科技':
+      className = 'technology'
+      break
+    case '生物科技':
+      className = 'organism'
+      break
+    case '航空航天':
+      className = 'aerospace'
+      break
+    case '能源':
+      className = 'energy'
+      break
+    case '集成电路':
+      className = 'integrated'
+      break
+    case '':
+      className = 'none-class'
+      break
+    default:
+      className = 'other'
+  }
+
+  return className
+}
+
 onMounted(async () => {
   await getRuleLimitListApi()
   try {
@@ -506,6 +541,62 @@ const handlePageChangeACTA = p => {
 	width: 1600px;
 	height: 1565px;
 	position: relative;
+
+	// 领域样式
+	// 人工智能
+	.ai {
+		border: 1px solid rgba(255, 163, 158, 1);
+		background: rgba(255, 241, 240, 1);
+		color: rgba(245, 34, 45, 1);
+	}
+	// 新材料
+	.material {
+		border: 1px solid rgba(135, 232, 222, 1);
+		background: rgba(230, 255, 251, 1);
+		color: rgba(19, 168, 168, 1);
+	}
+	// 量子科技
+	.technology {
+		border: 1px solid rgba(211, 173, 247, 1);
+		background: rgba(249, 240, 255, 1);
+		color: rgba(114, 46, 209, 1);
+	}
+	// 生物科技
+	.organism {
+		border: 1px solid rgba(145, 202, 255, 1);
+		background: rgba(230, 244, 255, 1);
+		color: rgba(22, 119, 255, 1);
+	}
+	// 航空航天
+	.aerospace {
+		border: 1px solid rgba(173, 198, 255, 1);
+		background: rgba(240, 245, 255, 1);
+		color: rgba(22, 119, 255, 1);
+	}
+	// 能源
+	.energy {
+		border: 1px solid rgba(217, 247, 190, 1);
+		background: rgba(246, 255, 237, 1);
+		color: rgba(56, 158, 13, 1);
+	}
+	// 集成电路
+	.integrated {
+		border: 1px solid rgba(186, 224, 255, 1);
+		background: rgba(230, 244, 255, 1);
+		color: rgba(9, 88, 217, 1);
+	}
+	// 其他
+	.other {
+		border: 1px solid rgba(186, 224, 255, 1);
+		background: rgba(230, 244, 255, 1);
+		color: rgba(9, 88, 217, 1);
+	}
+
+	// 无类型
+	.none-class {
+		background: transparent;
+		border: none;
+	}
 	.nav {
 		width: 332px;
 		height: 42px;
@@ -727,9 +818,9 @@ const handlePageChangeACTA = p => {
 								cursor: pointer;
 							}
 							.type {
-                position: absolute;
-                top: 0;
-                right: 0;
+								position: absolute;
+								top: 0;
+								right: 0;
 								padding: 2px 8px;
 								border-radius: 20px;
 								font-size: 16px;
@@ -760,8 +851,8 @@ const handlePageChangeACTA = p => {
 									font-family: "Microsoft YaHei";
 									line-height: 20px;
 									margin-right: 8px;
-									color: rgb(5, 95, 194);
-									background-color: rgba(231, 243, 255, 1);
+									// color: rgb(5, 95, 194);
+									// background-color: rgba(231, 243, 255, 1);
 								}
 							}
 						}
@@ -1005,9 +1096,9 @@ const handlePageChangeACTA = p => {
 							color: rgb(95, 101, 108);
 						}
 						.type1 {
-							border-color: rgba(145, 202, 255, 1);
-							color: rgba(22, 119, 255, 1);
-							background-color: rgba(230, 244, 255, 1);
+							// border-color: rgba(145, 202, 255, 1);
+							// color: rgba(22, 119, 255, 1);
+							// background-color: rgba(230, 244, 255, 1);
 							border-radius: 4px;
 							border: 1px solid;
 							padding: 2px 8px;