From f8bc960d4d2c2e02e1326ed93fa94b32c5d203b4 Mon Sep 17 00:00:00 2001
From: Dragon <>
Date: Thu, 14 Mar 2024 22:09:44 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E5=96=84?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/message/message.ts                   |  20 +
 src/assets/images/message/approve-active.png | Bin 0 -> 711 bytes
 src/assets/images/message/approve.png        | Bin 0 -> 679 bytes
 src/assets/images/message/arrow-active.png   | Bin 0 -> 389 bytes
 src/assets/images/message/arrow.png          | Bin 0 -> 383 bytes
 src/assets/images/message/clear.png          | Bin 0 -> 592 bytes
 src/assets/images/message/set.png            | Bin 0 -> 4023 bytes
 src/assets/images/message/system-active.png  | Bin 0 -> 1380 bytes
 src/assets/images/message/system.png         | Bin 0 -> 1321 bytes
 src/views/message/content/Content.vue        | 369 +++++++------------
 src/views/message/content/Detail.vue         |  91 ++++-
 src/views/message/index.vue                  |   4 +-
 12 files changed, 227 insertions(+), 257 deletions(-)
 create mode 100644 src/api/message/message.ts
 create mode 100644 src/assets/images/message/approve-active.png
 create mode 100644 src/assets/images/message/approve.png
 create mode 100644 src/assets/images/message/arrow-active.png
 create mode 100644 src/assets/images/message/arrow.png
 create mode 100644 src/assets/images/message/clear.png
 create mode 100644 src/assets/images/message/set.png
 create mode 100644 src/assets/images/message/system-active.png
 create mode 100644 src/assets/images/message/system.png

