feat: 添加内容管理分类管理，修改内容管理资讯

config/routes/index.ts

@@ -21,7 +21,7 @@
 // import rfqRoute from './rfqRoute' // 询价单路由
 // import rfqOfferRoute from './rfqOfferRoute' // 询价单路由
 // import commentRoutes from './commentRoutes';
-// import contentRoute from './contentRoute';  // 内容管理
+import contentRoute from './contentRoute';  // 内容管理
 // import balancedRoute from './balancedRoute'; // 平台结算管理
 // import capitalAccount from './capitalAccountRoute'; // 会员资金账户
 // import messageRoute from './messgeRoute'; // 消息管理
@@ -39,18 +39,18 @@ const routeList = [
 //   pageCustomized,
 //   calssPropertyRoute,
 //   trademarkRoute,
-  // commodity,
+//   commodity,
 //   rfqRoute,
 //   rfqOfferRoute,
 //   logisticsRoutes,
 //   memberAbility,
-  // ruleSettingRoutes,
+//   ruleSettingRoutes,
 //   authConfig,
 //   commentRoutes,
-  // contentRoute,
+//   contentRoute,
 //   balancedRoute,
-// demandRoute,
-// procurementRoute,
+//   demandRoute,
+//   procurementRoute,
 //   demandQuoteOrderRoute,
 //   capitalAccount,
 //   messageRoute,
@@ -58,7 +58,7 @@ const routeList = [
 //   orderSystemRoutes,
 //   productionNoticeRoutes,
 //   exchangeManageRoutes,
-  // returnManageRoute,
+//  returnManageRoute,
 //   repairManageRoute,
 ]
 

src/constants/const/content.tsx

+/**
+ * 内容管理常量
+ */
+
+/**
+ * 栏目管理 - 栏目分类 - 市场行情
+ * @value = 1
+ */
+export const COLUMN_MARKET_CATEGORY = 1;
+
+/**
+ * 栏目管理 - 栏目分类 - 资讯
+ * @value = 2
+ */
+export const COLUMN_INFOMATION_CATEGORY = 2;
+
+/**
+ *
+ */
+
+export const COLUMN_CATEGORY = {
+  [COLUMN_MARKET_CATEGORY]: '市场行情',
+  [COLUMN_INFOMATION_CATEGORY]: '资讯'
+}

src/global/styles/theme.less

@@ -15,6 +15,7 @@
 
 // global main color
 @main-color: #00B37A;
+@secondary-color: #E4F7EF;
 
 // layout
 @header-global-nav-bg: #38414A;
@@ -29,4 +30,3 @@
 @status-invalid: #FFC400; // 未生成，无效、待审核
 @status-nopass: #EF6260; // 审核不通过
 
-

src/pages/content/components/CustomSearch/index.tsx

 import React from 'react';
 import { Input } from 'antd';
+import styles from './styles.less'
 
 const { Search } = Input;
 
@@ -11,17 +12,19 @@ const CustomSearch = (props) => {
   }
 
   return (
-    // <Search  disabled={!editable} value={props.value} onChange={handleChange}>置顶</Search>
-    <Search
-      disabled={!editable}
-      value={props.value} 
-      onChange={handleChange}
-      {...componentProps}
-      // onSearch={value => console.log(value)}
-    />  
+    <div className={styles.container}>
+      <Search
+        disabled={!editable}
+        value={props.value}
+        onChange={handleChange}
+        {...componentProps}
+        // onSearch={value => console.log(value)}
+      />
+    </div>
+
   )
 }
 
 CustomSearch.isFieldComponent = true
 
-export default CustomSearch
+export default CustomSearch
\ No newline at end of file

src/pages/content/components/CustomSearch/styles.less

+.container {
+  :global {
+    .input-search {
+      // background-color: red;
+      .ant-input-wrapper {
+        .ant-input {
+          height: 32px !important;
+        }
+      }
+    }
+
+  }
+}

src/pages/content/components/Tags/Tags.less

