Yaxin
/
General-AI-Platform-Web
31
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: 按UI优化项目部署模块

Browse Source
develop
zhoux 1 year ago
parent 8f0fa7794b
commit 0ae7e00e05
8 changed files with 438 additions and 259 deletions
Show Stats Download Patch File Download Diff File

24
public/images/icons/logo.svg
Unescape Escape View File

@ -0,0 +1,24 @@
<svg width="64" height="24" viewBox="0 0 64 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<mask id="mask0_3180_54416" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="64" height="24">
<rect width="64" height="24" fill="#D9D9D9"/>
</mask>
<g mask="url(#mask0_3180_54416)">
<path d="M14.039 4.05812L11.9366 4.49908C11.8873 4.51252 11.8707 4.57396 11.9072 4.6098L13.5648 6.2674C13.6006 6.30324 13.6627 6.28724 13.6755 6.23796L14.1203 4.1394C14.1337 4.09012 14.0883 4.04532 14.039 4.05812Z" fill="#E42F2F"/>
<path d="M15.1781 2.93749L12.133 3.75349C12.0972 3.76309 12.0856 3.80789 12.1112 3.83413L14.3404 6.06325C14.3666 6.08949 14.4114 6.07733 14.421 6.04149L15.237 2.99637C15.2466 2.96053 15.214 2.92789 15.1781 2.93749Z" fill="#FAEC18"/>
<path d="M21.4489 12.7755L17.8688 9.19532L16.4736 7.80013C16.3801 7.70669 16.2284 7.70669 16.1344 7.80013L10.0608 13.8737C9.9494 13.9851 9.76828 13.9851 9.65692 13.8737L8.0006 12.2174C7.88924 12.106 7.88924 11.9249 8.0006 11.8136L13.0803 6.73388C13.1737 6.64044 13.1737 6.48877 13.0803 6.39469L11.7017 5.01612C11.6083 4.92268 11.4566 4.92268 11.3625 5.01612L4.47804 11.9019C4.3846 11.9953 4.3846 12.147 4.47804 12.2411L8.10108 15.8641L9.49628 17.2593C9.58972 17.3528 9.7414 17.3528 9.83548 17.2593L16.1657 10.9291C16.2771 10.8177 16.4582 10.8177 16.5696 10.9291L18.2259 12.5854C18.3372 12.6968 18.3372 12.8779 18.2259 12.9892L11.8956 19.3195C11.8022 19.4129 11.8022 19.5646 11.8956 19.6587L13.2313 20.9944C13.3248 21.0878 13.4764 21.0878 13.5705 20.9944L21.4496 13.1153C21.5424 13.0206 21.5424 12.8689 21.4489 12.7755Z" fill="#154DDD"/>
<path d="M33.2839 6.32767H32.0116V5.51871H29.5962V6.21951H28.3239V5.51871H26.1569L26.0596 4.41919H28.3239V3.58911H29.5962V4.41919H32.0116V3.58911H33.2839V4.41919H35.6884V5.51871H33.2839V6.32767ZM26.0596 11.0611L27.0087 8.64575H28.2164L27.3217 11.0611H26.0596ZM33.8445 11.6109C33.7581 12.441 33.2193 12.9587 32.3137 13.0125C31.785 13.0554 30.9441 12.9907 30.2433 12.8723L29.9629 11.8048C30.5882 11.9232 31.3217 11.9776 31.7633 11.945C32.281 11.9232 32.5287 11.6864 32.5613 11.2224C32.6369 10.2842 32.626 9.14111 32.5613 8.24639C32.5505 8.13887 32.5185 8.09535 32.4103 8.09535H30.5127C30.3725 10.6938 29.2621 11.977 26.5985 13.2819L26.2644 12.064C28.162 11.1046 29.0567 9.97247 29.2186 8.09599H26.8468L26.7604 7.01759H29.2404V6.30591H30.5345V7.01759H33.0144C33.5213 7.01759 33.8017 7.32991 33.8445 7.81567C33.8663 8.02047 33.8765 8.21439 33.8874 8.41983H35.0624L35.9252 11.072H34.6209L33.8983 8.65663C33.9629 9.70239 33.9412 10.727 33.8445 11.6109Z" fill="#154DDD"/>
<path d="M39.57 9.79973V9.85349C39.57 10.8884 39.538 11.8913 39.2033 13.2391H37.8555C38.3406 11.5137 38.3515 10.4141 38.3515 9.19557V4.51589C38.3515 4.03077 38.6427 3.76133 39.1604 3.76133H40.8961C41.4139 3.76133 41.7044 4.01989 41.7044 4.51589V12.1716C41.7044 12.7649 41.2948 13.1309 40.6804 13.1745C40.3675 13.1962 40.0443 13.1527 39.8395 13.0989L39.57 11.9885C39.7428 12.0314 39.9905 12.0532 40.1736 12.0532C40.3784 12.0532 40.4865 11.9348 40.4865 11.7511V9.79973H39.57ZM40.4865 4.96902C40.4865 4.90438 40.4436 4.86086 40.379 4.86086H39.6891C39.6244 4.86086 39.5707 4.90374 39.5707 4.96902V6.32773H40.4871V4.96902H40.4865ZM40.4865 7.31973H39.57V8.80773H40.4865V7.31973ZM47.6993 11.8593V12.9805H42.082L41.9745 11.8593H44.3252V9.67046H42.5896L42.4814 8.54917H44.3252V6.53254H43.387C43.2897 6.97478 43.1713 7.39525 43.0203 7.79397H41.8343C42.2439 6.65093 42.4596 5.45413 42.4923 4.07429H43.6462C43.6353 4.53765 43.6033 4.99077 43.5598 5.41125H44.3252V3.54565H45.5867V5.41125H47.3659V6.53254H45.5867V8.54917H47.3012V9.67046H45.5867V11.8593H47.6993Z" fill="#154DDD"/>
<path d="M59.5924 11.9886L59.2039 13.3364C56.8212 12.3335 55.3978 11.5143 54.6433 9.9617C53.8887 11.4171 52.4007 12.4846 49.9853 13.3255L49.6404 12.0315C52.3361 10.9748 53.4356 10.0692 53.8023 8.47306H49.9425L49.8241 7.33002H53.9322C53.9431 7.18986 53.9431 7.03882 53.9431 6.88778V5.19498H50.6113L50.5037 4.09546H58.8058V5.19498H55.2577V7.14634V7.32938H59.3869V8.47242H55.3325C55.9482 10.3604 57.5329 11.2231 59.5924 11.9886Z" fill="#154DDD"/>
<path d="M25.8777 18.3961L26.5938 18.3277C26.6367 18.5632 26.7244 18.7366 26.8562 18.8467C26.9881 18.9574 27.166 19.0125 27.3894 19.0125C27.6262 19.0125 27.8054 18.9632 27.925 18.8653C28.0454 18.7667 28.1055 18.6521 28.1055 18.5203C28.1055 18.4358 28.0799 18.3641 28.0294 18.3046C27.9788 18.2451 27.8905 18.1939 27.7644 18.1498C27.678 18.1203 27.4815 18.0685 27.175 17.9936C26.7801 17.8976 26.5036 17.7798 26.3442 17.6403C26.1202 17.4438 26.0082 17.2038 26.0082 16.9209C26.0082 16.7392 26.0607 16.5689 26.1663 16.4102C26.2719 16.2515 26.423 16.1312 26.6214 16.048C26.8198 15.9654 27.0585 15.9238 27.3388 15.9238C27.7964 15.9238 28.1407 16.0224 28.3724 16.2189C28.6041 16.4153 28.725 16.6777 28.7366 17.0061L28.0006 17.0381C27.9692 16.8544 27.9014 16.7226 27.7977 16.6419C27.694 16.5613 27.5385 16.5216 27.3311 16.5216C27.1174 16.5216 26.9497 16.5645 26.8287 16.6509C26.7506 16.7059 26.7116 16.7801 26.7116 16.8729C26.7116 16.9574 26.7481 17.0298 26.821 17.0899C26.9138 17.1661 27.1391 17.2461 27.4975 17.3286C27.8559 17.4112 28.1202 17.497 28.2924 17.5859C28.4646 17.6749 28.5983 17.7958 28.695 17.9488C28.7922 18.1024 28.8402 18.2918 28.8402 18.5178C28.8402 18.7226 28.782 18.9145 28.6662 19.0931C28.5503 19.2717 28.3858 19.4048 28.174 19.4918C27.9615 19.5789 27.6972 19.6224 27.3804 19.6224C26.9196 19.6224 26.5657 19.5181 26.3186 19.3094C26.0735 19.1001 25.9263 18.7961 25.8777 18.3961Z" fill="#154DDD"/>
<path d="M29.3547 15.9854H30.0907V17.9207C30.0907 18.2279 30.0997 18.427 30.1183 18.5178C30.1496 18.6644 30.2245 18.7815 30.3435 18.8698C30.4619 18.9582 30.6239 19.0029 30.8299 19.0029C31.0386 19.0029 31.196 18.9614 31.3023 18.8775C31.4085 18.7937 31.4725 18.6913 31.4936 18.569C31.5154 18.4474 31.5263 18.2445 31.5263 17.9623V15.9854H32.2623V17.8625C32.2623 18.2913 32.2424 18.5946 32.2027 18.7719C32.1631 18.9492 32.0895 19.0983 31.9826 19.2206C31.8757 19.3428 31.7323 19.4394 31.5538 19.5118C31.3746 19.5841 31.141 19.6199 30.8523 19.6199C30.5042 19.6199 30.2399 19.5802 30.06 19.5015C29.8802 19.4228 29.7381 19.3204 29.6338 19.1943C29.5295 19.0682 29.4603 18.9364 29.4271 18.7981C29.3791 18.5933 29.3547 18.2913 29.3547 17.8913V15.9854Z" fill="#154DDD"/>
<path d="M32.9363 19.559V15.9858H34.1177C34.5651 15.9858 34.8569 16.0038 34.9932 16.0396C35.2019 16.0934 35.3772 16.2098 35.518 16.389C35.6588 16.5689 35.7292 16.8006 35.7292 17.0847C35.7292 17.3042 35.6889 17.4886 35.6076 17.6383C35.5264 17.7881 35.4233 17.9052 35.2979 17.9903C35.1724 18.0754 35.0457 18.1318 34.9164 18.1599C34.7404 18.1938 34.4864 18.2111 34.1529 18.2111H33.6729V19.559H32.9363ZM33.6729 16.59V17.6038H34.0755C34.3654 17.6038 34.5593 17.5852 34.6572 17.5474C34.7552 17.5103 34.832 17.4514 34.887 17.3721C34.9427 17.2927 34.9702 17.1999 34.9702 17.0943C34.9702 16.9644 34.9312 16.8569 34.8531 16.7724C34.775 16.6879 34.6764 16.6348 34.5574 16.6137C34.4697 16.5977 34.2931 16.5894 34.0275 16.5894H33.6729V16.59Z" fill="#154DDD"/>
<path d="M36.2317 19.559V15.9858H38.935V16.5906H36.9677V17.383H38.7981V17.9852H36.9677V18.958H39.0048V19.5602H36.2317V19.559Z" fill="#154DDD"/>
<path d="M39.5295 19.559V15.9858H41.079C41.4687 15.9858 41.7516 16.0178 41.9283 16.0818C42.1049 16.1458 42.2463 16.2604 42.3519 16.4242C42.4575 16.5881 42.5113 16.7762 42.5113 16.9874C42.5113 17.2556 42.4307 17.477 42.27 17.6518C42.1094 17.8265 41.8687 17.9366 41.5487 17.982C41.7081 18.0729 41.8393 18.1727 41.943 18.2815C42.0467 18.3903 42.1862 18.5836 42.3622 18.8614L42.8076 19.5583H41.927L41.3945 18.7807C41.2057 18.503 41.0764 18.3276 41.0067 18.2553C40.9369 18.183 40.8633 18.1337 40.7852 18.1068C40.7071 18.0799 40.5836 18.0665 40.4147 18.0665H40.2655V19.5583H39.5295V19.559ZM40.2662 17.4969H40.8108C41.1641 17.4969 41.3843 17.4822 41.4726 17.4527C41.5609 17.4233 41.6294 17.3734 41.6787 17.3017C41.7279 17.23 41.7535 17.141 41.7535 17.0335C41.7535 16.9132 41.7209 16.8159 41.655 16.7423C41.5891 16.6687 41.4969 16.6214 41.3779 16.6022C41.3183 16.5938 41.1391 16.59 40.8409 16.59H40.2662V17.4969Z" fill="#154DDD"/>
<path d="M43.9417 19.559L42.6387 15.9858H43.4368L44.3596 18.6303L45.2524 15.9858H46.0332L44.7276 19.559H43.9417Z" fill="#154DDD"/>
<path d="M46.2847 19.559V15.9858H47.0207V19.559H46.2847Z" fill="#154DDD"/>
<path d="M47.4341 18.3961L48.1502 18.3277C48.1931 18.5632 48.2808 18.7366 48.4126 18.8467C48.5445 18.9574 48.7224 19.0125 48.9464 19.0125C49.1832 19.0125 49.3618 18.9632 49.4821 18.8653C49.6024 18.7667 49.6626 18.6521 49.6626 18.5203C49.6626 18.4358 49.637 18.3641 49.5864 18.3046C49.5358 18.2451 49.4475 18.1939 49.3214 18.1498C49.235 18.1203 49.0386 18.0685 48.732 17.9936C48.3371 17.8976 48.0606 17.7798 47.9013 17.6403C47.6773 17.4438 47.5653 17.2038 47.5653 16.9209C47.5653 16.7392 47.6178 16.5689 47.7234 16.4102C47.8283 16.2515 47.98 16.1312 48.1784 16.048C48.3762 15.9654 48.6155 15.9238 48.8958 15.9238C49.3534 15.9238 49.6978 16.0224 49.9294 16.2189C50.1605 16.4153 50.2821 16.6777 50.2936 17.0061L49.5576 17.0381C49.5262 16.8544 49.4584 16.7226 49.3547 16.6419C49.251 16.5613 49.0955 16.5216 48.8882 16.5216C48.6744 16.5216 48.5067 16.5645 48.3858 16.6509C48.3077 16.7059 48.2686 16.7801 48.2686 16.8729C48.2686 16.9574 48.3051 17.0298 48.3781 17.0899C48.4709 17.1661 48.6962 17.2461 49.0546 17.3286C49.413 17.4112 49.6773 17.497 49.8494 17.5859C50.0216 17.6749 50.1554 17.7958 50.252 17.9488C50.3493 18.1024 50.3973 18.2918 50.3973 18.5178C50.3973 18.7226 50.339 18.9145 50.2232 19.0931C50.1074 19.2717 49.9429 19.4048 49.731 19.4918C49.5186 19.5789 49.2542 19.6224 48.9374 19.6224C48.4766 19.6224 48.1227 19.5181 47.8757 19.3094C47.6293 19.1001 47.4821 18.7961 47.4341 18.3961Z" fill="#154DDD"/>
<path d="M50.8933 19.559V15.9858H51.6293V19.559H50.8933Z" fill="#154DDD"/>
<path d="M52.0798 17.7939C52.0798 17.4298 52.1355 17.1245 52.2462 16.8774C52.3288 16.6957 52.4421 16.5318 52.5854 16.3872C52.7288 16.2425 52.8862 16.135 53.0565 16.0653C53.2837 15.9712 53.5454 15.9238 53.8424 15.9238C54.3794 15.9238 54.8094 16.087 55.132 16.4141C55.4546 16.7405 55.6158 17.1949 55.6158 17.7766C55.6158 18.3533 55.4558 18.8051 55.1358 19.1309C54.8158 19.4566 54.3877 19.6198 53.8526 19.6198C53.3106 19.6198 52.8792 19.4579 52.5592 19.1334C52.2398 18.8096 52.0798 18.3629 52.0798 17.7939ZM52.8382 17.7696C52.8382 18.1741 52.9336 18.4813 53.1243 18.6899C53.315 18.8985 53.557 19.0029 53.8507 19.0029C54.1445 19.0029 54.3851 18.8992 54.5733 18.6918C54.7614 18.4845 54.8555 18.1741 54.8555 17.7593C54.8555 17.3497 54.764 17.0445 54.581 16.8429C54.3979 16.6413 54.1547 16.5408 53.8507 16.5408C53.5474 16.5408 53.3029 16.6425 53.1173 16.8467C52.931 17.0509 52.8382 17.3587 52.8382 17.7696Z" fill="#154DDD"/>
<path d="M56.0967 19.559V15.9858H56.8128L58.3053 18.3724V15.9858H58.9895V19.559H58.2509L56.7808 17.2287V19.559H56.0967Z" fill="#154DDD"/>
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