diff --git a/src/api/message/message.ts b/src/api/message/message.ts
new file mode 100644
index 0000000..7d3ce18
--- /dev/null
+++ b/src/api/message/message.ts
@@ -0,0 +1,20 @@
+import { http } from '@/utils/http/axios'
+import type { PageParam, PictureSortParam, SetTFParam } from '/#/api'
+
+/**
+ * 获系统消息
+ * @returns
+ */
+export async function getMessageList(params: PageParam) {
+  const res = await http.request({
+    url: `/ocr/msg/systemPage`,
+    method: 'get',
+    params,
+  })
+
+  const { data: { records, pages } } = res
+  return {
+    pageCount: pages,
+    data: records,
+  }
+}
diff --git a/src/assets/images/message/approve-active.png b/src/assets/images/message/approve-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..76c16578b7382adaeae19efed979893d3c3b5500
GIT binary patch
literal 711
zcmV;&0yzDNP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800001b5ch_0Itp)
z=>Px%fk{L`R9HvtmQ83AQ4q)f^EQd-!4D9`dK9hDi=xnrho%Sd(zq!o9<>J%Pl}gh
zEtrD7)l<C)Ui>(UV)NSKp%?9;ARdaJh~n9bC#?t3Ci_O;ZW5EY3A<$_Dh@1!x09LQ
z{O7%$N9eIpkMra21+WXemxb3);GM*nE4%4Ot5Gwy0wytpJ^{cyKaH?xu^782>3JNG
zSOB>a_lXt#u91Lg-v3QJR9|Bj1Jf?OiV6`6z;?W=08TOJJ_|ZKbAjHNM57LG^@wi}
z^Fa_6)kSMx;sAD`G6W$W0$A2U4Azs^6WQZmw?k)M0K68=dF7^56o|+QGys_9l`FDg
z!Sm<zOJ*Jb^n{Y>(mx7d$_kO#E>sRch&g{xdSZ9^GCfOF0Tax2yz2nQz<A=V5&LIL
z^u?@?lz5%>O)r432Oy=S$VW-;!$x&9ez|e(7pxb+*xcM_+o_ZQaUQ@Yz{@I`c^Wlt
zEC64HqIVjENr0A=6x#x2%(sF2z&N8^>q^w*u@wjasy2wqrdlPfO|{m11h6sA@vB32
zRUq&1QATxFYel})rhBtWid;>B8GuKEbv@DSPe{EkOS;`jm5u-nSwsIxOU%{LX*cuO
zygpQ186-+g`EBUnUvF3Y>repO(RTno4B!KxueDS}^p@CqFeT}I^Sb#QGkL?zyrWIA
zlK{2=bXQ4nBqD&f3}8LL$CXUoinFQOeQl?D44|6;J}YT$hzh_#J9SoFN(U2fmDV&v
zprrMS;vHJx{RapXNZ8`Hpl1N)^6?uiY(vMM1xa&-pMs(`SFgk^>?YOy7$%GmXA{;2
tPO=0)09po>iT-Eqfn@9M9<ApJd<X7a7%&>XGj#v}002ovPDHLkV1mF;LAL+^

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/approve.png b/src/assets/images/message/approve.png
new file mode 100644
index 0000000000000000000000000000000000000000..3c4beb4f1fe819bfe9f0e0dcff45414362eba6fc
GIT binary patch
literal 679
zcmV;Y0$BZtP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800001b5ch_0Itp)
z=>Px%VM#<mR9HvtmcMHhK@`WoZ@1FIA0UXa6pfHZQAlHvvk)7_2#TeK-FKc`q4)=A
z{sL`e-8bitQWP{O7HQN%5R2eXM6otvrLnL$xO?s#vvOWGaVIQX6bBBLcW>wWneTfu
zvxFfJ8nQnAUVtcy_5?vN3Sb8j&8BJkY$a}bJK%&Ffc^E4xiAc;k|cTU1L6hHY&J*Q
z?e?c!KvkdEXCj)&V?;ETrs=z~5MBWFdi{#3o&oSM48!wDl6<g2%)AA_bpQte%!$a}
z$^oJ%nh1j6F@S|I499cvT!@*s5z!k}T?1fJL}toBly)Eou(lgxYDJSX^IHI8SyiS*
z<l?^x;8wNBVrD)7VAeI|t~5<wRqB9iwrc>U0K5ROPegvW_*wu@0qh1aBO;S!#Cx!1
z6K!6j(HQM?I#y^?f1R1x*82j0Z>m}|#=I;$uNQz@?O6bqvfVc?B3oU|o(&_}4ml?x
zm&=NKJK)5Q0JvvYD<T_R>??o`KHKlt!L=N19LFb!Xy-tVwc3scB68RP+|Lf6LoPnu
zpRcO#jWM^D(pj<u%$(a=^zJ->qayO$0gMB<>&j4=pO<U!&q4rZz7615)^}e3Tpd`^
zM<RM8BA@%?_BdA6{Y12VK;$%l&DjBUM?{X71y}&EPE}7CV{ZC1)nINM$0v#C27vD(
zvc4>U+Qe?RTWhsiy&G?(qwfxZh%9n^sS^AL=s8gJ@Gim70Bqw_EpF#4YH07fplYx}
zfH;orr&r~p=u2wZZCEvdPZQ=BPNfVPz;73ooqTonK&8w6!(>Bu;3us={2`aTwV40_
N002ovPDHLkV1n{vFfIT9

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/arrow-active.png b/src/assets/images/message/arrow-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..cb83b99190f770958db3b9f92dd665fd876bbdb2
GIT binary patch
literal 389
zcmV;00eb$4P)<h;3K|Lk000e1NJLTq000~S000~a1^@s6at+^<00001b5ch_0Itp)
z=>Px$KS@MER7gwZ)V)drK@<hxdlmyqOkwGJ_yiGSCG46f(9+Jr!p$NUOTfm;#zq7S
z3(=^JKM!DOqi>-iBnVpU9NB;nByoNXf>U4S<J@~^AY(olvnPKOY__<hs&dy!@#5PN
zZNenuI+fZL;9;tQ`tdfNeNZj9oE2@QWV4S1K(!!AB$?V1%326i3zkSo)CdfT8iS+I
zN)_`bDV|Ih$qEdCT7$l*6F3Zo;BjIabzOU%!J#N{f0kno07uQ#3oI{frd%w9S0aQ6
zdbJtM9&O<5SHL)91LOtCNfCS?Lfpx5{nN%eCv?I3zoY5<8LV@~oIoGU8uZ1iz(EYa
zdql*iZQR(7#At@0Fr$RY78j)8Wx4u3$-X+FO_;Qb15#E(U`7d7cUXJvs(m6lJkN1!
jJG1Zg+JwHq{{ue(PG8*}5JdBN00000NkvXXu0mjf%OaxN

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/arrow.png b/src/assets/images/message/arrow.png
new file mode 100644
index 0000000000000000000000000000000000000000..9dcb1aa7d26ecfe8c48c6fbfb236f54984ea3fc4
GIT binary patch
literal 383
zcmV-_0f7FAP)<h;3K|Lk000e1NJLTq000~S000~a1^@s6at+^<00001b5ch_0Itp)
z=>Px$IY~r8R7gwR)IUnaKoAD-Z$ikkF}?Tj1W(jTcvrB=EOs^lFJKjHVj!DByn;6V
zIe?{&-a;*c2-@sOMByPXX0y9K#I1Mtx8KaLge5OpvWLG3GV@Lx$2V0~J^5B-FriXv
z-xzZQ;10mFX_`kLbP#0bLlHUnM7+^KP((;6bu1!#A<#jvLqeifU`W&&>_aD$$wpb0
z54M9e3Jigc27OT{a1lyG_eqjWhsx^=_9VU4TCWq4^!3yW>@HPGZ5v}QfRBIqIZe~G
zq9|T|1<bN+3&0tG6(V{AFw<IJ{xq@930<)6Ax@wx<^=j+qd{M66gZCoc#WcHR@e2F
z?U(ko&#H%^Fsp>jyeT5*-RS!yvrfp&CnB;N0<%h(=lN>ewpv6^o2I!Q+q3Wct$OH-
d%%A`N;5&^E#~p6NrcM9=002ovPDHLkV1iaPr5gYM

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/clear.png b/src/assets/images/message/clear.png
new file mode 100644
index 0000000000000000000000000000000000000000..12b75fa0a5c44fa3b0f68dda0a7468c77ae90452
GIT binary patch
literal 592
zcmV-W0<ZmvP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800001b5ch_0Itp)
z=>Px%3Q0skR9HvtmpgA0K@i9Pv;Gu33TS~ABtnz4APOjGf#BUeprZzYftn7uoi(pE
z1r!L{q#;Pq0xc9gK81JiS~<yb*0*<dLKKv1EO{RL^X&X*&V*flXqV5&-UKkl+)GuC
znUmkwRk?Kqy4~)gQfe)gG=#9!@Auc+T<cr_A~HIRh!*4LKL=pu(GM`j$UeaTQvt2@
zV<NiIq?0FmAQvMdPrUax$NjdbKx@5Lb#*S`3;^ri`=zD;y%0jJrYp_I*-!_ol#2G1
zDBD&5vrM)W$mZnSg8;c6XlZX<ftLC6?u~lDT6;`HE>%sFPn-AHR8^0NR-JR-YE=-8
z*4jcuo&tEq%vbV9O!qLxyaaHWh^{;5%1O`UHZ;aO2XK{$?mOpJ<^izQ_C(|^fEUcX
z+!Wvofa4-^&3hkVMo*>pX*)k<*IF+V(K7&FnfXLhfYEvtkyGCL&s9*hcB=_EnJi`3
zTAw7MPti9Ox8(|oqBs&l_?`-w1t8|B;*?TH%d-4Y+k{0?TnHh&2JnlS505*~0q_&R
zA*IyCvMk@^cEJN8x(#51na^w!zy|;eBJ$9Ce<ug<Zg^*BiRjT_FnBxeT)m9OcfXV}
zrrA54&Uq2JHSDSP!=5@<3t)`-4dB2$(yNL6!^{VB02=^K?-0O8W?sln!W}w1nYQ)+
eg6)Re2lxvn08B8#2X5&A0000<MNUMnLSTXubr0hJ

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/set.png b/src/assets/images/message/set.png
new file mode 100644
index 0000000000000000000000000000000000000000..07e085c360074ef1ba5bcdcfc3f8133b78f0650f
GIT binary patch
literal 4023
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

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/system-active.png b/src/assets/images/message/system-active.png
new file mode 100644
index 0000000000000000000000000000000000000000..ef3ab12d3640d51fc93878a2eafe1d30b96ade39
GIT binary patch
literal 1380
zcmV-q1)KVbP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800001b5ch_0Itp)
z=>Px)9!W$&R9HvFS8a$?RTzHWb7p1}66pg?ixP^EN-Zsfei=v>+3p=}mk`ZLP_YzN
zEuA}S?b6H{#mHofEGUCM1Xp*?teBKS{wXoi0<(yc#E4S*!laztIp=Nf%-oqfvokxh
z{_*^}_uTiq?{nU-=e>k0yyyzs$Cv>)n}+5xh0bSE^lcD)Ta51@&P~)?!biq(sipu#
zH}gzua?1$f2>{m-(J5=G!w2CR7lQXN^PK?B5zq@E`qK&et`V4q0NP?^0}-}WEAl`v
zo4ripya25(8m|x|pewCpax@Ti0kpb2Nq~C+Zub=su$6&H0G_O=l<+nf{{mQ3{!aS^
zXl1{mUu&JI3&4rlPeD94e~59CrCpavgb#bKZE=$#izOi3R8)F~2p^`CGVZ-QvD{J+
zy#V00!g)HPQ{sWK0dVaAz>j)|w30P}Mq_+C%dF9ft4`Na?zn~v`?Oyx(K<!|L*0OQ
zaWnvp608is_GlIEZW_QsmnU1;&jCyY@V!=YS|ek%zDMKsn?iC@pH`xyDF9xbLkKVN
zRu>PvrIlP+QS%$K(<v0W3v8!=VMy>V#P)Q*ikt|_Ij(sVz>312?SU}wRfnq-+t%lK
zya@3jfag>owc=jAg^v4sP8UB2Yxe=Ty6Q$*5H{$fe61wAiDyIDFDvEfSUB?gyuR*<
z7xUTSe_R;nsAbz<7N!hK+MIcbPL>qL&9h+ijv5Xj=IaD~;>#?G@ia@U7##KYn7KWZ
z3hk``&=xmqiLnDfPOzBUpQ6u#h8DVmvn-^S7cBstCF1v)O`qiOB||pKj8#Oq8Nfw0
zx%)F)TS~w^J#FsLe1aGN5Mjo1nUs9F0)XQhZ)5#%6Zu0cd42UQqj9r}8E+J-3TuL{
z&KroCl|<NCRJty$<o0SEj%$7f^1Y*1E4j7;K-9JUMK_(+N){SOU^%YYRqTL+TFI7L
zVQ^fN^==5}-8vOoTtkPKOS1sVXeFE~50o0u39aPpQ2_iEj))ujx@j;d)85JBhQ`@*
z0LIq^;CEN%k8~>ZNOcJOk~uTnJA1+rIndWlfBHs(As~q5X+`e@0YqIBXCP541jW9x
z0-zNDPhrBYOj15w6#|oBAm7Uii_XHDWj?=GBq7rgB0e1YPrQN&Fu6f2VdkYp?x;w@
zDylAMCMcgb%4O*CWW#nF5grC`Z3#w1OiFjtdGFmBS%&|3RRiFf67E15I$f7;g$@50
z@YLVTIKU*<4=D1&HF6?yHt|$QECAbLz0*Fe#ACjaF*Tw9p@GpUr8uxJK|cgTSD%hu
z^VKjB-tC1#D{)KkP}|1rbRk3YnE5^sWrw|XjM#ipqZR*@=ab8$WAl2E4=!jWC)6st
zMthEHF666%@TyMA&RX(yJrH2BkF^pHH8NJSFO-LxueFl*Gz}oy#S7Tl{e=S~xxAPM
zv%#1N!Vnn8iR`Jg3Lgp@aoqAu0q|2=h2E_OQPTtY5u5C(KuI1OE}kB(=wLLSYiFiC
zHE%=QkxqvCoLFu-3DH?Gs8+FRsmkiPc9F|74D*iCT$mpXc_)EZ`Dd8$TYeq@ZY;Nt
z{9w8~0RAW}tqD?kQ&r##MPp_g6E=(hN@B52(r$0R)y+LFP<Re5hTWb~;dP_sPs9I$
zf`RM|fzUI->85(d8=n8X`LQ_n*&ZoEA5_<T(@9tlah`Bma&zkaetF|uc1q~z!L{VE
mVpFRr4>YCeGKH=<fd2vbL{mS_wf9Q^0000<MNUMnLSTZ=J%wBV

literal 0
HcmV?d00001

diff --git a/src/assets/images/message/system.png b/src/assets/images/message/system.png
new file mode 100644
index 0000000000000000000000000000000000000000..8163fbcadf794f49bcf43a0b2ed25ebe72c3bc89
GIT binary patch
literal 1321
zcmV+^1=jkBP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800001b5ch_0Itp)
z=>Px(<4Ht8R9HvFS8He-RTTctBq$*k;{)ppEhtjdw%RBKe?=%(v5Ex~q*$xT&Yg`K
zA!+>OGoTewtR)(E&Yf7nN5Qm(wy3BD`$tQ~R-r}_EtVQl0~%?JXwA-XPMBGzli6(6
zKRFP{oO|!N-#xGIEMb9#7WjVD4WLjcv^6v|jQhU-RT{kKc~_Rp<@16d*k8}1<^{m>
zycHs{5x_kF&H*q=L>&nTy<9}z25=RCU!pyOVHoZTg5c{~U}^$zUALczp35;b3Sftb
zj1$rQ@#WcVk23SqbAhM|pin3*b{uCgdTo1RKt!H(9A~kJ+?!`qM1}$UNkl!V^}PT*
zX8tMfOjQ7`>wZK;ZSkQaBGPBA-KXEim}dao4dCK<{TP6^nE4U?c3pP^fX9jGa{U&O
z{npwW>jGem*#qD<J;cnpKwa0pf{4n@d^FFvF-BtjUS__%UI0%<;GdWaK&=Ez0T^Ir
zwKq$0UuKNC0Kg{zmH_yMnU~hOtcnM|jFWSOnLFkMK<k`{+T+ZQ9l&1turX#C5nU}J
z7Xm0pVgC`p(a6n*Gy8l^nOHXf;Pq^{Djw+U>|E5?*!UrURcRw(7+x0y!J$NFjJXNG
zP5@_QUi3GBerA3t(H9DZR>yHZ%j`SY*x0ywXlUpU)mH!%i^X-?Jd({sv|B_TW9B2N
z%OBJxQzIN}nE8X$nWaRuSwz+)x-bmegCN*(3IJowLjbk{n06eetyC&~oN?#MI4@2I
za2&uJA~Hfmf2naIDgwA9@`AqXhBR=s<GSt|BGSq_O++5H);^yFpo&cZevRCCZuXU)
z=M_cdl~~`CcD3q^F`6f(c)gFAw`6S?V}8)yAtHm;T7B?;A@DqJSL`NDrkMtk7SHpx
z#U1b@GpiS7i7`g=Kwr4sTDv|6facOl5!r36y(8;^r12bP=GHj?OiWBnoIf%$ax%TA
zx3{-xYHCV}Xi+r)Np}^IcdfOzW&tE6b4)}A!Z6%3JUskca!EP_BGP58eKnIK+J>LX
z3qjmhv>f$MOLrSHcV+?T;hA0@%keM_HzxcZwdP6^YHuf^ea+3yFN}?im0Ma`lovL{
z+;K`0W~e%`y*c5HN*O9jrCkxZ1;E+KPG!GRsWcuZTDA-)wQ8d3IV%OcQijHu%OcYH
zF17YM5xr9`mp27Lpy8T55fzKYC1Dt@P1XBOX1+5qQcojF6B>YCz1;WxZ_}ZxO2@{S
z&jDPcHP6hKX5zgJz-ke>-f<kw{DUI$X-+HtUisvI(Xs2gFUNdvBC6>#^UAK4&KPq-
zs{+7_%-ox|e=ZNqFc}fO@B9AEwJytBPYpF+F!QzZ22d;(*M?!Jqm;@lF4sH|kyavF
z5mnAV(cp3@V$f0F_m#{lVvMQG6e4n;wf40vh+GfErK3Y<A{yfXYwdf+7@ZMy0?v~T
zW*+f8uS-PK<vJzLNS0L-ebo?jcXuzJo}S*CnhSNdE5)Rfoc}qV2QEq!I+zksR|?&M
zFbsRrl%7Ujb1e5fPkTfEEY}gO_kDl6>Rs2pi->0a&&U>L?yKUh8Fftnx~WhoEO#8|
zf%J5fo$;diPv^&E?i(PYH?uXL2V`CVl7mV(larIHs{Q=ZajvPU>A>LNp!SA&NnHTu
fWwFjp3l894k*7vKsGVc!00000NkvXXu0mjfW>RP!

literal 0
HcmV?d00001

diff --git a/src/views/message/content/Content.vue b/src/views/message/content/Content.vue
index d46ab37..ee01c72 100644
--- a/src/views/message/content/Content.vue
+++ b/src/views/message/content/Content.vue
@@ -1,42 +1,41 @@
 <script lang="ts" setup>
-import { computed, onUnmounted, reactive, ref, unref, watch } from 'vue'
-import { useDialog, useMessage } from 'naive-ui'
-import { clone, pickBy } from 'lodash-es'
-import ConfrimModal from '../modal/ConfrimModal.vue'
-import type { PictureSortParam, SetTFParam } from '/#/api'
+import { onUnmounted, reactive, ref, toRefs, watch } from 'vue'
+import type { PictureSortParam } from '/#/api'
 import { useWorkOrder } from '@/store/modules/workOrder'
-import { clearTF, getPackageTaskList, getTaskDetailInfo, getTaskDetailPictureList, setTF } from '@/api/work/work'
-import { fieldMap } from '@/config/workorder'
+import { getPackageTaskList, getTaskDetailInfo, getTaskDetailPictureList } from '@/api/work/work'
+import { getMessageList } from '@/api/message/message'
+import iconApproveActive from '@/assets/images/message/approve-active.png'
+import iconApprove from '@/assets/images/message/approve.png'
+import iconSystemActive from '@/assets/images/message/system-active.png'
+import iconSystem from '@/assets/images/message/system.png'
+import iconArrowActive from '@/assets/images/message/arrow-active.png'
+import iconArrow from '@/assets/images/message/arrow.png'
+import iconClear from '@/assets/images/message/clear.png'
+
+const emit = defineEmits(['goDetail'])
 
-const batch = ref(false)
-const selectItems = ref<any[]>([])
-const message = useMessage()
-const dialog = useDialog()
 const totalCount = ref(0)
 
-function setBatch(value: boolean) {
-  batch.value = value
-  if (value === false) {
-    selectItems.value.forEach(item => item.checked = false)
-    selectItems.value.length = 0
-  }
-}
-
-function onCheckChange(checked: any, item: any) {
-  const index = selectItems.value.indexOf(item)
-  item.checked = checked
-
-  if (index === -1 && checked)
-    selectItems.value.push(item)
-
-  else
-    selectItems.value.splice(index, 1)
-}
-
-const showActions = computed(() => {
-  return selectItems.value.length > 0 && batch
+const state = reactive({
+  tabList: [
+    {
+      name: '审批通知',
+      icon: iconApprove,
+      activeIcon: iconApproveActive,
+      value: 0,
+    },
+    {
+      name: '系统消息',
+      icon: iconSystem,
+      activeIcon: iconSystemActive,
+      value: 1,
+    },
+  ],
+  list: [] as any,
 })
 
+const { list, tabList } = toRefs(state)
+
 const packagepagination = reactive({
   pageNo: 1,
   pageSize: 10,
@@ -51,136 +50,23 @@ const sortBy: PictureSortParam = {
 }
 const workStore = useWorkOrder()
 const selectTask = ref<any>(null)
-const overTask = ref<any>(null)
 const taskList = ref<any[]>([])
 const taskDetailInfo = ref<any>({})
 const taskDetailPictureList = ref<any[]>([])
 
-const confrimModalRef = ref(null)
-let processItems: any[] = []
 const tab = ref(0)
 
-function validate(items: any[]) {
-  if (items.length === 0)
-    return '至少选中一个任务'
-
-  for (const item of items) {
-    const { iztrueorfalse, history, states } = item
-    if (iztrueorfalse !== null)
-      return '存在已经辨识过的任务'
-
-    else if (history)
-      return '包含历史数据'
-
-    else if (states !== 1 && states !== 2)
-      return '审批状态不合法'
-  }
-
-  return null
-}
-
-function falseHandler() {
-  let cloneItem: any
-  if (batch.value) { processItems = selectItems.value }
-  else if (overTask.value) {
-    cloneItem = clone(overTask.value)
-    processItems = [cloneItem]
-  }
-  const msg = validate(processItems)
-
-  if (msg !== null) {
-    message.error(msg)
-    return
-  }
-
-  const modal = unref(confrimModalRef)! as any
-  modal.showModal()
-}
-
-function trueHandler() {
-  let cloneItem: any
-  if (batch.value) { processItems = selectItems.value }
-  else if (overTask.value) {
-    cloneItem = clone(overTask.value)
-    processItems = [cloneItem]
-  }
-
-  const msg = validate(processItems)
-
-  if (msg !== null) {
-    message.error(msg)
-    return
-  }
-
-  dialog.info({
-    title: '确认提示',
-    content: '确认给该任务图判真吗?',
-    positiveText: '确定',
-    negativeText: '取消',
-    onPositiveClick: () => {
-      setTrue()
-    },
-    onNegativeClick: () => { },
+async function getList() {
+  const res = await getMessageList({
+    pageNo: '1',
+    pageSize: '10',
+    msgCategory: '1',
   })
+  const { data } = res
+  state.list = data
 }
 
-function setTrue() {
-  const ids: any[] = processItems.map(item => item.id)
-
-  const param: SetTFParam = {
-    taskchildpictureids: ids.join(','),
-    iztrueorfalse: 1,
-    packageid: workStore.getActiveId,
-    judgeid: '0',
-  }
-
-  doSetTF(param)
-}
-
-function setFalse(id: string, desc: null | string) {
-  const ids: any[] = processItems.map(item => item.id)
-
-  const param: SetTFParam = {
-    taskchildpictureids: ids.join(','),
-    iztrueorfalse: 0,
-    packageid: workStore.getActiveId,
-    judgeid: id,
-  }
-
-  if (desc)
-    param.judgedesc = desc
-
-  doSetTF(param)
-}
-
-function doSetTF(param: SetTFParam) {
-  setTF(param).then((res) => {
-    const { code } = res
-    processItems.length = 0
-    if (code === 'OK')
-      updateList(param)
-    else
-      message.error(res.message)
-  })
-}
-
-function updateList(param: SetTFParam) {
-  const list = taskDetailPictureList.value
-  const ids = param.taskchildpictureids.split(',')
-
-  for (const item of list) {
-    if (ids.includes(item.id))
-      item.iztrueorfalse = param.iztrueorfalse
-  }
-}
-
-function forwardHandler() {
-  workStore.forward()
-}
-
-function backHandler() {
-  workStore.back()
-}
+getList()
 
 watch(() => workStore.activeId, async (newValue, oldValue) => {
   const res = await getPackageTaskList(newValue, packagepagination)
@@ -191,11 +77,6 @@ watch(() => workStore.activeId, async (newValue, oldValue) => {
     handleSelect(taskList.value[0])
 })
 
-const packageName = computed(() => {
-  const index = workStore.getCurrentIndex
-  return workStore.getOrderList[index]?.packagename || ''
-})
-
 async function handleSelect(item: any) {
   selectTask.value = item
   const taskId = item.id
@@ -206,64 +87,18 @@ async function handleSelect(item: any) {
   totalCount.value = total
 }
 
-async function sortHandler(orderby: 'pictureResult' | 'fromuptime') {
-  if (!selectTask.value)
-    return
-
-  taskpagination.pageNo = 1
-  taskpagination.pageSize = 10
-  sortBy.orderbyvalue = orderby
-
-  const res = await getTaskDetailPictureList(workStore.activeId, selectTask.value.id, { ...taskpagination, ...sortBy })
-  taskDetailPictureList.value = res.data
-}
-
-const propertys = computed(() => {
-  const { ocrPicture } = taskDetailInfo.value
-  const v = pickBy(ocrPicture, (value, key: string) => {
-    return key.startsWith('field') && value !== null
-  })
-  return v
-})
-
-async function clearMark() {
-  const res = await clearTF(workStore.activeId, selectTask.value.id)
-  if (res.code === 'OK') {
-    taskDetailInfo.value.iztrueorfalse = null
-    message.info('清除标记成功')
-  }
-  else { message.error(res.message) }
-}
-
-function overTaskHandelr(item: any) {
-  if (validate([item]) == null && batch.value === false)
-    overTask.value = item
-}
-
-function leaveTaskHandler() {
-  overTask.value = null
-}
-
 onUnmounted(() => {
   workStore.reset()
 })
 
-function getPercent(pictureid: string) {
-  const { ocpictureid, pictureresult } = taskDetailInfo.value
-  const index = ocpictureid.split(',').indexOf(String(pictureid))
-  const results = pictureresult.split(',')
-  const percent = results[index] || '0'
-  const val = Number.parseFloat(percent)
-  return `${val}%`
-}
-
-const mark = computed(() => {
-  return taskDetailInfo.value.iztrueorfalse === null ? '未标记' : '已标记'
-})
-
 function switchTab(type: number) {
   tab.value = type
 }
+
+function goDetail(id) {
+  // console.log(id)
+  emit('goDetail', id)
+}
 </script>
 
 <template>
@@ -273,50 +108,55 @@ function switchTab(type: number) {
         消息通知
       </div>
       <div class="clear">
+        <img class="icon-clear" :src="iconClear" alt="">
         清除未读
       </div>
     </div>
     <div class="content">
       <div class="slider">
-        <div :class="{ 'item-active': tab === 0 }" class="item flex" @click="switchTab(0)">
+        <div
+          v-for="(item) in tabList"
+          :key="item.value"
+          :class="{ 'item-active': tab === item.value }"
+          class="item flex"
+          @click="switchTab(item.value)"
+        >
           <div class="item-left flex align-center">
-            <img class="icon" src="@/assets/images/login/logo.png" alt="">
-            <div class="text">
-              审批通知
+            <img class="icon" :src="tab === item.value ? item.activeIcon : item.icon" alt="">
+            <div :class="{ 'text-active': tab === item.value }" class="text">
+              {{ item.name }}
             </div>
           </div>
-          <img class="icon-arrow" src="@/assets/images/login/arrow-active.png" alt="">
-          <div v-if="tab === 0" class="line" />
-        </div>
-        <div :class="{ 'item-active': tab === 1 }" class="item flex" @click="switchTab(1)">
-          <div class="item-left flex align-center">
-            <img class="icon" src="@/assets/images/login/logo.png" alt="">
-            <div class="text">
-              系统消息
-            </div>
-          </div>
-          <img class="icon-arrow" src="@/assets/images/login/arrow-active.png" alt="">
-          <div v-if="tab === 1" class="line" />
+          <img class="icon-arrow" :src="tab === item.value ? iconArrowActive : iconArrow" alt="">
+          <div v-if="tab === item.value" class="line" />
         </div>
       </div>
       <div class="list">
-        <div class="item">
+        <div v-for="(item, index) in list" :key="item.id" :class="index === 0 ? 'pt0' : ''" class="item" @click="goDetail(item)">
           <div class="left left">
             <div class="num">
-              23
+              {{ item.pictureno }}
               <div class="point" />
             </div>
             <div class="date">
-              2024.01
+              {{ item.createTime }}
             </div>
           </div>
           <div class="middle">
             <div class="title">
-              系统升级通知占位符占位占位系统升级通知占位符占位占位系统升级通知占位符占位占位
+              {{ item.packagename }}
+            </div>
+            <div class="status">
+              <div class="tag tag-blue">
+                审批节点：初级审批
+              </div>
+              <div class="tag tag-red">
+                审批节点：初级审批
+              </div>
             </div>
             <div class="subtitle">
-              <span class="name">系统管理员</span>
-              <span class="time">2024-01-31  23:12:00</span>
+              <span class="name">{{ item.packagename }}</span>
+              <span class="time">{{ item.createTime }}</span>
             </div>
           </div>
           <div class="look">
@@ -336,9 +176,7 @@ function switchTab(type: number) {
   box-sizing: border-box;
   background: #FFF;
   border-radius: 3px;
-  border: 1px solid rgb(239, 239, 245);
   height: calc(100vh - 88px);
-  overflow-y: scroll;
 
   .header{
     padding: 24px;
@@ -346,7 +184,7 @@ function switchTab(type: number) {
     &-title{
       font-size: 20px;
       font-family: PingFang SC, PingFang SC-Medium;
-      font-weight: Medium;
+      font-weight: 600;
       color: #333333;
       line-height: 28px;
     }
@@ -354,9 +192,17 @@ function switchTab(type: number) {
     .clear{
       font-size: 14px;
       font-family: PingFang SC, PingFang SC-Regular;
-      font-weight: Regular;
       color: #666666;
       line-height: 20px;
+      cursor: pointer;
+      display: flex;
+      align-items: center;
+
+      .icon-clear{
+        width: 16px;
+        height: 16px;
+        margin-right: 6px;
+      }
     }
   }
 
@@ -364,7 +210,6 @@ function switchTab(type: number) {
     display: flex;
     padding-right: 24px;
     .slider{
-
       .icon{
         width: 17px;
         height: 17px;
@@ -383,6 +228,7 @@ function switchTab(type: number) {
         box-sizing: border-box;
         align-items: center;
         justify-content: space-between;
+        cursor: pointer;
 
         &-active{
           background: rgba(80,122,253,.1);
@@ -399,11 +245,16 @@ function switchTab(type: number) {
         font-weight: 600;
         color: #333333;
         margin-left: 12px;
-        &-text{
+        &-active{
           color: #507AFD;
         }
       }
 
+      .icon-arrow{
+        width: 14px;
+        height: 14px;
+      }
+
       .line{
         position: absolute;
         width: 3px;
@@ -423,15 +274,18 @@ function switchTab(type: number) {
         align-items: center;
         justify-content: space-between;
         flex: 1;
-        height: 96px;
+        padding: 16px 0 16px 25px;
         border-bottom: 1px solid #eeeeee;
-        padding-right: 25px;
+      }
+
+      .pt0{
+        padding-top: 0;
       }
 
       .num{
         font-size: 32px;
         font-family: HarmonyOS Sans SC, HarmonyOS Sans SC-Medium;
-        font-weight: Medium;
+        font-weight: 600;
         text-align: left;
         color: #507afd;
         line-height: 46px;
@@ -441,7 +295,6 @@ function switchTab(type: number) {
       .date{
         font-size: 12px;
         font-family: PingFang SC, PingFang SC-Regular;
-        font-weight: Regular;
         text-align: left;
         color: #999999;
         line-height: 17px;
@@ -472,10 +325,39 @@ function switchTab(type: number) {
         padding-left: 20px;
       }
 
+      .status{
+        display: flex;
+        align-items: center;
+        margin-top: 8px;
+      }
+
+      .tag{
+        padding: 0 8px;
+        height: 24px;
+        border-radius: 2px;
+        margin-right: 8px;
+        font-size: 14px;
+        line-height: 14px;
+        font-family: PingFang SC, PingFang SC-Medium;
+        font-weight: 600;
+        display: flex;
+        align-items: center;
+      }
+
+      .tag-blue{
+        background: rgba(80,122,253,0.10);
+        color: #507afd;
+      }
+
+      .tag-red{
+        color: #ff4e4f;
+        background: rgba(255,78,79,0.10);
+      }
+
       .title{
         font-size: 16px;
         font-family: PingFang SC, PingFang SC-Medium;
-        font-weight: Medium;
+        font-weight: 600;
         text-align: left;
         color: #666666;
         line-height: 25px;
@@ -484,7 +366,6 @@ function switchTab(type: number) {
       .subtitle{
         font-size: 12px;
         font-family: PingFang SC, PingFang SC-Regular;
-        font-weight: Regular;
         text-align: left;
         color: #999999;
         line-height: 19px;
@@ -498,10 +379,10 @@ function switchTab(type: number) {
       .look{
         font-size: 14px;
         font-family: PingFang SC, PingFang SC-Regular;
-        font-weight: Regular;
         text-align: left;
         color: #5376ff;
         line-height: 20px;
+        cursor: pointer;
       }
     }
 
diff --git a/src/views/message/content/Detail.vue b/src/views/message/content/Detail.vue
index ac1ac77..2caa72d 100644
--- a/src/views/message/content/Detail.vue
+++ b/src/views/message/content/Detail.vue
@@ -269,7 +269,9 @@ function switchTab(type: number) {
 <template>
   <div class="wrapper-message">
     <div class="left-card">
-      dd
+      <div class="title">
+        关于系统升级的通知
+      </div>
     </div>
     <div class="right-card">
       <img class="icon-set" src="@/assets/images/login/logo.png" alt="">
@@ -277,12 +279,33 @@ function switchTab(type: number) {
         系统消息
       </div>
       <div class="form">
-        <div class="form-item">
+        <div class="form-item flex">
+          <img class="icon" src="@/assets/images/login/logo.png" alt="">
+          <div class="label">
+            创建人：
+          </div>
+          <div class="value">
+            系统管理员
+          </div>
+        </div>
+        <div class="form-item flex">
+          <img class="icon" src="@/assets/images/login/logo.png" alt="">
+          <div class="label">
+            发布时间：
+          </div>
+          <div class="value time">
+            2023-10-31  23:12:00
+          </div>
+        </div>
+        <div class="form-item flex margin-no">
+          <img class="icon" src="@/assets/images/login/logo.png" alt="">
           <div class="label">
-            任务名称
+            消息类型：
           </div>
           <div class="value">
-            dd
+            <div class="tag">
+              系统消息
+            </div>
           </div>
         </div>
       </div>
@@ -296,7 +319,6 @@ function switchTab(type: number) {
   flex: 1;
   box-sizing: border-box;
   border-radius: 3px;
-  border: 1px solid rgb(239, 239, 245);
   height: calc(100vh - 88px);
   overflow-y: auto;
 
@@ -305,6 +327,17 @@ function switchTab(type: number) {
     background: #ffffff;
     border-radius: 4px;
     flex: 1;
+    padding-top: 32px;
+    box-sizing: border-box;
+
+    .title{
+      font-size: 28px;
+      font-family: PingFang SC, PingFang SC-Medium;
+      font-weight: Medium;
+      text-align: center;
+      color: #333333;
+      line-height: 40px;
+    }
   }
 
   .right-card{
@@ -317,8 +350,6 @@ function switchTab(type: number) {
     padding-top: 48px;
 
     .title{
-      width: 80px;
-      height: 22px;
       font-size: 20px;
       font-family: PingFang SC, PingFang SC-Medium;
       font-weight: Medium;
@@ -327,11 +358,49 @@ function switchTab(type: number) {
       line-height: 22px;
     }
 
-    .line{
-      width: 232px;
-      height: 1px;
-      border: 1px solid #eeeeee;
+    .form{
       margin: 0 auto;
+      margin-top: 32px;
+      width: 235px;
+      padding: 24px 0;
+      border-top: 1px solid #eeeeee;
+      border-bottom: 1px solid #eeeeee;
+    }
+
+    .form-item{
+      align-items: center;
+      margin-bottom: 16px;
+    }
+
+    .margin-no{
+      margin: 0;
+    }
+
+    .icon{
+      width: 16px;
+      height: 16px;
+      margin-right: 8px;
+    }
+
+    .label{
+      width: 70px;
+      font-size: 14px;
+      font-family: PingFang SC, PingFang SC-Regular;
+      font-weight: Regular;
+      text-align: left;
+      color: #666666;
+    }
+
+    .value{
+      font-size: 14px;
+      font-family: PingFang SC, PingFang SC-Regular;
+      font-weight: Regular;
+      text-align: left;
+      color: #333333;
+    }
+
+    .time{
+      color: #1d2129;
     }
   }
 
diff --git a/src/views/message/index.vue b/src/views/message/index.vue
index ed865b0..a97352b 100644
--- a/src/views/message/index.vue
+++ b/src/views/message/index.vue
@@ -10,8 +10,8 @@ import Detail from './content/Detail.vue'
     <!-- <Aside /> -->
 
     <!-- 内容 -->
-    <!-- <Content /> -->
-    <Detail />
+    <Content />
+    <!-- <Detail /> -->
   </div>
 </template>