add bi
This commit is contained in:
parent
c01c90ec32
commit
0e04941e65
Binary file not shown.
@ -5,10 +5,10 @@
|
||||
<link rel="icon" href="/favicon.ico">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Vite App</title>
|
||||
<script type="module" crossorigin src="/static/js/index-DeMa4Gf_.js"></script>
|
||||
<link rel="modulepreload" crossorigin href="/static/js/vendor-yjVdc_EO.js">
|
||||
<link rel="stylesheet" crossorigin href="/static/css/vendor-xHoP3d6v.css">
|
||||
<link rel="stylesheet" crossorigin href="/static/css/index-BVwr4Ijb.css">
|
||||
<script type="module" crossorigin src="/static/js/index-DDz3nIfx.js"></script>
|
||||
<link rel="modulepreload" crossorigin href="/static/js/vendor-DP_UVbSV.js">
|
||||
<link rel="stylesheet" crossorigin href="/static/css/vendor-D5tQWdZX.css">
|
||||
<link rel="stylesheet" crossorigin href="/static/css/index-Djk1dA8i.css">
|
||||
</head>
|
||||
<body>
|
||||
<div id="app"></div>
|
||||
|
1
admin/ui/static/static/css/history-G7P9yLzC.css
Normal file
1
admin/ui/static/static/css/history-G7P9yLzC.css
Normal file
@ -0,0 +1 @@
|
||||
.app-content[data-v-926d7759]{height:calc(100vh - 100px);display:flex}.app-content .table-content[data-v-926d7759]{display:flex;flex-direction:column;justify-content:space-between;height:100%;overflow:auto}.app-content .table-content .table[data-v-926d7759]{flex:1;position:relative}.app-content .table-content .table[data-v-926d7759] .el-table{flex:1;position:absolute}.app-content1[data-v-926d7759]{height:calc(100vh - 300px);display:flex}.app-content1 .table-content[data-v-926d7759]{display:flex;flex-direction:column;justify-content:space-between;overflow:auto}.app-content1 .table-content .table[data-v-926d7759]{flex:1;position:relative}.app-content1 .table-content .table[data-v-926d7759] .el-table{flex:1;position:absolute}.pagination-container .el-pagination[data-v-926d7759]{right:0;position:absolute;height:25px;margin-bottom:50px;margin-top:0;padding:10px 30px!important;z-index:2}.pagination-container.hidden[data-v-926d7759]{display:none}@media (max-width: 768px){.pagination-container .el-pagination>.el-pagination__jump[data-v-926d7759]{display:none!important}.pagination-container .el-pagination>.el-pagination__sizes[data-v-926d7759]{display:none!important}}
|
1
admin/ui/static/static/css/index-Djk1dA8i.css
Normal file
1
admin/ui/static/static/css/index-Djk1dA8i.css
Normal file
@ -0,0 +1 @@
|
||||
body{height:100%;margin:0;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;font-family:Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Arial,sans-serif;background:gray}label{font-weight:700}html{height:100%;box-sizing:border-box}#app{height:100%}*,*:before,*:after{box-sizing:inherit}h1[data-v-5d4ddea2]{color:#333;text-align:center;margin-bottom:20px}.app-container[data-v-5d4ddea2]{height:100vh;overflow:hidden}.app-container .app-sidebar[data-v-5d4ddea2]{position:fixed;left:0;top:0;bottom:0;width:200px;z-index:1000;overflow-y:auto;box-shadow:2px 0 6px #0000001a;background-color:#4d4f52}.app-container .app-sidebar .sidebar-content[data-v-5d4ddea2]{overflow-y:auto}.app-container .app-container-right[data-v-5d4ddea2]{min-height:100vh;margin-left:200px;flex-direction:column}.app-container .app-container-right .app-header[data-v-5d4ddea2]{height:60px;background:#fff;border-bottom:1px solid #e6e6e6;box-shadow:0 1px 4px #0000001a}.app-container .app-container-right .app-main[data-v-5d4ddea2]{height:calc(100vh - 70px);flex:1;padding:20px;background:#f0f2f5}.sidebar-logo[data-v-5d4ddea2]{display:flex;align-items:center;padding:20px 0;text-align:center;background:transparent;position:relative;z-index:1;cursor:pointer}.sidebar-logo .logo[data-v-5d4ddea2]{width:50px;height:50px;margin-bottom:10px;filter:drop-shadow(0 0 2px rgba(255,255,255,.5))}.sidebar-logo .system-name[data-v-5d4ddea2]{color:#ffffffe6;margin:0;font-size:15px;font-weight:500;letter-spacing:1px;text-shadow:1px 1px 2px rgba(0,0,0,.2)}.el-menu-vertical-demo[data-v-5d4ddea2]{flex:1;background-color:#4d4f52}[data-v-5d4ddea2] .el-menu-vertical-demo .el-menu-item,[data-v-5d4ddea2] .el-menu-vertical-demo .el-sub-menu{color:#fff;background-color:#4d4f52}[data-v-5d4ddea2] .el-menu-vertical-demo .el-sub-menu__title{color:#fff}[data-v-5d4ddea2] .el-menu-vertical-demo .el-menu-item:hover,[data-v-5d4ddea2] .el-menu-vertical-demo .el-sub-menu__title:hover{background-color:#1f2d3d}[data-v-5d4ddea2] .el-menu-vertical-demo .el-menu-item.is-active,[data-v-5d4ddea2] .el-menu-vertical-demo .el-sub-menu__title.is-active{background-color:#20b2aa;color:#fff}[data-v-5d4ddea2] .el-menu-vertical-demo .el-sub-menu__title i,[data-v-5d4ddea2] .el-menu-vertical-demo .el-menu-item i{margin-right:10px}.avatar-container[data-v-5d4ddea2]{height:50px;overflow:hidden;position:relative;float:right;background:#fff;box-shadow:0 1px 4px #00152914;margin-right:40px}.avatar-container .avatar-wrapper[data-v-5d4ddea2]{margin-top:5px;position:relative;align-items:center;cursor:pointer}.avatar-container .avatar-wrapper i[data-v-5d4ddea2]{cursor:pointer;position:absolute;right:-20px;top:25px;font-size:12px}
|
1
admin/ui/static/static/css/table-D-SuEeIF.css
Normal file
1
admin/ui/static/static/css/table-D-SuEeIF.css
Normal file
@ -0,0 +1 @@
|
||||
.roleDetailList[data-v-5a8d8958] .el-table__header-wrapper th{word-break:break-word;background-color:#f8f8f9!important;color:#515a6e;height:40px!important;font-size:13px}.roleDetailList[data-v-5a8d8958] .el-table__header .el-table-column--selection .cell{width:60px!important}.roleDetailList[data-v-5a8d8958] .el-table .fixed-width .el-button--small{padding-left:0;padding-right:0;width:20px!important}.roleDetailList[data-v-5a8d8958] .el-table__header{background:#f5f7fa!important}.roleDetailList[data-v-5a8d8958] .el-table__row td{border-color:#ebeef5}.app-content[data-v-bff8d31d]{height:calc(100vh - 100px);display:flex}.app-content .table-content[data-v-bff8d31d]{display:flex;flex-direction:column;justify-content:space-between;height:100%;overflow:auto}.app-content .table-content .table[data-v-bff8d31d]{flex:1;position:relative}.app-content .table-content .table[data-v-bff8d31d] .el-table{flex:1;position:absolute}.app-content .table-content .table[data-v-bff8d31d] .el-popper{max-width:640px;word-break:break-all}.pagination-container .el-pagination[data-v-bff8d31d]{right:0;position:absolute;height:25px;margin-bottom:50px;margin-top:0;padding:10px 30px!important;z-index:2}.pagination-container.hidden[data-v-bff8d31d]{display:none}@media (max-width: 768px){.pagination-container .el-pagination>.el-pagination__jump[data-v-bff8d31d]{display:none!important}.pagination-container .el-pagination>.el-pagination__sizes[data-v-bff8d31d]{display:none!important}}
|
1
admin/ui/static/static/css/vendor-D5tQWdZX.css
Normal file
1
admin/ui/static/static/css/vendor-D5tQWdZX.css
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/Login-CE2t41HH.js
Normal file
1
admin/ui/static/static/js/Login-CE2t41HH.js
Normal file
@ -0,0 +1 @@
|
||||
import{r as e,a9 as a,a as s,o,d as r,b as l,w as n,_ as t,a1 as u,aa as d,U as i,y as p,Z as m,a7 as c,J as v}from"./vendor-DP_UVbSV.js";import{_ as f,u as _,r as g}from"./index-DDz3nIfx.js";const y={class:"login-box"},h={class:c({container:!0,animate__animated:!0,animate__flipInX:!0})},w={class:"form-container sign-in-container"},b=f({__name:"Login",setup(c){e(void 0);const{proxy:f}=a(),b=e({user:"",password:""}),V={user:[{required:!0,trigger:"blur",message:"请输入您的账号"}],password:[{required:!0,trigger:"blur",message:"请输入您的密码"}]},x=e=>{e&&f.$refs.ruleFormRef.validate((e=>{if(!e)return console.log("error submit!"),!1;_().login(b.value.user,b.value.password).then((()=>{console.log("登录成功,推送首页。。"),g.push({path:"/welcome"})}),(e=>{})).catch((()=>{v.error("login response error")}))}))};return(e,a)=>{const c=u,v=t,f=i,_=m;return o(),s("div",y,[r("div",h,[r("div",w,[l(_,{ref:"ruleFormRef",model:b.value,"status-icon":"",rules:V,class:"form"},{default:n((()=>[l(v,{class:"form-item",prop:"username"},{default:n((()=>[l(c,{modelValue:b.value.user,"onUpdate:modelValue":a[0]||(a[0]=e=>b.value.user=e),placeholder:"用户名",autocomplete:"off",onKeyup:a[1]||(a[1]=d((e=>x(b.value)),["enter"]))},null,8,["modelValue"])])),_:1}),l(v,{class:"form-item",prop:"password"},{default:n((()=>[l(c,{modelValue:b.value.password,"onUpdate:modelValue":a[2]||(a[2]=e=>b.value.password=e),placeholder:"密码",type:"password",autocomplete:"off",onKeyup:a[3]||(a[3]=d((e=>x(b.value)),["enter"]))},null,8,["modelValue"])])),_:1}),l(f,{class:"theme-button",type:"primary",onClick:a[4]||(a[4]=e=>x(b.value)),onKeydown:a[5]||(a[5]=d((e=>{var a;13!==a.keyCode&&100!==a.keyCode||x(b.value)}),["enter"]))},{default:n((()=>a[6]||(a[6]=[p("登 陆 ")]))),_:1})])),_:1},8,["model"])]),a[7]||(a[7]=r("div",{class:"overlay_container"},[r("div",{class:"overlay"},[r("div",{class:"overlay_panel overlay_right_container"},[r("h2",{class:"container-title"},"hello friend!"),r("p",null,"输入您的个人信息,以便使用后台管理系统")])])],-1))])])}}},[["__scopeId","data-v-68d4afe9"]]);export{b as default};
|
1
admin/ui/static/static/js/character-DVWAo7FQ.js
Normal file
1
admin/ui/static/static/js/character-DVWAo7FQ.js
Normal file
@ -0,0 +1 @@
|
||||
import{t as e}from"./tableUser-Gptb-_sJ.js";import{u as r,l as t}from"./index-DDz3nIfx.js";import{a as s,o as a,c as o,x as c}from"./vendor-DP_UVbSV.js";import"./resource-BheMLjer.js";import"./empty-CyOOHAV7.js";const m={__name:"character",setup(m){let u={meta:{desc:"character",resource:"character",resource_url:"/resource/character",methods:{get:!0,post:!0,put:!0,delete:!0}}};return"admin"!==r().userInfo.character&&(u.meta.methods={}),t.setCache("resource",u),(r,t)=>(a(),s("div",null,[(a(),o(c(e)))]))}};export{m as default};
|
1
admin/ui/static/static/js/empty-CyOOHAV7.js
Normal file
1
admin/ui/static/static/js/empty-CyOOHAV7.js
Normal file
@ -0,0 +1 @@
|
||||
import{c as o,o as r,ae as s}from"./vendor-DP_UVbSV.js";import{_ as e}from"./index-DDz3nIfx.js";const n=e({},[["render",function(e,n){const t=s;return r(),o(t,{description:"没有权限!请联系管理员添加权限!"})}]]);export{n as e};
|
1
admin/ui/static/static/js/history-BkxdSjBU.js
Normal file
1
admin/ui/static/static/js/history-BkxdSjBU.js
Normal file
@ -0,0 +1 @@
|
||||
import{r as e,S as a,a as l,o as t,c as o,u,x as n,F as s,T as p,w as r,b as d,A as i,a5 as v,a1 as m,a6 as c,U as y,y as g,G as h,d as f,V as x,W as V,X as b,z as w,a7 as I}from"./vendor-DP_UVbSV.js";import{_ as k,u as _,a as C}from"./index-DDz3nIfx.js";import{e as U}from"./empty-CyOOHAV7.js";const z={class:"table-content"},j={class:"table"},R={class:"pagination-container"},S=k({__name:"history",props:{rowInfo:{},disableConditionInput:!0},setup(k){const S=k;let A=!0;!1===S.disableConditionInput&&(A=!1);const D="admin"===_().userInfo.character,G=e(D),T=e(1),F=e(20),K=e(S.userId);S.rowInfo&&void 0!==S.rowInfo.ID&&(K.value=S.rowInfo.ID);const N=e(""),P=e(""),W=e(""),X=e(""),q=e(!1),B=[20,50,100],E=e(0),H=e([]),J=()=>{C(T.value,F.value,K.value,N.value,P.value,W.value,X.value).then((e=>{H.value=e.data.list,E.value=e.data.totalCount,q.value=!0}),(e=>{}))};a((()=>{J()}));const L=()=>{K.value="",N.value="",P.value="",W.value="",X.value=""},M=e=>{E.value<=0||F.value*T.value>E.value&&H.value.length>=E.value||J()},O=e=>{J()};return(e,a)=>{const k=m,_=y,C=v,S=i,D=V,Q=x,Y=b,Z=h,$=w;return t(),l("div",{class:I(u(A)?"app-content1":"app-content")},[u(G)?(t(),l(s,{key:1},[u(q)?(t(),o($,{key:0},{default:r((()=>[d(S,{style:{"margin-bottom":"10px"}},{default:r((()=>[d(C,null,{default:r((()=>[!1===u(A)?(t(),o(k,{key:0,modelValue:u(K),"onUpdate:modelValue":a[0]||(a[0]=e=>c(K)?K.value=e:null),placeholder:"用户id",style:{width:"150px","margin-right":"10px"}},null,8,["modelValue"])):p("",!0),!1===u(A)?(t(),o(k,{key:1,modelValue:u(N),"onUpdate:modelValue":a[1]||(a[1]=e=>c(N)?N.value=e:null),placeholder:"操作资源类型",style:{width:"150px","margin-right":"10px"}},null,8,["modelValue"])):p("",!0),!1===u(A)?(t(),o(k,{key:2,modelValue:u(P),"onUpdate:modelValue":a[2]||(a[2]=e=>c(P)?P.value=e:null),placeholder:"操作资源组",style:{width:"150px","margin-right":"10px"}},null,8,["modelValue"])):p("",!0),!1===u(A)?(t(),o(k,{key:3,modelValue:u(W),"onUpdate:modelValue":a[3]||(a[3]=e=>c(W)?W.value=e:null),placeholder:"操作对象",style:{width:"150px","margin-right":"10px"}},null,8,["modelValue"])):p("",!0),!1===u(A)?(t(),o(k,{key:4,modelValue:u(X),"onUpdate:modelValue":a[4]||(a[4]=e=>c(X)?X.value=e:null),placeholder:"操作方法",style:{width:"150px","margin-right":"10px"}},null,8,["modelValue"])):p("",!0),!1===u(A)?(t(),o(_,{key:5,onClick:J,type:"primary",style:{"margin-right":"10px"}},{default:r((()=>a[7]||(a[7]=[g("条件搜索 ")]))),_:1})):p("",!0),!1===u(A)?(t(),o(_,{key:6,onClick:L},{default:r((()=>a[8]||(a[8]=[g("清空条件")]))),_:1})):p("",!0)])),_:1})])),_:1}),d(Z,null,{default:r((()=>[f("div",z,[f("div",j,[d(Q,{data:u(H),style:{width:"100%"},"table-layout":"auto",stripe:"","tooltip-effect":"light"},{default:r((()=>[d(D,{prop:"userId",label:"用户id"}),d(D,{prop:"userName",label:"用户名"}),d(D,{prop:"opResourceType",label:"操作资源类型"}),d(D,{prop:"opResourceGroup",label:"操作资源组"}),d(D,{prop:"opResourceKey",label:"操作对象"}),d(D,{prop:"method",label:"操作方法"}),d(D,{prop:"createdAt",label:"创建时间"}),d(D,{prop:"detailInfo",label:"详情数据","show-overflow-tooltip":""})])),_:1},8,["data"])]),f("div",R,[d(Y,{"current-page":u(T),"onUpdate:currentPage":a[5]||(a[5]=e=>c(T)?T.value=e:null),"page-size":u(F),"onUpdate:pageSize":a[6]||(a[6]=e=>c(F)?F.value=e:null),"page-sizes":B,layout:"total, sizes, prev, pager, next, jumper",total:u(E),onSizeChange:M,onCurrentChange:O},null,8,["current-page","page-size","total"])])])])),_:1})])),_:1})):p("",!0)],64)):(t(),o(n(U),{key:0}))],2)}}},[["__scopeId","data-v-926d7759"]]);export{S as t};
|
1
admin/ui/static/static/js/history-gshJkhLz.js
Normal file
1
admin/ui/static/static/js/history-gshJkhLz.js
Normal file
@ -0,0 +1 @@
|
||||
import{t as s}from"./history-BkxdSjBU.js";import{c as o,o as t,x as e}from"./vendor-DP_UVbSV.js";import"./index-DDz3nIfx.js";import"./empty-CyOOHAV7.js";const i={__name:"history",setup:i=>(i,r)=>(t(),o(e(s),{disableConditionInput:false}))};export{i as default};
|
2
admin/ui/static/static/js/index-DDz3nIfx.js
Normal file
2
admin/ui/static/static/js/index-DDz3nIfx.js
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/project-Sy941gbA.js
Normal file
1
admin/ui/static/static/js/project-Sy941gbA.js
Normal file
@ -0,0 +1 @@
|
||||
import{t as e}from"./table-C3U4vmQf.js";import{l as s,u as a,c as r}from"./index-DDz3nIfx.js";import{i as t,a as o,o as m,c,x as p}from"./vendor-DP_UVbSV.js";import"./resource-BheMLjer.js";import"./empty-CyOOHAV7.js";const i={__name:"project",setup(i){s.setCache("project",{}),t();let n=r;return"admin"!==a().userInfo.character&&(n.meta.methods={}),s.setCache("resource",n),(s,a)=>(m(),o("div",null,[(m(),c(p(e)))]))}};export{i as default};
|
1
admin/ui/static/static/js/project_op-C-AB3DOA.js
Normal file
1
admin/ui/static/static/js/project_op-C-AB3DOA.js
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/resource-BheMLjer.js
Normal file
1
admin/ui/static/static/js/resource-BheMLjer.js
Normal file
@ -0,0 +1 @@
|
||||
import{s as t}from"./index-DDz3nIfx.js";function r(r,e){return t({url:r,method:"get",params:e})}function e(r,e){return t({url:r,method:"post",data:{dto:e}})}function o(r,e){return t({url:r,method:"put",data:{dto:e}})}function n(r,e){return t({url:r,method:"delete",data:e})}function u(r,e){return t({url:r+"/selection",method:"post",data:e})}function a(r){return t({url:"/project/"+r.toString()+"/items",method:"get"})}export{n as a,e as b,o as c,a as d,u as e,r};
|
1
admin/ui/static/static/js/table-C3U4vmQf.js
Normal file
1
admin/ui/static/static/js/table-C3U4vmQf.js
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/tableUser-Gptb-_sJ.js
Normal file
1
admin/ui/static/static/js/tableUser-Gptb-_sJ.js
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/user-BgQZu9kV.js
Normal file
1
admin/ui/static/static/js/user-BgQZu9kV.js
Normal file
@ -0,0 +1 @@
|
||||
import{t as e}from"./tableUser-Gptb-_sJ.js";import{u as s,l as r}from"./index-DDz3nIfx.js";import{t}from"./history-BkxdSjBU.js";import{a as o,o as a,c,x as m}from"./vendor-DP_UVbSV.js";import"./resource-BheMLjer.js";import"./empty-CyOOHAV7.js";const u={__name:"user",setup(u){let n={meta:{desc:"user",resource:"user",resource_url:"/resource/user",methods:{get:!0,post:!0,put:!0,delete:!0}}};"admin"!==s().userInfo.character&&(n.meta.methods={}),r.setCache("resource",n);const p=[];return p.push({key:"user:exec:history",name:"执行记录",btn_color_type:"info",btn_type:1,btn_callback_component:t}),(s,r)=>(a(),o("div",null,[(a(),c(m(e),{rowClickDialogBtns:p}))]))}};export{u as default};
|
52
admin/ui/static/static/js/vendor-DP_UVbSV.js
Normal file
52
admin/ui/static/static/js/vendor-DP_UVbSV.js
Normal file
File diff suppressed because one or more lines are too long
1
admin/ui/static/static/js/welcome-C7ftN4QV.js
Normal file
1
admin/ui/static/static/js/welcome-C7ftN4QV.js
Normal file
@ -0,0 +1 @@
|
||||
import{a as s,o as a,d as e,b as n,y as t,t as o,u as r,a8 as p,F as l}from"./vendor-DP_UVbSV.js";import{u}from"./index-DDz3nIfx.js";const f={style:{"font-size":"40px"}},i={style:{color:"darkslategrey","font-size":"50px"}},m={__name:"welcome",setup(m){const c=u().userInfo;return(u,m)=>{const d=p;return a(),s(l,null,[e("span",f,[m[0]||(m[0]=t("亲爱的")),e("span",i,o(r(c).nick_name),1),m[1]||(m[1]=t("!欢迎使用本公司后台管理系统!"))]),n(d),m[2]||(m[2]=e("span",{style:{"font-size":"40px"}},"硬盘有价,数据无价,操作不规范,亲人两行泪。",-1))],64)}}};export{m as default};
|
61
ui/package-lock.json
generated
61
ui/package-lock.json
generated
@ -8,7 +8,9 @@
|
||||
"name": "ui",
|
||||
"version": "0.0.0",
|
||||
"dependencies": {
|
||||
"@ant-design/icons-vue": "^7.0.1",
|
||||
"axios": "^1.8.4",
|
||||
"echarts": "^5.6.0",
|
||||
"element-plus": "^2.9.7",
|
||||
"pinia": "^3.0.1",
|
||||
"pinia-plugin-persistedstate": "^4.2.0",
|
||||
@ -43,6 +45,34 @@
|
||||
"node": ">=6.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ant-design/colors": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/colors/-/colors-6.0.0.tgz",
|
||||
"integrity": "sha512-qAZRvPzfdWHtfameEGP2Qvuf838NhergR35o+EuVyB5XvSA98xod5r4utvi4TJ3ywmevm290g9nsCG5MryrdWQ==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@ctrl/tinycolor": "^3.4.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@ant-design/icons-svg": {
|
||||
"version": "4.4.2",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-svg/-/icons-svg-4.4.2.tgz",
|
||||
"integrity": "sha512-vHbT+zJEVzllwP+CM+ul7reTEfBR0vgxFe7+lREAsAA7YGsYpboiq2sQNeQeRvh09GfQgs/GyFEvZpJ9cLXpXA==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@ant-design/icons-vue": {
|
||||
"version": "7.0.1",
|
||||
"resolved": "https://registry.npmmirror.com/@ant-design/icons-vue/-/icons-vue-7.0.1.tgz",
|
||||
"integrity": "sha512-eCqY2unfZK6Fe02AwFlDHLfoyEFreP6rBwAZMIJ1LugmfMiVgwWDYlp1YsRugaPtICYOabV1iWxXdP12u9U43Q==",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@ant-design/colors": "^6.0.0",
|
||||
"@ant-design/icons-svg": "^4.2.1"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"vue": ">=3.0.3"
|
||||
}
|
||||
},
|
||||
"node_modules/@antfu/install-pkg": {
|
||||
"version": "1.0.0",
|
||||
"resolved": "https://registry.npmmirror.com/@antfu/install-pkg/-/install-pkg-1.0.0.tgz",
|
||||
@ -2681,6 +2711,22 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/echarts": {
|
||||
"version": "5.6.0",
|
||||
"resolved": "https://registry.npmmirror.com/echarts/-/echarts-5.6.0.tgz",
|
||||
"integrity": "sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==",
|
||||
"license": "Apache-2.0",
|
||||
"dependencies": {
|
||||
"tslib": "2.3.0",
|
||||
"zrender": "5.6.1"
|
||||
}
|
||||
},
|
||||
"node_modules/echarts/node_modules/tslib": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
|
||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
|
||||
"license": "0BSD"
|
||||
},
|
||||
"node_modules/electron-to-chromium": {
|
||||
"version": "1.5.137",
|
||||
"resolved": "https://registry.npmmirror.com/electron-to-chromium/-/electron-to-chromium-1.5.137.tgz",
|
||||
@ -5463,6 +5509,21 @@
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/zrender": {
|
||||
"version": "5.6.1",
|
||||
"resolved": "https://registry.npmmirror.com/zrender/-/zrender-5.6.1.tgz",
|
||||
"integrity": "sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==",
|
||||
"license": "BSD-3-Clause",
|
||||
"dependencies": {
|
||||
"tslib": "2.3.0"
|
||||
}
|
||||
},
|
||||
"node_modules/zrender/node_modules/tslib": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmmirror.com/tslib/-/tslib-2.3.0.tgz",
|
||||
"integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
|
||||
"license": "0BSD"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -9,7 +9,9 @@
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"dependencies": {
|
||||
"@ant-design/icons-vue": "^7.0.1",
|
||||
"axios": "^1.8.4",
|
||||
"echarts": "^5.6.0",
|
||||
"element-plus": "^2.9.7",
|
||||
"pinia": "^3.0.1",
|
||||
"pinia-plugin-persistedstate": "^4.2.0",
|
||||
|
@ -13,6 +13,7 @@ import router from './router'
|
||||
import * as ElementPlusIconsVue from '@element-plus/icons-vue'
|
||||
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate';
|
||||
import './permission'
|
||||
import * as echarts from 'echarts'
|
||||
|
||||
const pinia = createPinia();
|
||||
pinia.use(piniaPluginPersistedstate);
|
||||
@ -26,7 +27,11 @@ for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
|
||||
app.use(ElementPlus, {
|
||||
locale: locale,
|
||||
})
|
||||
|
||||
app.use(pinia)
|
||||
|
||||
app.config.globalProperties.$echarts = echarts
|
||||
|
||||
app.use(router)
|
||||
|
||||
app.mount('#app')
|
||||
|
5
ui/src/utils/time.js
Normal file
5
ui/src/utils/time.js
Normal file
@ -0,0 +1,5 @@
|
||||
export function getTodayBegin() {
|
||||
const cur = new Date();
|
||||
cur.setHours(0, 0, 0, 0);
|
||||
return cur;
|
||||
}
|
@ -0,0 +1,11 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
95
ui/src/views/bi/analyse/components/toolbar/dateDayRanger.vue
Normal file
95
ui/src/views/bi/analyse/components/toolbar/dateDayRanger.vue
Normal file
@ -0,0 +1,95 @@
|
||||
<script setup>
|
||||
import {ref, onMounted, nextTick, watchEffect} from 'vue';
|
||||
import {getTodayBegin} from "@/utils/time.js";
|
||||
|
||||
const value1 = ref('');
|
||||
|
||||
const pass7DaysStart = getTodayBegin()
|
||||
pass7DaysStart.setTime(pass7DaysStart.getTime() - 3600 * 1000 * 24 * 7)
|
||||
const pass7DaysEnd = getTodayBegin()
|
||||
const defaultPast7DaysTime = ref([pass7DaysStart, pass7DaysEnd])
|
||||
|
||||
watchEffect(() => {
|
||||
console.log(`选择日期范围:${value1.value[0]} 到 ${value1.value[1]}`)
|
||||
// console.log(value1.value, "====点击获得值====");
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// nextTick(() => {
|
||||
// // 处理出现闪现问题
|
||||
// var element = document.querySelector('body');
|
||||
// element.addEventListener('click', () => {
|
||||
// });
|
||||
// element.click();
|
||||
// });
|
||||
});
|
||||
|
||||
|
||||
const shortcuts = [
|
||||
{
|
||||
text: "昨日",
|
||||
value: () => {
|
||||
const start = getTodayBegin()
|
||||
const end = getTodayBegin()
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24)
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "今日",
|
||||
value: () => {
|
||||
const start = getTodayBegin()
|
||||
const end = getTodayBegin()
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "过去7天",
|
||||
value: () => {
|
||||
return [pass7DaysStart, pass7DaysEnd]
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "本月",
|
||||
value: () => {
|
||||
const start = getTodayBegin()
|
||||
const end = getTodayBegin()
|
||||
start.setDate(1)
|
||||
return [start, end]
|
||||
},
|
||||
},
|
||||
]
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="timeRangePicker">
|
||||
<el-date-picker
|
||||
:teleported="false"
|
||||
v-model="value1"
|
||||
type="daterange"
|
||||
range-separator="到"
|
||||
start-placeholder="Start date"
|
||||
end-placeholder="End date"
|
||||
:shortcuts="shortcuts"
|
||||
:default-time="defaultPast7DaysTime"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="scss">
|
||||
.timeRangePicker .el-input__wrapper {
|
||||
width: 0;
|
||||
height: 0;
|
||||
display: none;
|
||||
}
|
||||
|
||||
.timeRangePicker .el-popper {
|
||||
display: block !important;
|
||||
transition: none !important;
|
||||
position: initial !important;
|
||||
}
|
||||
|
||||
.el-picker__popper.el-popper .el-popper__arrow:before {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
@ -1,52 +1,157 @@
|
||||
<script setup>
|
||||
import {ref, onMounted, nextTick, watchEffect} from 'vue'
|
||||
import dateDayRanger from './dateDayRanger.vue'
|
||||
|
||||
const value = ref('按天')
|
||||
|
||||
const timeDivideSelect = [
|
||||
{
|
||||
name: "按分钟",
|
||||
label: "按天",
|
||||
value: "按天"
|
||||
},
|
||||
{
|
||||
label: "按分钟",
|
||||
value: "按分钟",
|
||||
children: [
|
||||
{name: "1分钟"},
|
||||
{name: "5分钟"},
|
||||
{name: "10分钟"},
|
||||
{label: "1分钟", value: "1分钟"},
|
||||
{label: "5分钟", value: "5分钟"},
|
||||
{label: "10分钟", value: "10分钟"},
|
||||
]
|
||||
},
|
||||
{
|
||||
name: "按小时"
|
||||
label: "按小时",
|
||||
value: "按小时",
|
||||
},
|
||||
{
|
||||
name: "按天"
|
||||
label: "按周",
|
||||
value: "按周",
|
||||
},
|
||||
{
|
||||
name: "按周"
|
||||
label: "按月",
|
||||
value: "按月",
|
||||
},
|
||||
{
|
||||
name: "按月"
|
||||
label: "按季度",
|
||||
value: "按季度",
|
||||
},
|
||||
{
|
||||
name: "按季度"
|
||||
label: "按年",
|
||||
value: "按年",
|
||||
},
|
||||
{
|
||||
name: "按年"
|
||||
},
|
||||
{
|
||||
name: "合计"
|
||||
label: "合计",
|
||||
value: "合计",
|
||||
}
|
||||
]
|
||||
|
||||
|
||||
const timePickerRangeDesc = ref('今日')
|
||||
|
||||
const openTimeRange = () => {
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div>
|
||||
<el-select>
|
||||
<template v-for="item in timeDivideSelect">
|
||||
<el-option :key="item.name" :label="item.name" :value="item.value" v-if="item.children !== undefined">
|
||||
<
|
||||
</el-option>
|
||||
<div class="dateDaySelect clearfix">
|
||||
<el-cascader popperClass="cascaderPopper" v-model="value" :options="timeDivideSelect"
|
||||
:show-all-levels="false" :props="{expandTrigger: 'hover',emitPath: false}">
|
||||
<template v-slot:default="{data}">
|
||||
<span :title="data.label">{{ data.value }}</span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
|
||||
<!--Calendar-->
|
||||
<el-popover placement="bottom-start" trigger="click" :width="800" @click="openTimeRange"
|
||||
popper-style="box-shadow: rgb(14 18 22 / 35%) 0px 10px 38px -10px, rgb(14 18 22 / 20%) 0px 10px 20px -15px; padding: 0px;">
|
||||
<template #reference>
|
||||
<el-button style="margin-left: 10px">
|
||||
<p style="margin-right: 10px">
|
||||
{{ timePickerRangeDesc }}
|
||||
</p>
|
||||
<el-icon class="el-icon--right">
|
||||
<Calendar/>
|
||||
</el-icon>
|
||||
</el-button>
|
||||
</template>
|
||||
|
||||
</el-select>
|
||||
<template #default>
|
||||
<div class="timePickerPane">
|
||||
<el-row>日期范围</el-row>
|
||||
<el-row>
|
||||
<!-- <el-row>-->
|
||||
<!-- <el-row :gutter="20" align="middle">-->
|
||||
<!-- <el-input class="timeRangeInput"></el-input>-->
|
||||
<!-- <span class="ml-3 w-35 text-gray-600 inline-flex items-center">天前</span>-->
|
||||
<!-- <el-icon>-->
|
||||
<!-- <Right/>-->
|
||||
<!-- </el-icon>-->
|
||||
<!-- <el-input class="timeRangeInput"></el-input>-->
|
||||
<!-- <span class="ml-3 w-35 text-gray-600 inline-flex items-center">天前</span>-->
|
||||
<!-- </el-row>-->
|
||||
<!-- </el-row>-->
|
||||
<dateDayRanger/>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
</el-popover>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
<style lang="scss">
|
||||
|
||||
.el-cascader {
|
||||
width: 120px;
|
||||
min-width: 120px;
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
.cascaderPopper .el-cascader-panel .el-cascader-menu {
|
||||
width: 120px;
|
||||
min-width: 120px;
|
||||
max-width: 120px;
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
||||
.clearfix::after {
|
||||
content: "";
|
||||
display: block;
|
||||
clear: both; /*清除元素左右两侧浮动的属性*/
|
||||
}
|
||||
|
||||
.dateDaySelect {
|
||||
display: inline-flex;
|
||||
flex-direction: row;
|
||||
//border: 1px solid red;
|
||||
}
|
||||
|
||||
.timePickerPane {
|
||||
display: flex;
|
||||
//width: 800px;
|
||||
//height: 400px;
|
||||
margin: 5px;
|
||||
flex-direction: column;
|
||||
//border: 1px solid red;
|
||||
}
|
||||
|
||||
.timePickerRangeResultPane {
|
||||
height: 50px;
|
||||
border-bottom: 1px solid gray;
|
||||
}
|
||||
|
||||
.timePickerPreSpecPane {
|
||||
width: 200px;
|
||||
border-right: 1px solid gray;
|
||||
}
|
||||
|
||||
.timeRangeInput {
|
||||
width: 50px;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
</style>
|
@ -26,6 +26,9 @@ const layoutResult = defineAsyncComponent(() => import("./analyseMainContentRigh
|
||||
.resultToolbar {
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #f0f2f5;
|
||||
}
|
||||
|
||||
|
@ -1,11 +1,130 @@
|
||||
<script setup>
|
||||
|
||||
// 引入 Vue 的 Composition API
|
||||
import {ref, onMounted, onBeforeUnmount} from 'vue'
|
||||
// 引入 echarts 库
|
||||
import * as echarts from 'echarts'
|
||||
|
||||
|
||||
// 获取 DOM 元素的引用(用于初始化图表)
|
||||
const chartRef = ref(null)
|
||||
// 存储 ECharts 实例
|
||||
let chartInstance = null
|
||||
|
||||
// 初始化图表的方法
|
||||
const initChart = () => {
|
||||
if (chartRef.value) {
|
||||
// 初始化 echarts 实例
|
||||
chartInstance = echarts.init(chartRef.value)
|
||||
|
||||
// 配置项
|
||||
const option = {
|
||||
title: {
|
||||
text: '事件分析图' // 图表标题
|
||||
},
|
||||
tooltip: {}, // 默认提示框配置
|
||||
legend: {
|
||||
data: ['销量'] // 图例名称
|
||||
},
|
||||
xAxis: {
|
||||
data: ['衬衫', '羊毛衫', '雪纺衫', '裤子', '高跟鞋', '袜子'] // X 轴数据
|
||||
},
|
||||
yAxis: {}, // Y 轴默认配置
|
||||
series: [
|
||||
{
|
||||
name: '销量', // 系列名称
|
||||
type: 'bar', // 图表类型为柱状图
|
||||
data: [5, 20, 36, 10, 10, 20] // 数据值
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
// 使用配置项渲染图表
|
||||
chartInstance.setOption(option)
|
||||
}
|
||||
}
|
||||
|
||||
const testResultTable = ref([
|
||||
{
|
||||
metric: "APP关闭.总次数",
|
||||
stageAcc: "426",
|
||||
day20250530: "49",
|
||||
day20250531: "70",
|
||||
day20250601: "61",
|
||||
day20250602: "78",
|
||||
},
|
||||
{
|
||||
metric: "APP打开.总次数",
|
||||
stageAcc: "401",
|
||||
day20250530: "45",
|
||||
day20250531: "63",
|
||||
day20250601: "45",
|
||||
day20250602: "32",
|
||||
},
|
||||
])
|
||||
|
||||
// 窗口大小变化时调整图表尺寸
|
||||
const resizeChart = () => {
|
||||
chartInstance?.resize()
|
||||
}
|
||||
|
||||
// 组件挂载后执行初始化
|
||||
onMounted(() => {
|
||||
initChart()
|
||||
// 监听窗口大小变化事件以支持响应式
|
||||
window.addEventListener('resize', resizeChart)
|
||||
})
|
||||
|
||||
// 组件卸载前清理资源,防止内存泄漏
|
||||
onBeforeUnmount(() => {
|
||||
window.removeEventListener('resize', resizeChart)
|
||||
chartInstance?.dispose() // 销毁 echarts 实例
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
结果
|
||||
<div class="clearfix"
|
||||
style="width: 100%;text-align: center;display: flex;align-items: center;justify-content: center;">
|
||||
<div ref="chartRef" style="width: 100%; height: 400px;margin: 10px 0 0 10px"></div>
|
||||
</div>
|
||||
|
||||
<!--分隔线-->
|
||||
<div style="width: 100%;height: 1px;display: flex;align-items: center;justify-content: center;">
|
||||
<el-divider style="width: 90%;" content-position="center"></el-divider>
|
||||
</div>
|
||||
|
||||
<el-row style="margin-top: 10px;margin-bottom: 10px;margin-left: 10px">
|
||||
<el-col :span="6">
|
||||
<el-button-group>
|
||||
<el-button>合并</el-button>
|
||||
<el-button>平铺</el-button>
|
||||
</el-button-group>
|
||||
</el-col>
|
||||
<el-col :span="10" :offset="8">
|
||||
<el-button-group style="float: right;margin-right: 20px">
|
||||
<el-button>按日期</el-button>
|
||||
<el-button>阶段汇总配置</el-button>
|
||||
<el-button>导出</el-button>
|
||||
</el-button-group>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-table :data="testResultTable">
|
||||
<el-table-column prop="metric" label="指标"></el-table-column>
|
||||
<el-table-column prop="stageAcc" label="阶段汇总"></el-table-column>
|
||||
<el-table-column prop="day20250530" label="2025-05-30(五)"></el-table-column>
|
||||
<el-table-column prop="day20250531" label="2025-05-31(六)"></el-table-column>
|
||||
<el-table-column prop="day20250601" label="2025-06-01(日)"></el-table-column>
|
||||
<el-table-column prop="day20250602" label="2025-06-02(一)"></el-table-column>
|
||||
</el-table>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
.clearfix::after {
|
||||
content: "";
|
||||
display: block;
|
||||
clear: both; /*清除元素左右两侧浮动的属性*/
|
||||
}
|
||||
</style>
|
@ -1,11 +1,74 @@
|
||||
<script setup>
|
||||
|
||||
import dataDaySelect from '@/views/bi/analyse/components/toolbar/dateDaySelect.vue'
|
||||
|
||||
import {AreaChartOutlined, BarChartOutlined, PieChartOutlined} from '@ant-design/icons-vue';
|
||||
|
||||
const toolbarChartSwitchBtns = ref([{
|
||||
comp: AreaChartOutlined,
|
||||
desc: "趋势图",
|
||||
selected: true
|
||||
}, {
|
||||
comp: BarChartOutlined,
|
||||
desc: "上升图",
|
||||
selected: false
|
||||
}, {
|
||||
comp: PieChartOutlined,
|
||||
desc: "饼图",
|
||||
selected: false
|
||||
}]);
|
||||
|
||||
const clickChartSwitchBtn = (chartInfo, idx) => {
|
||||
toolbarChartSwitchBtns.value.forEach((item) => {
|
||||
item.selected = item.desc === chartInfo.desc;
|
||||
})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
头
|
||||
<el-row :gutter="20" align="middle" class="toolbarPane">
|
||||
<el-col :span="6">
|
||||
<dataDaySelect style="margin-left: 10px"/>
|
||||
</el-col>
|
||||
<el-col :span="6" :offset="12">
|
||||
<el-row style="height: 100%;" align="middle" justify="end">
|
||||
<el-tooltip v-for="(chartInfo,idx) in toolbarChartSwitchBtns" placement="top" effect="light"
|
||||
:content="chartInfo.desc">
|
||||
<el-button :disabled="chartInfo.selected" class="chartBtn"
|
||||
@click="clickChartSwitchBtn(chartInfo, idx)">
|
||||
<component :is="chartInfo.comp" class="chartIcon"></component>
|
||||
</el-button>
|
||||
</el-tooltip>
|
||||
</el-row>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
<style scoped lang="scss">
|
||||
|
||||
.toolbarPane {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.chartBtn {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin: 0;
|
||||
border-radius: 0;
|
||||
}
|
||||
|
||||
.chartBtn:nth-child(1) {
|
||||
border-radius: 5px 0 0 5px;
|
||||
}
|
||||
|
||||
.chartBtn:last-child {
|
||||
border-radius: 0 5px 5px 0;
|
||||
}
|
||||
|
||||
.chartIcon {
|
||||
font-size: 24px;
|
||||
padding: 5px;
|
||||
}
|
||||
|
||||
</style>
|
@ -27,15 +27,19 @@
|
||||
</el-dropdown>
|
||||
</span>
|
||||
<span class="toolbarSpan">
|
||||
<el-icon size="20">
|
||||
<el-button>
|
||||
<el-icon size="20">
|
||||
<Refresh/>
|
||||
</el-icon>
|
||||
</span>
|
||||
</el-button>
|
||||
</span>
|
||||
<span class="toolbarSpan">
|
||||
<el-icon size="20">
|
||||
<el-button>
|
||||
<el-icon size="20">
|
||||
<Download/>
|
||||
</el-icon>
|
||||
</span>
|
||||
</el-button>
|
||||
</span>
|
||||
<span class="toolbarSpan">
|
||||
<el-button>已存报表</el-button>
|
||||
</span>
|
||||
|
Loading…
x
Reference in New Issue
Block a user