62
src/global.css
Unescape Escape View File

@ -61,10 +61,6 @@ ol {
border-block-end: none;
}
/* 1108 update 全局样式新增调整 */
.gn .ant-pro-checkcard-content {
padding-inline: 0;
padding-block: 0;
}
.ant-table-cell .ant-btn.ant-btn-sm {
padding: 0;
}
@ -132,8 +128,15 @@ a.ant-dropdown-trigger {
background-color: #e8effb;
}
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected,
:where(.css-dev-only-do-not-override-7ql2tf).ant-tree .ant-tree-checkbox + span.ant-tree-node-selected {
.ant-tree .ant-tree-checkbox + span.ant-tree-node-selected {
background-color: #e8effb;
color: #155BD4;
}
.ant-steps .ant-steps-item-active > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-title {
color: #155BD4;
}
.ant-steps .ant-steps-item-active > .ant-steps-item-container > .ant-steps-item-content > .ant-steps-item-description {
color: #155BD4;
}
/* 表单 */
.ant-form-item {
@ -159,16 +162,61 @@ a.ant-dropdown-trigger {
.ant-pro-table .ant-pro-table-search .ant-form .ant-pro-query-filter-row-split {
padding-right: 0 !important;
}
.rc-virtual-list-scrollbar-thumb {
display: none;
}
/* ant-descriptions */
.ant-descriptions .ant-descriptions-row > th,
.ant-descriptions .ant-descriptions-row > td {
padding-right: 12px;
}
/* UI 规范表 // TODO 11-17启动
.gn {
/* UI 规范表 // update 使用中
适用说明
字体大小、颜色、粗细
页面间距
*/
}
.gn .ant-pro-checkcard-content {
padding-inline: 0;
padding-block: 0;
}
.gn .ant-table-wrapper table tr th.ant-table-selection-column,
.gn .ant-table-wrapper table tr td.ant-table-selection-column,
.gn .ant-table-wrapper .ant-table-selection-column {
text-align: left;
}
.gn .ant-transfer-customize-list .ant-table-wrapper .ant-table-small .ant-table-selection-column {
padding-left: 12px;
}
.gn .ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap .ant-tabs-nav-list {
padding: 0 24px;
margin-block-start: 0;
}
.gn .ant-tabs > .ant-tabs-nav .ant-tabs-nav-wrap .ant-tabs-nav-list .ant-tabs-tab-active {
font-weight: 700;
}
.gn .ant-pro-table-list-toolbar-container {
padding-block: 8px;
}
.gn.h2 {
font-size: 18;
font-size: 18px;
}
.gn.h3 {
font-weight: 600;
}
.gn.h4 {
font-size: 14px;
font-weight: 700;
line-height: 18px;
color: #333333;
}
.gn .des_1 {
font-size: 12px;
font-weight: 400;
line-height: 22px;
color: #666666;
}
.gn .border_bottom_1 {
border-bottom: 1px solid #E0E0E0;
}

83
src/global.less
Unescape Escape View File

@ -75,11 +75,8 @@ ol {
border-block-end: none;
}
/* 1108 update 全局样式新增调整 */
// TODO_update 重置覆盖默认样式，使用统一类名gn + 需要覆盖的类名
.gn .ant-pro-checkcard-content {
padding-inline: 0;
padding-block: 0;
}
// TODO_update 全局小尺寸按钮，统一间距 （列表操作栏位按钮）
.ant-table-cell .ant-btn.ant-btn-sm{
padding: 0;
@ -155,10 +152,22 @@ a.ant-dropdown-trigger{
.ant-select-dropdown .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
background-color: #e8effb;
}
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected, :where(.css-dev-only-do-not-override-7ql2tf).ant-tree .ant-tree-checkbox+span.ant-tree-node-selected {
.ant-tree .ant-tree-node-content-wrapper.ant-tree-node-selected, .ant-tree .ant-tree-checkbox+span.ant-tree-node-selected {
background-color: #e8effb;
color: #155BD4;
}
.ant-steps .ant-steps-item-active>.ant-steps-item-container>.ant-steps-item-content{
&> .ant-steps-item-title{
color: #155BD4;
}
&> .ant-steps-item-description{
color: #155BD4;
// color: #155cd5;
}
}
/* 表单 */
.ant-form-item {
@ -177,6 +186,7 @@ a.ant-dropdown-trigger{
font-size: 18px;
}
.ant-modal-body .ant-pro-steps-form-steps-container{
max-width: 1900px !important;
}
@ -196,6 +206,9 @@ a.ant-dropdown-trigger{
}
}
}
.rc-virtual-list-scrollbar-thumb{
display: none
}
/* ant-descriptions */
.ant-descriptions{
.ant-descriptions-row >th,
@ -203,21 +216,71 @@ a.ant-dropdown-trigger{
padding-right: 12px;
}
}
/* UI 规范表 // TODO 11-17启动
*/
.gn {
// TODO_update 重置覆盖默认样式，使用统一类名gn + 需要覆盖的类名
.ant-pro-checkcard-content {
padding-inline: 0;
padding-block: 0;
}
.ant-table-wrapper table tr th.ant-table-selection-column,
.ant-table-wrapper table tr td.ant-table-selection-column,
.ant-table-wrapper .ant-table-selection-column{
text-align: left;
}
.ant-transfer-customize-list .ant-table-wrapper .ant-table-small .ant-table-selection-column{
padding-left: 12px;
}
.ant-tabs >.ant-tabs-nav .ant-tabs-nav-wrap{
.ant-tabs-nav-list{
padding: 0 24px;
margin-block-start: 0;
.ant-tabs-tab-active{
font-weight: 700
}
}
}
.ant-pro-table-list-toolbar-container {
padding-block: 8px;
}
/* UI 规范表 // update 使用中
适用说明
字体大小、颜色、粗细
页面间距
*/
// &.p1 {
// // line-height: ;
// line-height: ;
// font-weight: 600;
// }
&.h2{
font-size: 18;
font-size: 18px;
}
&.h3{
font-weight: 600;
}
&.h4{
font-size: 14px;
font-weight: 700;
line-height: 18px;
color: rgba(51, 51, 51, 1);
}
.des_1{
font-size: 12px;
font-weight: 400;
line-height: 22px;
color: rgba(102, 102, 102, 1)
}
// 边框
.border_bottom_1 {
border-bottom: 1px solid #E0E0E0
}
}
// .p1{

10
src/layouts/treeAndTableList.tsx
Unescape Escape View File

@ -1,3 +1,11 @@
/*
* @Author: zhoux zhouxia@supervision.ltd
* @Date: 2023-11-21 13:42:31
* @LastEditors: zhoux zhouxia@supervision.ltd
* @LastEditTime: 2023-11-24 16:01:20
* @FilePath: \general-ai-platform-web\src\layouts\treeAndTableList.tsx
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
*/
import { ProCard } from '@ant-design/pro-components';
import { CardProps } from 'antd';
// 此模块使用的 ProCardType
@ -21,7 +29,7 @@ const TreeAndTableList: React.FC<TreeAndTableListProps> = (props) => {
// 统一配置
let finalLeftCard: ProCardTypeProps = {
// 左侧卡片
headStyle: { paddingTop: 24, paddingLeft: 20, paddingRight: 20 },
headStyle: { paddingTop: 24, paddingLeft: 20, paddingRight: 20, paddingBottom:12 ,borderBottom: '1px solid #E0E0E0' },
bodyStyle: {paddingLeft: 20, paddingRight: 20},
colSpan: '22%',
};

2
src/locales/zh-CN/common.ts
Unescape Escape View File

@ -44,4 +44,6 @@ export default {
"common.tip.title": '温馨提示',
'common.video_opening': '视频打开中',
'common.open_failure': '打开失败',
'common.start_process': '开始运行',
'common.finish_process': '关闭运行',
}

170
src/pages/Setting/AlgorithmSetting.tsx
Unescape Escape View File

@ -1,5 +1,5 @@
import {
postDeviceGroupGetDeviceGroupList,
postDeviceGroupGetDeviceGroupById,
postDeviceGroupGetDeviceGroupTree,
} from '@/services/device/DeviceGroup';
@ -7,18 +7,12 @@ import TreeAndTableList, { ProCardTypeProps } from '@/layouts/treeAndTableList';
import { postProjectGetProjectByGroupId } from '@/services/project/Project';
import { postModelVersionGetModelVersionListByIds } from '@/services/resource/ModelVersion';
import { FormattedMessage } from '@@/exports';
import { CaretRightOutlined, PauseOutlined } from '@ant-design/icons';
import type { ActionType } from '@ant-design/pro-components';
import {
PageContainer,
ProCard,
ProColumns,
ProDescriptions,
ProList,
ProTable,
} from '@ant-design/pro-components';
import { PageContainer, ProCard, ProDescriptions, ProList } from '@ant-design/pro-components';
import { useAccess, useIntl } from '@umijs/max';
import { Button, Tag, message } from 'antd';
import { DataNode } from 'antd/es/tree';
import Tree, { DataNode } from 'antd/es/tree';
import React, { useEffect, useRef, useState } from 'react';
import ProjectCard from './components/ProjectCard';
import UpdateForm from './components/UpdateForm';
@ -48,7 +42,7 @@ const AlgorithmSetting: React.FC = () => {
const [tabs, setTabs] = useState([]);
const [cardActionProps, setCardActionProps] = useState<'actions' | 'extra'>('extra');
const [modelVersionData, setModelVersionData] = useState<any[]>([]);
const [projectData, setProjectData] = useState<any>({});
const [projectData, setProjectData] = useState<Record<string,any>>({});
const [targetKeys, setTargetKeys] = useState<string[]>([]);
const [projectConfigId, setProjectConfigId] = useState<number>(0);
const handleUpdateModal = () => {
@ -61,13 +55,13 @@ const AlgorithmSetting: React.FC = () => {
};
const [tab, setTab] = useState<string>('');
const columns1: ProColumns<API.DeviceGroup>[] = [
{
title: '全选',
dataIndex: 'name',
hideInSearch: true,
},
];
// const columns1: ProColumns<API.DeviceGroup>[] = [
// {
// title: '全选',
// dataIndex: 'name',
// hideInSearch: true,
// },
// ];
const columns = [
// {
@ -166,17 +160,24 @@ const AlgorithmSetting: React.FC = () => {
// },
];
// 项目信息展示
async function fetchProjectInfoByGroupId(record: Record<string, any>) {
const resp = await postDeviceGroupGetDeviceGroupById({ id: record.key });
console.log('fetchProjectInfoByGroupId_resp', resp.data.deviceGroup);
setCurrentRow(resp.data.deviceGroup);
}
// TODO 左侧图标目前写死，需替换
// 操作左侧网点数据节点， 项目列表数据变更
function fetchProjectByGroupId(record: Record<string, any>) {
// console.log('clickTreeNode', projectCardListRef.current)
postProjectGetProjectByGroupId({ id: record.id }).then((resp) => {
postProjectGetProjectByGroupId({ id: record.key }).then((resp) => {
let tab_data = (resp?.data?.list || []).map((v: any) => {
console.log(resp.data.list);
let model_data = ([...v?.models] || []).map((item: any) => ({
content: (
<ProCard
style={{ backgroundColor: 'transparent' }}
style={{ backgroundColor: 'rgba(21, 91, 212, 0.03)' }}
bodyStyle={{ margin: 0, padding: 0 }}
>
<div
@ -188,15 +189,16 @@ const AlgorithmSetting: React.FC = () => {
}}
>
<div>
<div>{JSON.stringify(item.configId)}</div>
<img src="/images/model.png" alt="" style={{ width: '50px' }} />
<img src="/images/icons/logo.svg" alt="" style={{ width: '64px' }} />
</div>
<Button
type="link"
size="small"
key={item.configId}
style={{ padding: 0 }}
style={{ padding: 0, fontWeight: 700 }}
onClick={() => {
setProjectData(item)
console.log(item,'setProjectData_item', projectData)
setProjectConfigId(item.configId);
handleUpdateModal();
}}
@ -235,6 +237,22 @@ const AlgorithmSetting: React.FC = () => {
},
}}
headerTitle="项目模型列表"
toolBarRender={(action, rows) => {
console.log(action, rows, 'toolBarRender');
// TODO 需要对接接口
const isProcess: boolean = false;
return isProcess ? (
<Button type="primary" danger>
<PauseOutlined style={{ fontSize: 14, lineHeight: 1.5 }} />
结束运行
</Button>
) : (
<Button type="primary">
<CaretRightOutlined style={{ fontSize: 14, lineHeight: 1.5 }} />
开始运行
</Button>
);
}}
dataSource={model_data}
/>
),
@ -314,90 +332,35 @@ const AlgorithmSetting: React.FC = () => {
} as ProCardTypeProps
}
leftDom={
<ProTable<API.DeviceGroup>
// headerTitle={intl.formatMessage({
// id: 'pages.searchTable.title',
// defaultMessage: '$$$',
// })}
cardProps={{
bodyStyle: {
padding: 0,
margin: 0,
},
}}
options={{
search: false, // TODO 1113 搜索需要对接，比对UI调整交互
fullScreen: false,
setting: false,
density: false,
reload: false,
}}
actionRef={actionRef}
search={false}
rowKey="key"
onRow={(record) => {
return {
onClick: () => {
if (record.id) {
setCurrentRow(record);
fetchProjectByGroupId(record);
}
},
};
}}
pagination={{
showSizeChanger: false,
pageSize: 10,
}}
columnsState={{
persistenceKey: 'device_group_list',
persistenceType: 'localStorage',
}}
request={async (params = {}, sort) => {
const { current, ...rest } = params;
const reqParams = {
page: current,
desc: false,
orderKey: '',
...rest,
};
if (sort && Object.keys(sort).length) {
reqParams.orderKey = Object.keys(sort)[0];
let sort_select = sort[reqParams.orderKey];
reqParams.desc = sort_select === 'descend';
}
let resp = await postDeviceGroupGetDeviceGroupList({
...reqParams,
name: params?.keyword || '',
});
return {
data: resp.data.list.map((v: API.DeviceGroup) => {
return { ...v, key: v.id };
}),
success: resp.success,
total: resp.data.total,
current: resp.data.page,
pageSize: resp.data.pageSize,
};
}}
columns={columns1}
rowSelection={
{
// onChange: (_, selectedRows) => {
// // setSelectedRows(selectedRows);
// },
}
}
/>
hasInit && (
<Tree
checkable={false}
defaultExpandAll={true}
selectedKeys={selectNodes}
treeData={nodeTreeData}
onSelect={(selectKeys, info) => {
console.log(info.node, 'onSelect_info');
setSelectNodes(selectKeys);
fetchProjectInfoByGroupId(info?.node);
fetchProjectByGroupId(info?.node);
actionRef.current?.reload();
}}
checkStrictly={false}
/>
)
}
rightDom={
<>
<ProCard bodyStyle={{ paddingTop: 24 }} colSpan="80%">
<div className="gn">
<ProCard
title="网点详细信息"
headStyle={{borderBottom: '1px solid #E0E0E0', paddingTop: 0, paddingBottom:12 }}
style={{ background: 'transparent' , paddingTop: 24 }}
bodyStyle={{ paddingBottom: 0 }}
colSpan="80%"
>
<ProDescriptions
column={3}
dataSource={currentRow}
title="网点详细信息"
tooltip="包含了从服务器请求，columns等功能"
columns={columns}
></ProDescriptions>
</ProCard>
@ -411,7 +374,7 @@ const AlgorithmSetting: React.FC = () => {
},
}}
></ProCard>
</>
</div>
}
></TreeAndTableList>
{/* <ProCard split="vertical">
@ -419,6 +382,7 @@ const AlgorithmSetting: React.FC = () => {
<ProCard title="" headerBordered split={'horizontal'}></ProCard>
</ProCard> */}
<UpdateForm
projectData={projectData as Record<string, any>}
updateModalOpen={updateModalOpen}
handleModal={handleUpdateModal}
groupId={currentRow?.id || 0}

53
src/pages/Setting/components/TableTransfer.tsx
Unescape Escape View File

@ -37,7 +37,7 @@ for (let i = 0; i < 5; i += 1) {
const columns1 = [
{
title: '应用名称',
width: 80,
// width: 80,
dataIndex: 'name',
},
{
@ -46,12 +46,12 @@ const columns1 = [
},
{
title: '状态',
width: 80,
// width: 80,
dataIndex: 'status',
},
{
title: '创建者',
width: 80,
// width: 80,
dataIndex: 'creator',
},
];
@ -89,8 +89,6 @@ const TableTransfer = ({ leftColumns, rightColumns, ...restProps }: TableTransfe
locale={{ itemUnit: '项', itemsUnit: '项', searchPlaceholder: '请输入搜索内容' }}
listStyle={{ width: 432 }}
operationStyle={{ width: 32, alignItems: 'center' }}
>
{({
direction,
@ -136,22 +134,27 @@ const TableTransfer = ({ leftColumns, rightColumns, ...restProps }: TableTransfe
};
return (
<Table<any>
rowSelection={rowSelection}
virtual={true}
columns={columns}
scroll={{ y: 500 }}
dataSource={filteredItems}
size="small"
pagination={false}
style={{ pointerEvents: listDisabled ? 'none' : undefined, width: 500 }}
onRow={({ key, disabled: itemDisabled }) => ({
onClick: () => {
if (itemDisabled || listDisabled) return;
onItemSelect(key as string, !listSelectedKeys.includes(key as string));
},
})}
/>
<div className={'gn'}>
<Table<any>
rowSelection={{
columnWidth: 0.5, // 设置选择栏的宽度
...rowSelection,
}}
virtual={true}
columns={columns}
scroll={{ y: 500 }}
dataSource={filteredItems}
size="small"
pagination={false}
style={{ pointerEvents: listDisabled ? 'none' : undefined }}
onRow={({ key, disabled: itemDisabled }) => ({
onClick: () => {
if (itemDisabled || listDisabled) return;
onItemSelect(key as string, !listSelectedKeys.includes(key as string));
},
})}
/>
</div>
);
}}
</Transfer>
@ -175,18 +178,22 @@ const leftTableColumns: ColumnsType<DataType> = [
{
dataIndex: 'name',
title: '名称',
// width: 40
},
{
dataIndex: 'code',
title: '编码',
// width: 40
},
{
dataIndex: 'position',
title: '位置',
// width: 40
},
{
dataIndex: 'param',
title: '参数',
// width: 40
},
];
@ -225,7 +232,7 @@ const TableTransferList: React.FC<UpdateFormProps> = (props) => {
setShowSearch(checked);
};
return (
<>
<div className={'gn'}>
<TableTransfer
dataSource={props.dataSource}
targetKeys={props.targetKeys}
@ -234,7 +241,7 @@ const TableTransferList: React.FC<UpdateFormProps> = (props) => {
leftColumns={leftTableColumns}
rightColumns={rightTableColumns}
/>
</>
</div>
);
};

293
src/pages/Setting/components/UpdateForm.tsx
Unescape Escape View File

@ -20,12 +20,27 @@ import { Modal, message } from 'antd';
import type { ColumnsType } from 'antd/es/table/interface';
import type { TransferItem, TransferProps } from 'antd/es/transfer';
import React, { useEffect, useRef, useState } from 'react';
import { proFormMaxItemStyleProps, proFormMaxModelWidth, proFormModelWidth } from '../../../../config/defaultForm';
import { proFormMaxItemStyleProps, proFormMaxModelWidth } from '../../../../config/defaultForm';
const formContainerWidth: number = 755;
const stepFormItemStyleProps: Record<string, any> = {
width: formContainerWidth,
/**styles */
const modelParamsFormItemProps = {
width: proFormMaxItemStyleProps.column2Width - 16,
};
// 动态参数项外层盒子
const modelFormAreaStyles: React.CSSProperties | undefined = {
display: 'flex',
justifyContent: 'space-between',
flexWrap: 'wrap',
width: '918px',
background: '#fafafa',
borderRadius: '4px',
padding: 15,
marginBottom: 12,
border: '1px solid',
borderColor: 'rgba(219, 219, 219,0.4)'
};
interface DataType extends API.Device {
key: string;
}
@ -46,9 +61,11 @@ export type UpdateFormProps = {
projectModelConfigId: number;
groupId: number;
reload: any;
projectData: Record<string, any>;
};
const UpdateForm: React.FC<UpdateFormProps> = (props) => {
console.log(props.projectData, 'projectData');
const intl = useIntl();
const [targetKeys, setTargetKeys] = useState<string[]>([]);
@ -87,6 +104,17 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
}>
>();
// 获取默认渲染项
const renderProjectItems = () => {
return (
<div>
<span className="gn h4">模型名称 </span>
<div style={{ paddingBottom: 16, paddingTop: 8 }}>{props.projectData.modelName}</div>
</div>
);
};
useEffect(() => {
setTargetKeys([]);
setConfigData([]);
@ -182,46 +210,58 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
>
<>
<ProForm.Group>
{isInit &&
(projectModelConfig?.projectConfig || []).map((item: any, index: number) => {
let value_type = typeof item.value;
if (value_type === 'number') {
return (
<ProFormDigit
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
);
} else if (value_type === 'boolean') {
return (
<ProFormSwitch
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
);
} else if (value_type === 'string') {
return (
<ProFormText
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
);
} else {
return;
}
})}
{renderProjectItems()}
{isInit && projectModelConfig?.projectConfig?.length ? (
<div style={modelFormAreaStyles}>
{(projectModelConfig?.projectConfig || []).map((item: any, index: number) => {
let value_type = typeof item.value;
if (value_type === 'number') {
return (
<ProFormDigit
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
);
} else if (value_type === 'boolean') {
return (
// eslint-disable-next-line react/jsx-key
<div
style={{
width: modelParamsFormItemProps.width,
}}
>
<ProFormSwitch
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
</div>
);
} else if (value_type === 'string') {
return (
<ProFormText
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
tooltip={item.remark}
/>
);
} else {
return <></>;
}
})}
</div>
) : (
<></>
)}
</ProForm.Group>
</>
</StepsForm.StepForm>
@ -247,12 +287,18 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
>
<>
<ProForm.Group>
{renderProjectItems()}
{/* <div>{props.projectModelConfigId}</div> */}
{isInit && projectModelConfig.modelFkId && projectModelConfig.modelFkId !== 0 && (
<ProFormSelect
{...proFormMaxItemStyleProps}
width={proFormMaxItemStyleProps.width}
name="modelFkId"
label="模型版本"
label={
<>
<span className="gn h4">模型版本 </span>
<span className="gn des_1"> (选择模型版本配置模型参数)</span>
</>
}
onChange={handleSelectChange}
initialValue={projectModelConfig.modelVersionFkId}
// dependencies 的内容会注入 request 中
@ -272,75 +318,92 @@ const UpdateForm: React.FC<UpdateFormProps> = (props) => {
{/* <div>
{selectValue}={projectModelConfig.modelVersionFkId}
</div> */}
{isInit &&
(selectValue !== projectModelConfig.modelVersionFkId
? configData.map((item: any, index: number) => {
if (typeof item.default === 'number') {
return (
<ProFormDigit
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
);
} else if (typeof item.default === 'boolean') {
return (
<ProFormSwitch
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
);
} else {
return (
<ProFormText
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
);
}
})
: configData.map((item: any, index: number) => {
if (typeof item.value === 'number') {
return (
<ProFormDigit
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
);
} else if (typeof item.value === 'boolean') {
return (
<ProFormSwitch
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
);
} else {
return (
<ProFormText
{...proFormMaxItemStyleProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
);
}
}))}
{isInit && configData.length ? (
<div style={modelFormAreaStyles}>
{selectValue !== projectModelConfig.modelVersionFkId
? configData.map((item: any, index: number) => {
if (typeof item.default === 'number') {
return (
<ProFormDigit
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
);
} else if (typeof item.default === 'boolean') {
return (
// eslint-disable-next-line react/jsx-key
<div
style={{
width: modelParamsFormItemProps.width,
}}
>
<ProFormSwitch
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
</div>
);
} else {
return (
<ProFormText
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.default}
/>
);
}
})
: configData.map((item: any, index: number) => {
if (typeof item.value === 'number') {
return (
<ProFormDigit
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
);
} else if (typeof item.value === 'boolean') {
return (
// eslint-disable-next-line react/jsx-key
<div
style={{
width: modelParamsFormItemProps.width,
}}
>
<ProFormSwitch
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
</div>
);
} else {
return (
<ProFormText
{...modelParamsFormItemProps}
key={index}
name={item.name}
label={item.name}
initialValue={item.value}
/>
);
}
})}
</div>
) : (
<></>
)}
</ProForm.Group>
</>
</StepsForm.StepForm>

Write Preview
Loading…
Cancel
Save