+
 .tagContainer {
 
   .selection {
@@ -14,11 +15,11 @@
       display: flex;
       flex-direction: row;
       justify-content: center;
-      align-items: center;      
-      background-color: #4279DF;
-      color: #fff;
+      align-items: center;
+      background-color: @secondary-color;
+      color: @main-color;
       border-radius: 4px;
-      
+
       .icon {
         margin-left: 4px;
         cursor: pointer;
@@ -54,4 +55,4 @@
       margin-bottom: 16px;
     }
   }
-}
+}
\ No newline at end of file

src/pages/content/infomation/infomationInfo.tsx

@@ -14,12 +14,26 @@ import { PublicApi } from '@/services/api';
 import infomationInfoSchema from './schema/infomationInfoSchema';
 import CustomUpload from '../components/WrapCustomUpload';
 import useCustomValidator from '../hooks/useValidator'
+import { GetManageContentCategoryAllResponse } from '@/services/PlatformApi';
+import { COLUMN_CATEGORY } from '@/constants/const/content';
 
 const actions = createFormActions();
 const { onFieldValueChange$ } = FormEffectHooks
 
 const { TextArea } = Input;
 
+/**
+ * 栏目分类
+ * 1.市场行情；2.资讯
+ */
+type ColumnType = 0 | 1 | 2;
+
+type ColumnListType = {
+  label: string,
+  value: number,
+  type: 1 | 2
+}
+
 const InfomationInfo = () => {
   useCustomValidator();
   const { id, preview } = usePageStatus();
@@ -27,7 +41,10 @@ const InfomationInfo = () => {
   const [labelIds, setLabelIds] = useState<number[]>([]);
   const [submitLoading, setSubmitLoading ] = useState(false);
   const [unsaved, setUnsaved] = useState(true);
+  const [type, setType] = useState<ColumnType>(0);
   const initialValues  = useInitialValues({id:id}, PublicApi.getManageContentInformationGet);
+  const [category, setCategory] = useState<GetManageContentCategoryAllResponse>([]);
+  const [column, setColumn] = useState<ColumnListType[]>([])
   const isEdit = id && !preview;
   const isAdd = !id && !preview;
   const isView = id && preview;
@@ -43,8 +60,9 @@ const InfomationInfo = () => {
   useEffect(() => {
     async function getColumn() {
       const res = await PublicApi.getManageContentColumnAll();
-      const columns = res.data.map((item) => ({label: item.name, value: item.id, type: item.type}));
-      setFormStatus("layout.columnId", "options", columns)
+      const list = res.data.map((item) => ({label: item.name, value: item.id, type: item.type}));
+      setFormStatus("layout.columnId", "options", list)
+      setColumn(list)
     }
     getColumn()
   }, [])
@@ -58,6 +76,21 @@ const InfomationInfo = () => {
       getLabels()
   }, [])
 
+  /**
+   * 获取行情分类
+   */
+  useEffect(() => {
+    async function getCategory() {
+      const { data, code, message } = await PublicApi.getManageContentCategoryAll();
+      if (code !== 1000) return;
+      const list = data.map((_item) => ({ label: _item.name, value: _item.id, children: _item.list }) );
+      setFormStatus("layout.categoryLayout.firstCategoryId", "options", list);
+      // sethasGetCategory(true)
+      setCategory(data);
+    }
+    getCategory();
+  }, [])
+
   useEffect(() => {
     const data = initialValues.data || {}
     const content = data.content;
@@ -66,17 +99,40 @@ const InfomationInfo = () => {
       actions.setFieldValue('layout.contentLayout.content',  editorState);
     }
     setFormStatus('layout.contentLayout.content', 'readOnly', isView);
+    if(category) {
+      const secondCategory = category.filter((_row) => _row.id === data.firstCategoryId)[0]?.list || [];
+      const options = secondCategory.map((_row: any) => ({label: _row.name, value: _row.id, children: _row.list }))
+      setFormStatus('layout.categoryLayout.secondCategoryId', 'options', options);
+      actions.setFieldValue('layout.categoryLayout.secondCategoryId',  data.secondCategoryId);
+
+      const thirdCategory = options.filter((_row) => _row.value === data.secondCategoryId)[0]?.children || [];
+      const thirdOptions = thirdCategory.map((_row: any) => ({label: _row.name, value: _row.id, children: _row.list }))
+      setFormStatus('layout.categoryLayout.thirdlyCategoryId', 'options', thirdOptions);
+      actions.setFieldValue('layout.categoryLayout.thirdlyCategoryId',  data.thirdlyCategoryId);
+    }
+    if (column) {
+      const targetColumn = column.filter((_item) => _item.value === data.columnId)[0];
+      if(targetColumn) {
+        actions.setFieldState('layout.columnId', state => {
+          state.props['description'] = `栏目分类：${COLUMN_CATEGORY[targetColumn?.type] || ''}`
+        })
+        setType(targetColumn?.type)
+      }
+
+    }
+
     setFormStatus('layout.imageUpload', 'imgUrl', data.imageUrl)
     setIsTop(data.top);
     setLabelIds(data.labelIds)
     setFormStatus('layout.labelIds', 'seletedTag', data.labelIds)
-  }, [initialValues])
+  }, [initialValues, category, column])
 
   const handleSubmit = (value) => {
     const content = value.content.toHTML();
     const tempPostData = {
       ...value,
       top: isTop,
+      type: type,
       labelIds: labelIds,
       content: content,
     }
@@ -119,13 +175,26 @@ const InfomationInfo = () => {
             TextArea, Checkbox,
             CustomUpload, CustomTags, CustomEditor,
           }}
