修复字典模块样式

src/assets/styles/base.css

@@ -12,6 +12,7 @@ html {
   --themeColor: #002c15;
   --themeColor2: #fddb77;
   --boxBcaColor: #f7efed;
+  --txtColor: #4c7f7a;
 }
 body {
   font: 1em/1.4 'Microsoft Yahei', 'PingFang SC', 'Avenir', 'Segoe UI', 'Hiragino Sans GB', 'STHeiti', 'Microsoft Sans Serif', 'WenQuanYi Micro Hei', sans-serif;

src/assets/styles/base.less

@@ -15,6 +15,9 @@ html {
   --themeColor: #002c15;
   --themeColor2: #fddb77;
   --boxBcaColor: #f7efed;
+
+  // 这个项目颜色有点杂
+  --txtColor: #4c7f7a;
 }
 
 body {

src/pages/Eculture/E1tag/E1add.tsx

@@ -173,7 +173,7 @@ function E1add({ addInfo, addFu, closeFu }: Props) {
           </Form.Item>
 
           <Form.Item label='标签说明' name='description'>
-            <TextArea maxLength={100} showCount placeholder='请输入内容' />
+            <TextArea maxLength={500} showCount placeholder='请输入内容' />
           </Form.Item>
 
           <div className='fromRow2'>

src/pages/Eculture/E1tag/index.module.scss

@@ -1,93 +1,135 @@
 .E1tag {
-  background-color: var(--boxBcaColor);
-  border-radius: 10px;
-  padding: 24px;
+  display: flex;
   :global {
-    .E1top {
-      display: flex;
-      justify-content: space-between;
+    .E1son {
+      width: 60%;
+      margin-right: 20px;
+      background-color: var(--boxBcaColor);
+      border-radius: 10px;
+      padding: 24px;
     }
-
-    .E1main {
-      margin-top: 15px;
-      height: calc(100% - 50px);
-      & > div {
-        height: 100%;
-      }
-      .E1Null {
-        width: 100%;
-        height: 300px;
-        font-size: 24px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
+    .E1ll {
+      .E1ll1 {
+        margin-bottom: 20px;
       }
-      .E1m1 {
-        display: flex;
-        justify-content: space-between;
-        .E1m1ll {
-          width: 50%;
-          overflow-y: auto;
-          .site-tree-search-value {
-            color: red;
-            font-weight: 700;
+      .E1ll2 {
+        height: calc(100% - 52px);
+
+        overflow-y: auto;
+        .site-tree-search-value {
+          color: red;
+          font-weight: 700;
+        }
+        .ant-tree {
+          background-color: var(--boxBcaColor);
+          min-height: 100%;
+        }
+        .ant-tree-title span {
+          font-size: 18px;
+        }
+
+        .ant-tree-node-selected {
+          padding: 4px 8px !important;
+          background-color: var(--txtColor) !important;
+          .ant-tree-title span {
+            color: var(--themeColor2) !important;
           }
-          .ant-tree {
-            background-color: var(--boxBcaColor);
-            min-height: 100%;
+        }
+        .NODATA {
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          color: #666666;
+          font-size: 16px;
+          height: 100%;
+          // img {
+          //   width: 150px;
+          // }
+          & > p {
+            margin-bottom: 10px;
           }
-          .ant-tree-node-selected {
-            background-color: var(--themeColor2) !important;
+          div {
+            width: 80%;
+            margin-top: 8%;
+            display: flex;
+            justify-content: space-around;
           }
         }
-        .E1m1rr {
-          width: calc(50% - 24px);
-
-          .E1mr2 {
-            .E1mr2Row {
-              display: flex;
-              // align-items: center;
-              margin-bottom: 10px;
-              font-size: 20px;
-              .E1mr2Row1 {
-                font-weight: 700;
-                font-size: 20px;
-              }
+      }
+    }
 
-              .ant-btn {
-                font-size: 20px;
-                height: 46px;
-              }
+    .E1rr {
+      width: calc(40% - 20px);
+      overflow-y: auto;
+      margin-right: 0;
 
-              .E1mr2Row2 {
-                width: calc(100% - 105px);
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-              }
-              .E1mr2Row2_1 {
-                width: calc(100% - 105px);
-              }
-            }
-            .E1mr2Row0 {
-              margin-bottom: 0;
-              align-items: center;
-            }
-            .E1mr2RowLast {
-              align-items: self-start;
-              .E1mr2Row2 {
-                display: flex;
-                flex-wrap: wrap;
-              }
+      .E1mr2 {
+        .E1mr2_1 {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          font-weight: 700;
+          color: var(--themeColor);
+          font-size: 24px;
+        }
+        .E1mr2_2 {
+          margin: 20px 0 40px;
+          display: flex;
+          .E1mr2Btn {
+            cursor: pointer;
+            margin-right: 15px;
+            width: 130px;
+            height: 40px;
+            line-height: 38px;
+            text-align: center;
+            color: #fff;
+            background-color: var(--txtColor);
+            border-radius: 4px;
+            font-size: 18px;
+            letter-spacing: 2px;
+            border: 1px solid transparent;
+            transition: all 0.3s;
+            &:hover {
+              transform: scale(1.1);
             }
           }
+          .E1mr2Btn2 {
+            color: #ff4d4d;
+            background-color: #fff;
+            border: 1px solid #ccc;
+          }
+        }
+
+        .E1mr2Row {
+          display: flex;
+          font-size: 20px;
+          margin-bottom: 30px;
+          .E1mr2Row1 {
+            font-weight: 700;
+            font-size: 20px;
+            width: 100px;
+          }
 
-          .E1mr3 {
-            margin-top: 15px;
-            height: calc(100% - 100px);
-            background-color: red;
+          .E1mr2Row2 {
+            width: calc(100% - 100px);
+            word-wrap: break-word;
           }
         }
+
+        .E1mr2RowLast {
+          align-items: self-start;
+          .E1mr2Row2 {
+            display: flex;
+            flex-wrap: wrap;
+          }
+        }
+      }
+
+      .E1mr3 {
+        margin-top: 15px;
+        height: calc(100% - 100px);
+        background-color: red;
       }
     }
   }

src/pages/Eculture/E1tag/index.tsx

@@ -8,6 +8,7 @@ import { MessageFu } from '@/utils/message'
 import { E1_APIdel, E1_APIgetTree } from '@/store/action/Eculture/E1tag'
 import { filterTreeByName, treeResIdFu } from '@/pages/Isystem/I2dict/data'
 import { I5AddInfoType, TypeI5Tree } from '@/pages/Isystem/I5organization/data'
+import classNames from 'classnames'
 import E1add from './E1add'
 
 function E1tag() {
@@ -150,87 +151,103 @@ function E1tag() {
   return (
     <div className={styles.E1tag}>
       <div className='pageTitle'>标签管理</div>
-      <div className='E1top'>
-        <Input
-          style={{ width: 300 }}
-          placeholder='请输入标签名称'
-          maxLength={30}
-          showCount
-          value={value}
-          onChange={e => valueChange(e.target.value)}
-          allowClear
-        />
-        <Button
-          type='primary'
-          onClick={() => setAddInfo({ id: '-1', txt: '新增', acInfo: rightData })}
-        >
-          新增
-        </Button>
+
+      {/* 左侧 */}
+      <div className='E1son E1ll'>
+        <div className='E1ll1'>
+          <Input
+            style={{ width: 300 }}
+            placeholder='请输入标签名称'
+            maxLength={30}
+            showCount
+            value={value}
+            onChange={e => valueChange(e.target.value)}
+            allowClear
+          />
+        </div>
+        <div className='E1ll2'>
+          {treeDataTemp && treeDataTemp.length ? (
+            <Tree
+              // 默认全部展开
+              defaultExpandAll={true}
+              // 数据
+              treeData={treeData}
+              // 自定义字段
+              // fieldNames={{ title: 'title', key: 'key', children: 'children' }}
+              // 选中
+              selectedKeys={[acShu]}
+              // 点击
+              onSelect={onSelect}
+            />
+          ) : loding ? (
+            <div className='NODATA'>暂无相关搜索结果，请更换关键字搜索</div>
+          ) : null}
+        </div>
       </div>
+      <div className='E1son E1rr'>
+        {rightData.id ? (
+          <>
+            <div className='E1mr2'>
+              <div className='E1mr2_1'>
+                <div>操作：</div>
+                <Button
+                  size='large'
+                  type='primary'
+                  onClick={() => setAddInfo({ id: '-1', txt: '新增', acInfo: rightData })}
+                >
+                  新增
+                </Button>
+              </div>
+
+              <div className='E1mr2_2'>
+                <div onClick={() => addSonFu(rightData.id)} className={classNames('E1mr2Btn')}>
+                  编辑
+                </div>
+                &emsp;
+                <MyPopconfirm
+                  txtK='删除'
+                  onConfirm={() => delTree(rightData.id)}
+                  disabled={rightData.parentId === '0'}
+                  Dom={<div className={classNames('E1mr2Btn E1mr2Btn2')}>删除</div>}
+                />
+              </div>
+
+              <div className='E1mr2Row'>
+                <div className='E1mr2Row1'>标签名称：</div>
+                <div className='E1mr2Row2'>{rightData.name}</div>
+              </div>
+
+              <div className='E1mr2Row'>
+                <div className='E1mr2Row1'>层级：</div>
+                <div className='E1mr2Row2'>{rightData.level}</div>
+              </div>
+              {/* <div className='E1mr2Row'>
+                    <div className='E1mr2Row1'>id：</div>
+                    <div className='E1mr2Row2'>{rightData.id}</div>
+                  </div> */}
+
+              <div className='E1mr2Row'>
+                <div className='E1mr2Row1'>排序值：</div>
+                <div className='E1mr2Row2'>{rightData.sort}</div>
+              </div>
+
+              <div className='E1mr2Row'>
+                <div className='E1mr2Row1'>标签说明：</div>
+                <div className='E1mr2Row2'>{rightData.description || '（空）'}</div>
+              </div>
+            </div>
+          </>
+        ) : null}
+      </div>
+
+      {/* 右侧 */}
+
+      <div className='E1top'></div>
 
       {/* 主体 */}
       <div className='E1main'>
         <div className='E1m1'>
-          <div className='E1m1ll'>
-            {treeDataTemp && treeDataTemp.length ? (
-              <Tree
-                // 默认全部展开
-                defaultExpandAll={true}
-                // 数据
-                treeData={treeData}
-                // 自定义字段
-                // fieldNames={{ title: 'title', key: 'key', children: 'children' }}
-                // 选中
-                selectedKeys={[acShu]}
-                // 点击
-                onSelect={onSelect}
-              />
-            ) : loding ? (
-              <div className='E1Null'>暂无数据</div>
-            ) : null}
-          </div>
-          <div className='E1m1rr'>
-            {rightData.id ? (
-              <>
-                <div className='E1mr2'>
-                  <div className='E1mr2Row E1mr2Row0'>
-                    <div className='E1mr2Row1'>操作：</div>
-                    <div>
-                      <Button type='text' onClick={() => addSonFu(rightData.id)}>
-                        编辑
-                      </Button>
-                      &emsp;
-                      <MyPopconfirm txtK='删除' onConfirm={() => delTree(rightData.id)} />
-                    </div>
-                  </div>
-
-                  <div className='E1mr2Row'>
-                    <div className='E1mr2Row1'>标签名称：</div>
-                    <div>{rightData.name}</div>
-                  </div>
-
-                  <div className='E1mr2Row'>
-                    <div className='E1mr2Row1'>标签说明：</div>
-                    <div className='E1mr2Row2_1'>{rightData.description || '（空）'}</div>
-                  </div>
-
-                  <div className='E1mr2Row'>
-                    <div className='E1mr2Row1'>层级：</div>
-                    <div>{rightData.level}</div>
-                  </div>
-                  {/* <div className='E1mr2Row'>
-                    <div className='E1mr2Row1'>id：</div>
-                    <div>{rightData.id}</div>
-                  </div> */}
-
-                  <div className='E1mr2Row'>
-                    <div className='E1mr2Row1'>排序值：</div>
-                    <div>{rightData.sort}</div>
-                  </div>
-                </div>
-              </>
-            ) : null}
-          </div>
+          <div className='E1m1rr'></div>
         </div>
       </div>
       {/* 新增/编辑页面 中图法分类 */}

src/pages/Isystem/I2dict/I2add.tsx

@@ -173,7 +173,7 @@ function I2add({ addInfo, addFu, closeFu }: Props) {
             <Input maxLength={20} showCount placeholder='请输入内容' />
           </Form.Item>
 
-          <Form.Item label='说明' name='intro'>
+          <Form.Item label='字典说明' name='intro'>
             <TextArea maxLength={500} showCount placeholder='请输入内容' />
           </Form.Item>
 

src/pages/Isystem/I2dict/index.module.scss

@@ -1,23 +1,20 @@
 .I2dict {
-  background-color: var(--boxBcaColor);
-  border-radius: 10px;
-  padding: 24px;
+  display: flex;
   :global {
-    .I2top {
-      display: flex;
-      justify-content: space-between;
-      .I2topll {
-        display: flex;
-        align-items: center;
-      }
+    .I2son {
+      width: 60%;
+      margin-right: 20px;
+      background-color: var(--boxBcaColor);
+      border-radius: 10px;
+      padding: 24px;
     }
-    .I2main {
-      margin-top: 20px;
-      height: calc(100% - 30px);
-      display: flex;
-      justify-content: space-between;
-      .I2m1ll {
-        width: 60%;
+
+    .I2ll {
+      .I2ll1 {
+        margin-bottom: 20px;
+      }
+      .I2ll2 {
+        height: calc(100% - 52px);
         overflow-y: auto;
         .site-tree-search-value {
           color: red;
@@ -61,43 +58,80 @@
             justify-content: space-around;
           }
         }
+        .ant-tree-title span {
+          font-size: 18px;
+        }
+
         .ant-tree-node-selected {
-          background-color: var(--themeColor2) !important;
+          padding: 4px 8px !important;
+          background-color: var(--txtColor) !important;
+          .ant-tree-title span {
+            color: var(--themeColor2) !important;
+          }
         }
       }
-      .I2m1rr {
-        width: calc(40% - 24px);
-        overflow-y: auto;
-        padding: 20px;
-        .I2mr1 {
-          font-weight: 700;
-          color: var(--themeColor);
-          font-size: 24px;
-          & > span {
-            color: #999;
-            font-size: 14px;
-          }
+    }
+
+    .I2rr {
+      width: calc(40% - 20px);
+      overflow-y: auto;
+      margin-right: 0;
+      .I2mr1 {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        font-weight: 700;
+        color: var(--themeColor);
+        font-size: 24px;
+        .I2mr1Tit {
+          color: #999;
+          font-size: 14px;
         }
-        .I2mr2 {
-          margin: 20px 0 40px;
-          .ant-btn {
-            font-size: 24px;
-            height: 46px;
+      }
+      .I2mr2 {
+        margin: 20px 0 40px;
+        display: flex;
+        .I2mr2Btn {
+          cursor: pointer;
+          margin-right: 15px;
+          width: 130px;
+          height: 40px;
+          line-height: 38px;
+          text-align: center;
+          color: #fff;
+          background-color: var(--txtColor);
+          border-radius: 4px;
+          font-size: 18px;
+          letter-spacing: 2px;
+          border: 1px solid transparent;
+          transition: all 0.3s;
+          &:hover {
+            transform: scale(1.1);
           }
         }
+        .I2mr2Btn2 {
+          color: #ff4d4d;
+          background-color: #fff;
+          border: 1px solid #ccc;
+        }
+        .I2mr2BtnNo {
+          color: #fff;
+          background-color: #ccc;
+          pointer-events: none;
+        }
+      }
 
-        .I2mr3 {
-          display: flex;
-          font-size: 20px;
-          margin-bottom: 30px;
-          .I2mr3ll {
-            width: 100px;
-            text-align: right;
-            font-weight: 700;
-          }
-          .I2mr3rr {
-            width: calc(100% - 100px);
-          }
+      .I2mr3 {
+        display: flex;
+        font-size: 20px;
+        margin-bottom: 30px;
+        .I2mr3ll {
+          width: 100px;
+          font-weight: 700;
+        }
+        .I2mr3rr {
+          width: calc(100% - 100px);
+          word-wrap: break-word;
         }
       }
     }

src/pages/Isystem/I2dict/index.tsx

@@ -9,6 +9,7 @@ import { I2_APIdel, I2_APIgetDict } from '@/store/action/Isystem/I2dict'
 import { filterTreeByName, I2AddInfoType, treeResIdFu } from './data'
 import I2add from './I2add'
 import { TypeI5Tree } from '../I5organization/data'
+import classNames from 'classnames'
 
 function I2dict() {
   const [loding, setLoding] = useState(false)
@@ -149,9 +150,10 @@ function I2dict() {
   return (
     <div className={styles.I2dict}>
       <div className='pageTitle'>数据字典</div>
-      {/* 顶部 */}
-      <div className='I2top'>
-        <div className='I2topll'>
+
+      {/* 左侧 */}
+      <div className='I2son I2ll'>
+        <div className='I2ll1'>
           <Input
             style={{ width: 300 }}
             placeholder='请输入字典值'
@@ -162,26 +164,8 @@ function I2dict() {
             allowClear
           />
         </div>
-        <div className='I2toprr'>
-          <Button
-            type='primary'
-            onClick={() =>
-              setAddInfo({
-                id: '-1',
-                txt: '新增',
-                acInfo: rightData
-              })
-            }
-          >
-            新增
-          </Button>
-          {/* &emsp; */}
-          {/* <Button onClick={() => resetFu(true)}>重置</Button> */}
-        </div>
-      </div>
-      {/* 主体 */}
-      <div className='I2main'>
-        <div className='I2m1ll'>
+
+        <div className='I2ll2'>
           {treeDataTemp && treeDataTemp.length ? (
             <Tree
               // 默认全部展开
@@ -203,56 +187,87 @@ function I2dict() {
             </div>
           ) : null}
         </div>
-        <div className='I2m1rr'>
-          {rightData.id ? (
-            <>
-              <div className='I2mr1'>
-                操作 <span>{rightData.parentId === '0' ? '（一级字典不可编辑）' : ''}</span>
+      </div>
+
+      {/* 右侧 */}
+      <div className='I2son I2rr'>
+        {rightData.id ? (
+          <>
+            <div className='I2mr1'>
+              <div>
+                操作{' '}
+                <span className='I2mr1Tit'>
+                  {rightData.parentId === '0' ? '（一级字典不可编辑）' : ''}
+                </span>
               </div>
-              <div className='I2mr2'>
-                <Button
-                  type='text'
-                  onClick={() => addSonFu(rightData.id)}
-                  disabled={rightData.parentId === '0'}
-                >
-                  编辑
-                </Button>
-                &emsp;
-                <MyPopconfirm
-                  txtK='删除'
-                  onConfirm={() => delTree(rightData.id)}
-                  disabled={rightData.parentId === '0'}
-                />
+
+              <Button
+                size='large'
+                type='primary'
+                onClick={() =>
+                  setAddInfo({
+                    id: '-1',
+                    txt: '新增',
+                    acInfo: rightData
+                  })
+                }
+              >
+                新增
+              </Button>
+            </div>
+            <div className='I2mr2'>
+              <div
+                onClick={() => addSonFu(rightData.id)}
+                className={classNames('I2mr2Btn', rightData.parentId === '0' ? 'I2mr2BtnNo' : '')}
+              >
+                编辑
               </div>
+              &emsp;
+              <MyPopconfirm
+                txtK='删除'
+                onConfirm={() => delTree(rightData.id)}
+                disabled={rightData.parentId === '0'}
+                Dom={
+                  <div
+                    className={classNames(
+                      'I2mr2Btn I2mr2Btn2',
+                      rightData.parentId === '0' ? 'I2mr2BtnNo' : ''
+                    )}
+                  >
+                    删除
+                  </div>
+                }
+              />
+            </div>
 
-              {/* <div className='I2mr3'>
+            {/* <div className='I2mr3'>
                 <div className='I2mr3ll'>id:</div>
                 <div className='I2mr3rr'>{rightData.id}</div>
               </div> */}
 
-              <div className='I2mr3'>
-                <div className='I2mr3ll'>字典值：</div>
-                <div className='I2mr3rr'>{rightData.name}</div>
-              </div>
+            <div className='I2mr3'>
+              <div className='I2mr3ll'>字典值：</div>
+              <div className='I2mr3rr'>{rightData.name}</div>
+            </div>
 
-              <div className='I2mr3'>
-                <div className='I2mr3ll'>层级：</div>
-                <div className='I2mr3rr'>{rightData.level}</div>
-              </div>
+            <div className='I2mr3'>
+              <div className='I2mr3ll'>层级：</div>
+              <div className='I2mr3rr'>{rightData.level}</div>
+            </div>
 
-              <div className='I2mr3'>
-                <div className='I2mr3ll'>排序值：</div>
-                <div className='I2mr3rr'>{rightData.sort}</div>
-              </div>
+            <div className='I2mr3'>
+              <div className='I2mr3ll'>排序值：</div>
+              <div className='I2mr3rr'>{rightData.sort}</div>
+            </div>
 
-              <div className='I2mr3'>
-                <div className='I2mr3ll'>说明：</div>
-                <div className='I2mr3rr'>{rightData.intro || '（空）'}</div>
-              </div>
-            </>
-          ) : null}
-        </div>
+            <div className='I2mr3'>
+              <div className='I2mr3ll'>字典说明：</div>
+              <div className='I2mr3rr'>{rightData.intro || '（空）'}</div>
+            </div>
+          </>
+        ) : null}
       </div>
+
       {/* 新增/编辑页面 中图法分类 */}
       {addInfo.id ? (
         <I2add

src/pages/Isystem/I5organization/index.module.scss

@@ -1,91 +1,128 @@
 .I5organization {
-  background-color: var(--boxBcaColor);
-  border-radius: 10px;
-  padding: 24px;
+  display: flex;
   :global {
-    .I5top {
-      display: flex;
-      justify-content: space-between;
+    .I5son {
+      width: 60%;
+      margin-right: 20px;
+      background-color: var(--boxBcaColor);
+      border-radius: 10px;
+      padding: 24px;
     }
 
-    .I5main {
-      margin-top: 15px;
-      height: calc(100% - 50px);
-      & > div {
-        height: 100%;
+    .I5ll {
+      .I5ll1 {
+        margin-bottom: 20px;
       }
-      .I5Null {
-        width: 100%;
-        height: 300px;
-        font-size: 24px;
-        display: flex;
-        justify-content: center;
-        align-items: center;
-      }
-      .I5m1 {
-        display: flex;
-        justify-content: space-between;
-        .I5m1ll {
-          width: 50%;
-          overflow-y: auto;
-          .site-tree-search-value {
-            color: red;
-            font-weight: 700;
+
+      .I5ll2 {
+        height: calc(100% - 52px);
+        overflow-y: auto;
+        .site-tree-search-value {
+          color: red;
+          font-weight: 700;
+        }
+        .ant-tree {
+          background-color: var(--boxBcaColor);
+          min-height: 100%;
+        }
+        .ant-tree-title span {
+          font-size: 18px;
+        }
+
+        .ant-tree-node-selected {
+          padding: 4px 8px !important;
+          background-color: var(--txtColor) !important;
+          .ant-tree-title span {
+            color: var(--themeColor2) !important;
           }
-          .ant-tree {
-            background-color: var(--boxBcaColor);
-            min-height: 100%;
+        }
+        .NODATA {
+          display: flex;
+          flex-direction: column;
+          justify-content: center;
+          align-items: center;
+          color: #666666;
+          font-size: 16px;
+          height: 100%;
+          // img {
+          //   width: 150px;
+          // }
+          & > p {
+            margin-bottom: 10px;
           }
-          .ant-tree-node-selected {
-            background-color: var(--themeColor2) !important;
+          div {
+            width: 80%;
+            margin-top: 8%;
+            display: flex;
+            justify-content: space-around;
           }
         }
-        .I5m1rr {
-          width: calc(50% - 24px);
+      }
+    }
 
-          .I5mr2 {
-            .I5mr2Row {
-              display: flex;
-              // align-items: center;
-              margin-bottom: 10px;
-              font-size: 20px;
-              .I5mr2Row1 {
-                font-weight: 700;
-                font-size: 20px;
-              }
+    .I5rr {
+      width: calc(40% - 20px);
+      overflow-y: auto;
+      margin-right: 0;
+      .I5mr2 {
+        .I5mr2_1 {
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          font-weight: 700;
+          color: var(--themeColor);
+          font-size: 24px;
+        }
+        .I5mr2_2 {
+          margin: 20px 0 40px;
+          display: flex;
+          .I5mr2Btn {
+            cursor: pointer;
+            margin-right: 15px;
+            width: 130px;
+            height: 40px;
+            line-height: 38px;
+            text-align: center;
+            color: #fff;
+            background-color: var(--txtColor);
+            border-radius: 4px;
+            font-size: 18px;
+            letter-spacing: 2px;
+            border: 1px solid transparent;
+            transition: all 0.3s;
+            &:hover {
+              transform: scale(1.1);
+            }
+          }
+          .I5mr2Btn2 {
+            color: #ff4d4d;
+            background-color: #fff;
+            border: 1px solid #ccc;
+          }
+        }
 
-              .ant-btn {
-                font-size: 20px;
-                height: 46px;
-              }
+        .I5mr2Row {
+          display: flex;
+          font-size: 20px;
+          margin-bottom: 30px;
 
-              .I5mr2Row2 {
-                width: calc(100% - 105px);
-                overflow: hidden;
-                text-overflow: ellipsis;
-                white-space: nowrap;
-              }
-              .I5mr2Row2_1 {
-                width: calc(100% - 105px);
-              }
-            }
-            .I5mr2Row0 {
-              margin-bottom: 0;
-              align-items: center;
-            }
-            .I5mr2RowLast {
-              align-items: self-start;
-              .I5mr2Row2 {
-                display: flex;
-                flex-wrap: wrap;
-              }
-            }
+          .I5mr2Row1 {
+            font-weight: 700;
+            font-size: 20px;
+            width: 100px;
           }
 
-          .I5mr3 {
-            margin-top: 15px;
-            height: calc(100% - 100px);
-            background-color: red;
+          .I5mr2Row2 {
+            width: calc(100% - 100px);
+            word-wrap: break-word;
+          }
+        }
+
+        .I5mr2RowLast {
+          align-items: self-start;
+          .I5mr2Row2 {
+            display: flex;
+            flex-wrap: wrap;
           }
         }
       }

src/pages/Isystem/I5organization/index.tsx

@@ -8,7 +8,9 @@ import { MessageFu } from '@/utils/message'
 import { I5_APIdel, I5_APIgetTree, I5_APIgetUserById } from '@/store/action/Isystem/I5organization'
 import { I5AddInfoType, TypeI5Tree, TypeI5UserList } from './data'
 import { filterTreeByName, treeResIdFu } from '../I2dict/data'
+import classNames from 'classnames'
 import I5add from './I5add'
+
 function I5organization() {
   const dispatch = useDispatch()
 
@@ -163,104 +165,111 @@ function I5organization() {
   return (
     <div className={styles.I5organization}>
       <div className='pageTitle'>组织管理</div>
-      <div className='I5top'>
-        <Input
-          style={{ width: 300 }}
-          placeholder='请输入部门名称'
-          maxLength={30}
-          showCount
-          value={value}
-          onChange={e => valueChange(e.target.value)}
-          allowClear
-        />
-        <Button
-          type='primary'
-          onClick={() => setAddInfo({ id: '-1', txt: '新增', acInfo: rightData })}
-        >
-          新增
-        </Button>
-      </div>
 
-      {/* 主体 */}
-      <div className='I5main'>
-        <div className='I5m1'>
-          <div className='I5m1ll'>
-            {treeDataTemp && treeDataTemp.length ? (
-              <Tree
-                // 默认全部展开
-                defaultExpandAll={true}
-                // 数据
-                treeData={treeData}
-                // 自定义字段
-                // fieldNames={{ title: 'title', key: 'key', children: 'children' }}
-                // 选中
-                selectedKeys={[acShu]}
-                // 点击
-                onSelect={onSelect}
-              />
-            ) : loding ? (
-              <div className='I5Null'>暂无数据</div>
-            ) : null}
-          </div>
-          <div className='I5m1rr'>
-            {rightData.id ? (
-              <>
-                <div className='I5mr2'>
-                  <div className='I5mr2Row I5mr2Row0'>
-                    <div className='I5mr2Row1'>操作：</div>
-                    <div>
-                      <Button type='text' onClick={() => addSonFu(rightData.id)}>
-                        编辑
-                      </Button>
-                      &emsp;
-                      <MyPopconfirm txtK='删除' onConfirm={() => delTree(rightData.id)} />
-                    </div>
-                  </div>
-
-                  <div className='I5mr2Row'>
-                    <div className='I5mr2Row1'>部门名称：</div>
-                    <div>{rightData.name}</div>
-                  </div>
-
-                  <div className='I5mr2Row'>
-                    <div className='I5mr2Row1'>部门说明：</div>
-                    <div className='I5mr2Row2_1'>{rightData.description || '（空）'}</div>
-                  </div>
-
-                  <div className='I5mr2Row'>
-                    <div className='I5mr2Row1'>层级：</div>
-                    <div>{rightData.level}</div>
-                  </div>
-                  {/* <div className='I5mr2Row'>
+      {/* 左侧 */}
+      <div className='I5son I5ll'>
+        <div className='I5ll1'>
+          <Input
+            style={{ width: 300 }}
+            placeholder='请输入部门名称'
+            maxLength={30}
+            showCount
+            value={value}
+            onChange={e => valueChange(e.target.value)}
+            allowClear
+          />
+        </div>
+        <div className='I5ll2'>
+          {treeDataTemp && treeDataTemp.length ? (
+            <Tree
+              // 默认全部展开
+              defaultExpandAll={true}
+              // 数据
+              treeData={treeData}
+              // 自定义字段
+              // fieldNames={{ title: 'title', key: 'key', children: 'children' }}
+              // 选中
+              selectedKeys={[acShu]}
+              // 点击
+              onSelect={onSelect}
+            />
+          ) : loding ? (
+            <div className='NODATA'>暂无相关搜索结果，请更换关键字搜索</div>
+          ) : null}
+        </div>
+      </div>
+      {/* 右侧 */}
+      <div className='I5son I5rr'>
+        {rightData.id ? (
+          <>
+            <div className='I5mr2'>
+              <div className='I5mr2_1'>
+                <div>操作：</div>
+                <Button
+                  size='large'
+                  type='primary'
+                  onClick={() => setAddInfo({ id: '-1', txt: '新增', acInfo: rightData })}
+                >
+                  新增
+                </Button>
+              </div>
+
+              <div className='I5mr2_2'>
+                <div onClick={() => addSonFu(rightData.id)} className={classNames('I5mr2Btn')}>
+                  编辑
+                </div>
+                &emsp;
+                <MyPopconfirm
+                  txtK='删除'
+                  onConfirm={() => delTree(rightData.id)}
+                  disabled={rightData.parentId === '0'}
+                  Dom={<div className={classNames('I5mr2Btn I5mr2Btn2')}>删除</div>}
+                />
+              </div>
+
+              <div className='I5mr2Row'>
+                <div className='I5mr2Row1'>部门名称：</div>
+                <div className='I5mr2Row2'>{rightData.name}</div>
+              </div>
+
+              <div className='I5mr2Row'>
+                <div className='I5mr2Row1'>层级：</div>
+                <div className='I5mr2Row2'>{rightData.level}</div>
+              </div>
+              {/* <div className='I5mr2Row'>
                     <div className='I5mr2Row1'>id：</div>
-                    <div>{rightData.id}</div>
+                    <div className='I5mr2Row2'>{rightData.id}</div>
                   </div> */}
 
-                  <div className='I5mr2Row'>
-                    <div className='I5mr2Row1'>排序值：</div>
-                    <div>{rightData.sort}</div>
-                  </div>
-
-                  <div className='I5mr2Row I5mr2RowLast'>
-                    <div className='I5mr2Row1'>相关成员：</div>
-                    <div className='I5mr2Row2'>
-                      {userList.length
-                        ? userList.map((v, i) => (
-                            <div key={v.userId}>
-                              {v.userName}
-                              {v.isLeader === 1 ? '（部门主管）' : ''}
-                              {i < userList.length - 1 ? '，' : ''}
-                            </div>
-                          ))
-                        : '（空）'}
-                    </div>
-                  </div>
+              <div className='I5mr2Row'>
+                <div className='I5mr2Row1'>排序值：</div>
+                <div className='I5mr2Row2'>{rightData.sort}</div>
+              </div>
+
+              <div className='I5mr2Row'>
+                <div className='I5mr2Row1'>部门说明：</div>
+                <div className='I5mr2Row2'>{rightData.description || '（空）'}</div>
+              </div>
+
+              <div className='I5mr2Row I5mr2RowLast'>
+                <div className='I5mr2Row1'>相关成员：</div>
+                <div className='I5mr2Row2'>
+                  {userList.length
+                    ? userList.map((v, i) => (
+                        <div key={v.userId}>
+                          {v.userName}
+                          {v.isLeader === 1 ? '（部门主管）' : ''}
+                          {i < userList.length - 1 ? '，' : ''}
+                        </div>
+                      ))
+                    : '（空）'}
                 </div>
-              </>
-            ) : null}
-          </div>
-        </div>
+              </div>
+            </div>
+          </>
+        ) : null}
       </div>
+
       {/* 新增/编辑页面 中图法分类 */}
       {addInfo.id ? (
         <I5add

src/pages/Zother/SelectGoods/index.module.scss

@@ -0,0 +1,66 @@
+// 新增弹窗页面
+.SelectGoods {
+  :global {
+    .sgtit {
+      display: flex;
+      justify-content: space-between;
+    }
+
+    .ant-modal-close {
+      display: none;
+    }
+
+    .ant-modal {
+      width: 1600px !important;
+      min-width: 1600px;
+      top: 40px !important;
+    }
+
+    .ant-modal-body {
+      border-top: 1px solid #ccc;
+    }
+
+    .sgMain {
+      padding-top: 15px;
+      .sgTop {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 15px;
+        .sgtopll {
+          display: flex;
+          width: calc(100% - 140px);
+          & > div {
+            flex: 1;
+            position: relative;
+            margin-right: 15px;
+            display: flex;
+            align-items: center;
+            .ant-select {
+              width: 100%;
+            }
+          }
+        }
+        .sgtoprr {
+          width: 142px;
+        }
+      }
+      .ant-table-cell {
+        padding: 8px !important;
+        text-align: center !important;
+      }
+      .ant-btn-text {
+        color: var(--themeColor);
+      }
+      .tableImgAuto {
+        display: flex;
+        justify-content: center;
+      }
+      .sgMainBtn {
+        position: relative;
+        top: 15px;
+        text-align: center;
+      }
+    }
+  }
+}

src/pages/Zother/SelectGoods/index.tsx

@@ -0,0 +1,237 @@
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import styles from './index.module.scss'
+import { GoodsType } from '../SonGoodsList/data'
+import { Button, Cascader, Checkbox, Input, Modal, Select } from 'antd'
+import { openLink } from '@/utils/history'
+import { MessageFu } from '@/utils/message'
+import MyTable from '@/components/MyTable'
+import MyPopconfirm from '@/components/MyPopconfirm'
+
+type Props = {
+  API_getList: any
+  baseFormData: any
+  topSelectDom: any
+  columnsTemp: any
+  closeFu: () => void
+  dataResFu: (data: GoodsType[]) => void
+  oldCheckArr: GoodsType[]
+  // 单选
+  isOne?: boolean
+  //其他额外的参数
+  canObj?: any
+}
+
+function SelectGoods({
+  API_getList,
+  baseFormData,
+  topSelectDom,
+  columnsTemp,
+  closeFu,
+  dataResFu,
+  oldCheckArr,
+  isOne,
+  canObj
+}: Props) {
+  const [formData, setFormData] = useState({ ...baseFormData })
+  const formDataRef = useRef({ ...baseFormData })
+
+  useEffect(() => {
+    formDataRef.current = { ...formData }
+  }, [formData])
+
+  // 点击搜索的 时间戳
+  const [timeKey, setTimeKey] = useState(0)
+
+  // 点击搜索
+  const clickSearch = useCallback(() => {
+    setTimeout(() => {
+      setTimeKey(Date.now())
+    }, 50)
+  }, [])
+
+  // 点击重置
+  const resetSelectFu = useCallback(() => {
+    setFormData({ ...baseFormData })
+    setTimeout(() => {
+      setTimeKey(Date.now())
+    }, 50)
+  }, [baseFormData])
+
+  const [tableList, setTableList] = useState<GoodsType[]>([])
+  const [tableListAll, setTableListAll] = useState<GoodsType[]>([])
+
+  // 封装发送请求的函数
+  const getList = useCallback(async () => {
+    let canObjTemp = canObj || {}
+    const obj = {
+      ...formDataRef.current,
+      ...canObjTemp
+    }
+
+    const res = await API_getList(obj)
+    if (res.code === 0) {
+      setTableList(res.data.records || [])
+      if (timeKey === 0) setTableListAll(res.data.records || [])
+    }
+  }, [API_getList, canObj, timeKey])
+
+  useEffect(() => {
+    getList()
+  }, [getList])
+
+  // 多选
+  const [checkArr, setCheckArr] = useState<GoodsType[]>([])
+
+  // 旧数组
+  useEffect(() => {
+    setCheckArr(oldCheckArr)
+  }, [oldCheckArr])
+
+  // 过滤掉 tableList 里面没有的id
+  const resNum = useMemo(() => {
+    const tableIds = tableListAll.map(v => v.id)
+    const arr = checkArr.filter(v => tableIds.includes(v.id))
+    return arr.length
+  }, [checkArr, tableListAll])
+
+  const checkFu = useCallback(
+    (item: GoodsType) => {
+      // 单选
+      if (isOne) {
+        if (checkArr && checkArr.length && item.id === checkArr[0].id) {
+          setCheckArr([])
+        } else setCheckArr([item])
+      } else {
+        if (checkArr.map(v => v.id).includes(item.id))
+          setCheckArr(checkArr.filter(v => v.id !== item.id))
+        else setCheckArr([...checkArr, item])
+      }
+    },
+    [checkArr, isOne]
+  )
+  const staBtn = useMemo(() => {
+    return [
+      {
+        title: isOne ? '单选' : '选择',
+        width: 50,
+        render: (item: GoodsType) => (
+          <Checkbox
+            checked={checkArr.map(v => v.id).includes(item.id)}
+            onChange={() => checkFu(item)}
+          ></Checkbox>
+        )
+      }
+    ]
+  }, [checkArr, checkFu, isOne])
+
+  const tableLastBtn = useMemo(() => {
+    return [
+      {
+        title: '操作',
+        render: (item: GoodsType) => {
+          return (
+            <Button size='small' type='text' onClick={() => openLink(`/goodsLook/${item.id}`)}>
+              查看
+            </Button>
+          )
+        }
+      }
+    ]
+  }, [])
+
+  // 点击提交
+  const btnOk = useCallback(() => {
+    dataResFu(checkArr)
+    if (!isOne) MessageFu.success('提交成功')
+    closeFu()
+  }, [checkArr, closeFu, dataResFu, isOne])
+
+  // 顶部筛选
+  const searchDom = useCallback(
+    (arr: any[]) => {
+      return arr.map(item => {
+        return (
+          <div key={item.name}>
+            {item.type === 'Input' ? (
+              <Input
+                value={formData[item.key]}
+                onChange={e => setFormData({ ...formData, [item.key]: e.target.value })}
+                placeholder={item.name}
+                maxLength={30}
+                showCount
+              />
+            ) : item.type === 'Select' ? (
+              <Select
+                options={item.options}
+                placeholder={item.name}
+                allowClear={true}
+                value={formData[item.key] || null}
+                onChange={e => setFormData({ ...formData, [item.key]: e })}
+              />
+            ) : item.type === 'Cascader' ? (
+              <Cascader
+                changeOnSelect
+                options={item.options}
+                placeholder={item.name}
+                fieldNames={{ label: 'name', value: 'id', children: 'children' }}
+                allowClear={!item.must}
+                value={formData[item.key] ? formData[item.key].split(',') : []}
+                onChange={e => setFormData({ ...formData, [item.key]: e ? e.join(',') : '' })}
+              />
+            ) : null}
+          </div>
+        )
+      })
+    },
+    [formData]
+  )
+
+  return (
+    <Modal
+      wrapClassName={styles.SelectGoods}
+      open={true}
+      title={
+        <div className='sgtit'>
+          <div>选择藏品</div> <div>已选中 {resNum} 条</div>
+        </div>
+      }
+      footer={[]}
+    >
+      <div className='sgMain'>
+        <div className='sgTop'>
+          <div className='sgtopll'>{searchDom(topSelectDom)}</div>
+          <div className='sgtoprr'>
+            <Button type='primary' onClick={clickSearch}>
+              查询
+            </Button>
+            &emsp;
+            <Button onClick={resetSelectFu}>重置</Button>
+          </div>
+        </div>
+
+        {/* 表格 */}
+        <MyTable
+          yHeight={575}
+          classKey='ZGaddNow'
+          list={tableList}
+          columnsTemp={columnsTemp}
+          staBtn={staBtn}
+          lastBtn={tableLastBtn}
+          pagingInfo={false}
+        />
+
+        <div className='sgMainBtn'>
+          <Button type='primary' disabled={resNum === 0 && isOne} onClick={btnOk}>
+            提交
+          </Button>
+          &emsp;
+          <MyPopconfirm txtK='取消' onConfirm={closeFu} />
+        </div>
+      </div>
+    </Modal>
+  )
+}
+
+const MemoSelectGoods = React.memo(SelectGoods)
+
+export default MemoSelectGoods

src/pages/Zother/SonGoodsList/data.ts

@@ -1,3 +1,5 @@
+import { getDictFu, selectObj } from '@/utils/dataChange'
+
 // 藏品类型
 export type GoodsType = {
   ageDictId: string
@@ -58,3 +60,39 @@ export type GoodsType = {
   // 不用录数据库，新增和编辑 用这个区分
   isNew: boolean
 }
+
+// 藏品征集选择
+export const sgBaseFormData = {
+  pageNum: 1,
+  pageSize: 99999,
+
+  typeDictId: '',
+  ageDictId: '',
+  tornLevel: ''
+}
+
+export const sgTopSelectDom = [
+  {
+    name: '搜索线索编号、线索名称',
+    key: 'searchKey',
+    type: 'Input'
+  },
+  {
+    name: '初定类别',
+    key: 'typeDictId',
+    type: 'Cascader',
+    options: getDictFu('藏品类别')
+  },
+  {
+    name: '初定年代',
+    key: 'ageDictId',
+    type: 'Cascader',
+    options: getDictFu('藏品类别')
+  },
+  {
+    name: '完残程度',
+    key: 'tornLevel',
+    type: 'Select',
+    options: selectObj['完残程度']
+  }
+]

src/pages/Zother/SonGoodsList/index.tsx

@@ -1,16 +1,17 @@
-import React, { useCallback, useMemo, useState } from 'react'
+import React, { useMemo, useState } from 'react'
 import styles from './index.module.scss'
 import { Button } from 'antd'
 import MyTable from '@/components/MyTable'
 import MyPopconfirm from '@/components/MyPopconfirm'
 import AddGoods from '../AddGoods'
 import { useInfo } from '../InfoContext'
-import { GoodsType } from './data'
-import { D1_APIgoodsSave } from '@/store/action/Dmanage/D1register'
-import { goodsSonTableC } from '@/utils/tableData'
+import { GoodsType, sgBaseFormData, sgTopSelectDom } from './data'
+import { D1_APIgetClueList, D1_APIgoodsSave } from '@/store/action/Dmanage/D1register'
+import { goodsSelectCuleC, goodsSonTableC } from '@/utils/tableData'
 import { useParams } from 'react-router-dom'
 import { openLink } from '@/utils/history'
 import { FileUpInfoType } from '../data'
+import SelectGoods from '../SelectGoods'
 
 type Props = {
   // 上传附件的信息
@@ -62,10 +63,7 @@ function SonGoodsList({ fileUpInfo }: Props) {
   }, [delSnapIdsRef, isLook, setSnapsFu, snaps])
 
   // 从征集线索中添加
-  const [clueArr, setClueArr] = useState<GoodsType[]>([])
-  const getClueArrFu = useCallback(async () => {
-    // const res
-  }, [])
+  const [clueShow, setClueShow] = useState(false)
 
   return (
     <div className={styles.SonGoodsList}>
@@ -75,8 +73,9 @@ function SonGoodsList({ fileUpInfo }: Props) {
           <div></div>
         ) : (
           <div>
-            {/* 待完善sg-等蓝鑫写完征集 */}
-            <Button type='primary'>从征集线索中添加</Button>
+            <Button type='primary' onClick={() => setClueShow(true)}>
+              从征集线索中添加
+            </Button>
             <Button type='primary' onClick={() => setOpenInfo({ id: -1 } as GoodsType)}>
               新增
             </Button>
@@ -118,6 +117,19 @@ function SonGoodsList({ fileUpInfo }: Props) {
           }}
         />
       ) : null}
+
+      {/* 从藏品征集中添加 */}
+      {clueShow ? (
+        <SelectGoods
+          API_getList={D1_APIgetClueList}
+          baseFormData={sgBaseFormData}
+          topSelectDom={sgTopSelectDom}
+          columnsTemp={goodsSelectCuleC}
+          closeFu={() => setClueShow(false)}
+          oldCheckArr={snaps}
+          dataResFu={data => {}}
+        />
+      ) : null}
     </div>
   )
 }

src/utils/tableData.ts

@@ -54,6 +54,16 @@ export const goodsSonTableC = [
   ['ping', '数量', 'pcs', 'pcsUnitDictId']
 ]
 
+// 藏品登记-里面选择藏品征集列表
+export const goodsSelectCuleC = [
+  ['txt', '线索编号', 'num'],
+  ['img', '封面', 'thumb'],
+  ['txt', '线索名称', 'name'],
+  ['txtC', '初定类别', 'typeDictId'],
+  ['txtC', '初定年代', 'ageDictId'],
+  ['select', '完残程度', 'tornLevel', selectObj['完残程度']]
+]
+
 export const I3tableC = [
   ['txt', '编号类型', 'name'],
   ['txt', '前缀', 'prefix'],