all

controller/client.py

@@ -0,0 +1,3 @@
+import httpx
+
+client = httpx.AsyncClient(base_url="http://192.168.50.113:8088")

vue/src/system/GraphDemo.vue

@@ -27,15 +27,24 @@
 
           <section class="main-content">
             <div class="disease-container">
-              <div class="disease-header">
-                <div class="d-title"><img src="@/assets/组 10.png" class="d-icon"/><span>疾病信息</span></div>
-                <div class="d-count">12类</div>
+              <div class="disease-header" :style="headerStyle">
+                <div class="d-title"><img :src="iconSrc" class="d-icon"/><span>疾病信息</span></div>
+                <div class="d-count" :style="headerLabel">12种</div>
               </div>
               <div>
                 <el-radio-group v-model="typeRadio" @change="changeTree">
-                  <el-radio value="Disease">疾病</el-radio>
-                  <el-radio value="Drug">药品</el-radio>
-                  <el-radio value="Check">检查</el-radio>
+                  <el-radio
+                      value="Disease"
+                      :class="{'radio-disease': typeRadio === 'Disease'}"
+                  >疾病</el-radio>
+                  <el-radio
+                      value="Drug"
+                      :class="{'radio-drug': typeRadio === 'Drug'}"
+                  >药品</el-radio>
+                  <el-radio
+                      value="Check"
+                      :class="{'radio-check': typeRadio === 'Check'}"
+                  >检查</el-radio>
                 </el-radio-group>
               </div>
               <div class="disease-body">
@@ -126,13 +135,67 @@ export default {
         { key: 'Drug', label: '药品', color: '#91cc75' },
         { key: 'Symptom', label: '症状', color: '#fac858' },
         { key: 'Disease', label: '疾病', color: '#EF4444' },
-        { key: 'Check', label: '检查', color: '#59d1d4' },
-        { key: 'Other', label: '其他', color: '#336eee' }
+        { key: 'Check', label: '检查', color: '#336eee' },
+        { key: 'Other', label: '其他', color: '#59d1d4' }
       ],
       visibleCategories: new Set(), // 先空着
     }
   },
+  computed: {
+    // 根据当前选择的类型返回不同的背景颜色
+    headerStyle() {
+      let backgroundColor = '#fff'; // 默认颜色
+      switch (this.typeRadio) {
+        case 'Disease':
+          backgroundColor = '#990A00'; // 疾病选中时的颜色
+          break;
+        case 'Drug':
+          backgroundColor = '#9ECA7F'; // 药品选中时的颜色
+          break;
+        case 'Check':
+          backgroundColor = '#2265f4'; // 检查选中时的颜色
+          break;
+        default:
+          break;
+      }
+      return {
+        backgroundColor, // 动态设置背景色
+      };
+    },
+    iconSrc() {
+      switch (this.typeRadio) {
+        case 'Disease':
+          return require('@/assets/red.png'); // 疾病的图标
+        case 'Drug':
+          return require('@/assets/green.png'); // 药品的图标
+        case 'Check':
+          return require('@/assets/red.png'); // 检查的图标
+        default:
+          return require('@/assets/red.png'); // 默认图标
+      }
+    },
+    headerLabel() {
+      let backgroundColor = '#fff'; // 默认颜色
+      switch (this.typeRadio) {
+        case 'Disease':
+          backgroundColor = '#790800'; // 疾病选中时的颜色
+          break;
+        case 'Drug':
+          backgroundColor = '#638C0B'; // 药品选中时的颜色
+          break;
+        case 'Check':
+          backgroundColor = '#5384EF'; // 检查选中时的颜色
+          break;
+        default:
+          break;
+      }
+      return {
+        backgroundColor, // 动态设置背景色
+      };
+    },
 
+// #790800
+  },
   async mounted() {
     this.visibleCategories = new Set(this.legendItems.map(i => i.key));
     await this.loadDiseaseTreeData()
@@ -488,16 +551,16 @@ export default {
                 if (label === 'Disease') return '#EF4444';   // 红
                 if (label === 'Drug') return '#91cc75';      // 绿
                 if (label === 'Symptom') return '#fac858';   // 橙
-                if (label === 'Check') return '#59d1d4';   // 橙
-                return '#336eee';                            // 默认灰蓝
+                if (label === 'Check') return '#336eee';   // 橙
+                return '#59d1d4';                            // 默认灰蓝
               },
               stroke: (d) => {
                 const label = d.data?.label;
                 if (label === 'Disease') return '#B91C1C';
                 if (label === 'Drug') return '#047857';
-                if (label === 'Check') return '#40999b';   // 橙
+                if (label === 'Check') return '#1D4ED8';   // 橙
                 if (label === 'Symptom') return '#B45309';
-                return '#1D4ED8';
+                return '#40999b';
               },
               labelText: (d) => d.data.name,
               labelPlacement: 'center',
@@ -1033,4 +1096,57 @@ button:hover {
 .disease-body::-webkit-scrollbar {
   display: none; /* Webkit browsers */
 }
+.disease-header {
+  padding: 16px;
+  border-radius: 8px;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+}
+
+.d-title {
+  font-size: 18px;
+  display: flex;
+  align-items: center;
+}
+
+.d-title .d-icon {
+  width: 20px;
+  height: 20px;
+  margin-right: 8px;
+}
+
+.d-count {
+  font-size: 16px;
+  color: #888;
+}
+
+/* 动态给每个 el-radio 设置不同的背景颜色 */
+.radio-disease .el-radio__label {
+  color: #ff4d4f; /* 疾病的颜色 */
+}
+
+.radio-drug .el-radio__label {
+  color: #1890ff; /* 药品的颜色 */
+}
+
+.radio-check .el-radio__label {
+  color: #52c41a; /* 检查的颜色 */
+}
+
+/* 自定义选中后的样式 */
+.el-radio.is-checked.radio-disease .el-radio__label {
+  color: white;
+  background-color: #ff4d4f;
+}
+
+.el-radio.is-checked.radio-drug .el-radio__label {
+  color: white;
+  background-color: #1890ff;
+}
+
+.el-radio.is-checked.radio-check .el-radio__label {
+  color: white;
+  background-color: #52c41a;
+}
 </style>