From ca1e5f26cf2f0c67daffc50332f4224aaa891476 Mon Sep 17 00:00:00 2001
From: hanyuqing <1106611654@qq.com>
Date: Fri, 26 Dec 2025 14:07:13 +0800
Subject: [PATCH] all

---
 controller/client.py         |   3 +
 vue/src/assets/green.png     | Bin 0 -> 1209 bytes
 vue/src/assets/red.png       | Bin 0 -> 1199 bytes
 vue/src/system/GraphDemo.vue | 140 +++++++++++++++++++++++++++++++++++++++----
 4 files changed, 131 insertions(+), 12 deletions(-)
 create mode 100644 controller/client.py
 create mode 100644 vue/src/assets/green.png
 create mode 100644 vue/src/assets/red.png

diff --git a/controller/client.py b/controller/client.py
new file mode 100644
index 0000000..448c4cb
--- /dev/null
+++ b/controller/client.py
@@ -0,0 +1,3 @@
+import httpx
+
+client = httpx.AsyncClient(base_url="http://192.168.50.113:8088")
\ No newline at end of file
diff --git a/vue/src/assets/green.png b/vue/src/assets/green.png
new file mode 100644
index 0000000000000000000000000000000000000000..c6ca3c1834197a4dd08a955d7739921da3079ca0
GIT binary patch
literal 1209
zcmV;q1V;ObP)<h;3K|Lk000e1NJLTq001KZ001Kh1^@s69@(>5000DlNkl<ZScT1)
zTTE0}6o$V!0}Kwz0G0v8Kn4(~se;9#rfpPeLt|@NjfwH8;lY@;N!tgSw5cYhmq`0$
zdWmV8*z(ZYOKj8N3#Nil8#IL?NlO4PgqvK189<l;W|-aV(>;U%nK=WL^iTG~*=Ozb
z|5<CVv)9=sAp{Y?4D11(0d@d6Kq6oRMgbSl4m1GOz*S(zuzM-Sz_1G;&Ilp;L}chw
z>+D8&!WqN}Ax;V*CL$CuA9DRE<!?!1a)b~~%M>vm(qC?*V)h6jTq`Uj0GIM_NKEkx
zq$M2OiYJJBel_I+H&k`}*O1k>6KD(YXmbcHz;~-81jX~c;$0x73@BJ7ApztAZv`F#
zX-Wa^0@hU)BjEuYz(61}Zx|6WIC7T@)n$D6&0hMQw`S*SZhpz>ik)1#{t*MN+mVV{
z1H6e!Qxs4dZbfTXEfrO-;(XA{I%_f}lWF!{OjInkwW;*n|BJ7yUg6HY8<7es)pe*6
z3yZTC4~eRVPjoY{Z!*Z-@1L2SyLA0y@%b;u#N_mNq~-psrVhQZnD)9U-29?$7G<^s
znVU@7>|8<C^GtZ0jEwi|&wepO?@$XpLw_TLKNQV=nW91?VoaKuanCU8<I_XhjZZo;
zo1?Kr|GNcio6qBX(8G-1OR~+uzJlY6EzOr=@{EYFT5NRmH<FREJ)~VnUxU7<64q|u
zR&PD`M>`mF-O&YleUqV<=4z@R2@6N+4q7^^@%w#?nofBqXzTusEg8iOk9F~5?Yo#T
z(eG+!XtXnE(?0}BQcS!NG21eq(+S#peqYq4t-B8Q)Cf6gPxAA%_ei&I!xA0GR!0er
z)IwsS)`X&nmuVU^B533KJTf;Fak=p`GB*}2a4e&8x#3d^b6#R}Vt_ICAV>F=>zlTv
zvqrbcPTLiVVoX!5VpzzE+5h-!43BkE-Sou*^UC@&c&5iFE;xZ}{2p<!37EBL;;nXy
z@{Z`^k@$>IG)@_rRv@HR04a%C9DeFF-&U9D`QN?e7`~ZluKan9KiYrd_<{38nPc=y
zn(_Pa`aEE<p_$A^+_y<FjX;SJYl-}<1Nyh4vc8<A+m%dt-DoC_(vov*PTQ^9*b}mt
z_ImUP+2T@-x^9+fx?<EifbH1_Iq^b;UMU-ra(VsGMIKGxJNw?A;2_?bOxHkjByN9|
zk*Sj>raHL|BPB7LP05duZZE(V7ra!{qOis$=#dc!U33^o{u&t>`Qi8~(&)%4v04&n
z@45ES_wK1teeW0$g5viDT8Oi%uP_W*T~Fj4(c22yI`li+^>UWcsBgKTw-R$x7Xlu|
zAJhY%1m2G{Lap6({BZRhrhRUb)@{-^v=nr3*V{b3^<^V2P5~dx7h_S)xNHSi3(cx2
zpJHAQEGLetu6;Eys`#b?T-rQR`P*<92zk7&045brTac^&`yXXs<Ov~~S6IkR<#$Q9
z5EgZN;9jN(xAJ3I&Xq`Dq^NtAfe1xN`*O8DEYDJIuH=`jc+SmLlIn+KU*uf!%@yzu
X+<Y!`rV6L400000NkvXXu0mjfz7$0v

literal 0
HcmV?d00001

diff --git a/vue/src/assets/red.png b/vue/src/assets/red.png
new file mode 100644
index 0000000000000000000000000000000000000000..3a632c657b91fc86e1f02d88af156e091437ff13
GIT binary patch
literal 1199
zcmV;g1W@~lP)<h;3K|Lk000e1NJLTq001KZ001Kh1^@s69@(>5000DbNkl<ZScT1)
zT}+!*7{`At9pz(uLtz8Q2pc5^!{!K!I5WaN+!DRmF5Jyx!i_O8eq2cA1tc1cQxnZH
z^=6Sc&5R$3&Ks6&I%lS4U~rSb97P8kOlTRO1zK8KjycCuLOW^S0weyDljc3|bDsY{
z=Xsy!JUu2M1aTk%*bVFfs(>;e3&;Q_fpMS*Xa{}(eguMs-AgeBhD``@TnI5F;=_<$
zXEVYR%OFt*(I|wNiBm)*<oYJ<Z&_l>gb>$OC?XQlpFLhNyM++rt1KjhaqZubn7UO6
zODuRaPZ)P(HratTogMcZGW&J{ju4M|5up|MVvU5LdA`)V_lS8J*tSMOLZ}29LJy%Z
z<paGy${LH2@B$@(E3`8&8WA$(x=s5huW`QV5bmMgh50|fJHxqS2kAQd0aHVL@rp?X
zUP6b-0@TM^;ktf>wo|X*866@iJqHt}g?9;wNhD|4nCS1O_0%y&dalMRs9x#NDHao#
z-mVunT0T-{LBB7|e11N-FxU0%hvM>k&x*O(xU0iHvp)1<BH;7#K=lD-W?q*VW^OW>
z7v>5d-ivQ~0`K^+dKU9RCI)(#7;qrOd^DQ9GDJI!h%uSX_@>55%`J>-=bs+OoM6FX
zO;*o;UHqJx(LqEoz<S#zw(dK+)Y3{Rrrd~_#FTVKZ+4JfQW4co+9YM<kerpzT}M09
z!~IM-Z(+8qBRJ=aw$yIc{YXsYY^lWA`7<K8bbAu;d2s#FO2I?Bm>Kz-Yo8sLF~mLC
z%k=Po+}~(4*-}ip5iuLL)hUAE?q8R*kwW|)H#U1U9bdgm*5(JXSX0=zy_THPN|kj{
zkS@dIHX<maXbZVpx6^&DS^Y*jmb=p3(#)pngLo(JGCMiKj-!q0qjh%uqHOZYqJExk
zvu+h*LS~HpKs_@fcj&qB={@G1U!P>oJ4M<4r}2(CNleYaWU-KxkxTI-PpFZaR}_tA
zOzuoKP;5j{TES*2k2KJJ`c)PGlE)4)ADF{&{xtoqEz~@BLVc(*G%|aF{#i&#$7D`0
z;@%;}{02O3#2Qsc_Ndy?`OW*>X}_TAk4*cW&%8sPy-L}vFDNG9pT#@oB01A$)OCjp
z(?z4!Arw{ZXV>#5Ri>mDmQvf$OhHA>!uvE^u{tuwZe5SZ?e}tLF3UvFC%0jwZ73mg
zQ@N@;Ntt<J%S;Ig>YMS5Ib|!UM8|;Sza)1i0DK(p?#L{Wg>d*r+kd{F^SJ-5!m)**
z`2(RA;)L!i3`1sDam|xVId7}h!993WrL)|PzMszGcJ@(F@u(4ZUd<oY12+P%$0G<;
z=&o?}%$o##UQ%*45b%3dYF8Y7fzsNijJRk5-iQ=q)y=qU1=k84x+zzO*5V#mP8`u)
z`&wX9^DUg7<_J>xx8X1_d!NP3Y92?}?En2AWoVQOAv#uB$nV<kvTh-)`u4!HLJ=PA
z$GVa$k<iH3_bjeBMM(R%^!k`Q%elF#1?m>vTxIKiNcKfz%f7h+{sAmsFFQl)(w_hT
N002ovPDHLkV1m*ILx2DP

literal 0
HcmV?d00001

diff --git a/vue/src/system/GraphDemo.vue b/vue/src/system/GraphDemo.vue
index abc8f27..8528aa3 100644
--- a/vue/src/system/GraphDemo.vue
+++ b/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>
\ No newline at end of file