-          effects={() => {
+          effects={($) => {
+
             onFieldValueChange$('layout.columnId').subscribe(({ value }) => {
               actions.setFieldState('layout.columnId', state => {
-                const currentType = state.props["x-component-props"]!.options.filter((_row) => _row.value === value)[0];
-                state["props"]["description"] = `栏目分类：${currentType && (currentType.type === 1 ? '市场行情': '资讯') || ''}`
+                const currentType = state.props["x-component-props"]!.options?.filter((_row) => _row.value === value)[0];
+                state["props"]["description"] = `栏目分类：${currentType && (COLUMN_CATEGORY[currentType.type])}`;
+                setType(currentType ? currentType.type : 0)
+              })
+            })
+            onFieldValueChange$('layout.categoryLayout.*(firstCategoryId,secondCategoryId)').subscribe(({ value, props, name }) => {
+              const childrenName = name === 'firstCategoryId' ? 'secondCategoryId' : 'thirdlyCategoryId';
+              const optionChildren = props["x-component-props"]!.options.filter((_row) => _row.value === value)[0]?.children || [];
+              console.log(optionChildren)
+              const list = optionChildren?.map((_item) => ({ label: _item.name, value: _item.id, children: _item.list }) );
+              actions.setFieldState(`layout.categoryLayout.${childrenName}`, state => {
+                state.value = "",
+                state.props['x-component-props']!["options"] = list;
               })
             })
+
           }}
           expressionScope={{
             isTop: (
@@ -164,7 +233,7 @@ const InfomationInfo = () => {
           }
         </SchemaForm>
       </Card>
-      <Prompt when={unsaved} message="您还有未保存的内容，是否确定要离开？" />
+      <Prompt when={(isAdd || isEdit) && unsaved} message="您还有未保存的内容，是否确定要离开？" />
       </PageHeaderWrapper>
     </div>
   )

src/pages/content/infomation/schema/index.tsx

@@ -2,17 +2,22 @@ import EyePreview from '@/components/EyePreview';
 import { DownOutlined, DeleteOutlined, UpOutlined } from '@ant-design/icons';
 import { timeRange } from '@/utils/index';
 import { TimeList } from '../../statusList';
+import { COLUMN_CATEGORY } from '@/constants/const/content';
 import moment from 'moment';
 import React from 'react';
 
 const CustomTimeList = [{label: '全部', value: 0}].concat(TimeList.slice(1));
 
 const columns = [
-	{title: 'ID', dataIndex: 'id'},
-	{
-		title: '栏目', dataIndex: 'columnName',
-	},
-  { title: '标题',
+	{ title: 'ID', dataIndex: 'id' },
+  {
+    title: '栏目分类',
+    dataIndex: 'type',
+    render: (text) => COLUMN_CATEGORY[text],
+  },
+	{ title: '栏目', dataIndex: 'columnName' },
+  {
+    title: '标题',
     dataIndex: 'title',
     render: (text: string, record: any) => (
       <EyePreview
@@ -22,9 +27,17 @@ const columns = [
       </EyePreview>
     )
   },
+  { title: '分类', dataIndex: 'categoryName' },
+  { title: '推荐标签', dataIndex: 'labelNames' },
   {
-    title: '操作时间',
+    title: '排序',
+    dataIndex: 'sort',
+    sorter: (a, b) => a.sort - b.sort,
+  },
+  {
+    title: '发布时间',
     dataIndex: 'createTime',
+    sorter: (a, b) => a.createTime - b.createTime,
     render: (text) => (
       moment(text).format('YYYY-MM-DD HH:mm:ss')
     )
@@ -138,6 +151,9 @@ const infomationSchema = {
                   'x-component': 'CustomSearch',
                   'x-component-props': {
                     placeholder: "请填写标题名称",
+                    style: {
+                      marginRight: '12px'
+                    },
                     "onSearch": "{{search}}",
                   }
                 },

src/pages/content/infomation/schema/infomationInfoSchema.tsx

@@ -61,20 +61,6 @@ const schema = {
             "message": "请选择咨询说明"
           },
         },
-        // columnLayout: {
-        //   type: 'object',
-        //   'x-component': 'mega-layout',
-        //   'x-component-props': {
-        //     "label": '栏目',
-        //     // full: true,
-        //     "layoutProps": {
-        //       "wrapperCol": 10
-        //     }
-        //   },
-        //   properties: {
-
-        //   }
-        // },
         recommendLabel: {
           name: 'recommendLabel',
           title: '推荐标签',
@@ -128,12 +114,9 @@ const schema = {
         sort: {
           name: 'sort',
           type: 'string',
-          title: '推荐标签',
+          title: '推荐排序',
           'x-component': 'Select',
           'x-component-props': {
-            // style: {
-            //   width: '100%'
-            // },
             options: sortedList,
             allowClear: true,
 
@@ -165,25 +148,41 @@ const schema = {
             "wrapperCol": 24,
           },
           properties: {
-            category: {
+            firstCategoryId: {
               type: 'string',
               "x-component": "Select",
-              wrapperCol: 24,
               'x-component-props': {
-                // layoutProps: {
-                // },
-                style: {
-                  width: '100%',
-                }
-              }
+                options: [],
+              },
+              'x-linkages': [
+                {
+                  type: 'value:visible',
+                  target: '*(secondCategoryId)',
+                  condition: `{{!!$value}}`,
+
+                },
+              ]
             },
-            category2: {
+            secondCategoryId: {
               type: 'string',
-              "x-component": "Select",
+              'x-component': "Select",
+              'x-component-props': {
+                options: [],
+              },
+              'x-linkages': [
+                {
+                  type: 'value:visible',
+                  target: '*(thirdlyCategoryId)',
+                  condition: '{{!!$value}}'
+                },
+              ]
             },
-            category3: {
+            thirdlyCategoryId: {
               type: 'string',
-              "x-component": "Select",
+              'x-component': "Select",
+              'x-component-props': {
+                options: [],
+              },
             }
           }
         },

src/pages/demand/components/detail/index.less

 .anchorWrap {
-  :global {
+  : {
     .ant-anchor {
       display: flex;
       .ant-anchor-ink {
@@ -35,7 +35,7 @@
 /** 卡片样式 */
 .card {
   margin: 24px;
-  :global {
+  : {
     .ant-card {
       margin-bottom: 24px;
       .ant-card-head {