房产项目标签新建关联表

src/pages/mpEstate/estateList/edite/components/projectTag.tsx

@@ -12,6 +12,7 @@ const { Option } = Select;
 
 const ProjectTagComponent = (props: any) => {
   const { baseData, isEdite } = props;
+  const { projectTag = [] } = baseData;
 
   const [form] = Form.useForm();
 
@@ -19,6 +20,12 @@ const ProjectTagComponent = (props: any) => {
 
   const [currentTag, setCurrentTag] = useState([]);
 
+  const [updateTag, setUpdateTag] = useState([]);
+
+  useEffect(() => {
+    setUpdateTag([]);
+  }, [baseData]);
+
   // 获取当前业态全部标签
   const getAllTag = (params = {}) => {
     const { dispatch } = props;
@@ -46,22 +53,18 @@ const ProjectTagComponent = (props: any) => {
 
   // 获取当前项目标签
   const getCurrentTag = () => {
-    const formatTag = JSON.parse(baseData.tags);
-
-    if (formatTag && formatTag.length) {
+    if (projectTag && projectTag.length) {
       const resultData: any = [];
 
-      for (let i = 0; i < formatTag.length; i++) {
-        const item = formatTag[i];
+      for (let i = 0; i < projectTag.length; i++) {
+        const item = projectTag[i];
 
-        for (let j = 0; j < allTag.length; j++) {
-          if (item === allTag[j].tag) {
-            resultData.push(allTag[j].id);
-          }
+        if (allTag.filter((obj: any) => obj.id === item.tag_id).length) {
+          resultData.push(item);
         }
       }
 
-      setCurrentTag(resultData);
+      setCurrentTag(resultData.map((item: any) => item.tag_id));
 
       return;
     }
@@ -74,7 +77,33 @@ const ProjectTagComponent = (props: any) => {
   }, [allTag]);
 
   const handleChange = (nextTargetKeys: any) => {
-    setCurrentTag(nextTargetKeys)
+    const updateTagData: any = [];
+
+    // 查询删除的标签
+    for (let i = 0; i < projectTag.length; i++) {
+      const item = projectTag[i];
+
+      if (!nextTargetKeys.includes(item.tag_id)) {
+        updateTagData.push(item);
+      }
+    }
+
+    // 查询增加的标签
+    for (let i = 0; i < nextTargetKeys.length; i++) {
+      const key = nextTargetKeys[i];
+
+      if (projectTag.filter((obj: any) => obj.tag_id === key).length) {
+        continue;
+      } else {
+        updateTagData.push({
+          project_id: baseData.id,
+          tag_id: key,
+        })
+      }
+    }
+
+    setCurrentTag(nextTargetKeys);
+    setUpdateTag(updateTagData);
   };
 
   // 更新数据
@@ -91,7 +120,7 @@ const ProjectTagComponent = (props: any) => {
         if (ret.error) {
           message.error(ret.error);
         } else {
-          message.success('更新成功');
+          message.success('房源更新成功');
 
           if (callback) callback();
         }
@@ -99,26 +128,39 @@ const ProjectTagComponent = (props: any) => {
     });
   }
 
-  const saveData = async () => {
-    const fieldsValue = await form.validateFields();
-
-    const tags: any = [];
-
-    for (let i = 0; i < currentTag.length; i++) {
-      const keyName = currentTag[i];
+  // 更新房源项目标签
+  const updateProjectTag = (params: any = {},  callback?: any) => {
+    const { dispatch } = props;
 
-      for (let j = 0; j < allTag.length; j++) {
-        const item = allTag[j];
+    dispatch({
+      type: `estateList/updateEstateProjectTag`,
+      payload: {
+        data: params
+      },
+      callback: (ret: any) => {
+        if (ret.error) {
+          message.error(ret.error);
+        } else {
+          message.success('标签更新成功');
 
-        if (item.id === keyName) {
-          tags.push(item.tag);
+          if (callback) callback();
         }
       }
-    }
+    });
+  }
 
-    updateData(baseData.id, {
-      ...fieldsValue,
-      tags: JSON.stringify(tags),
+  const saveData = async () => {
+    const { getBaseData } = props;
+    const fieldsValue = await form.validateFields();
+
+    // 更新房源信息
+    updateData(baseData.id, fieldsValue, () => {
+      // 更新房源标签信息
+      if (updateTag.length) {
+        updateProjectTag(updateTag, () => {
+          getBaseData();
+        });
+      }
     })
   }
 
@@ -127,7 +169,7 @@ const ProjectTagComponent = (props: any) => {
       <p className={styles.title}>项目状态编辑</p>
 
       {isEdite && (
-        <Button loading={props.updateLoading} type="primary" style={{ width: '100%', marginBottom: '40px' }} onClick={saveData}>保存</Button>
+        <Button loading={props.updateLoading && props.updateTagLoading} type="primary" style={{ width: '100%', marginBottom: '40px' }} onClick={saveData}>保存</Button>
       )}
 
       <Form
@@ -225,4 +267,5 @@ const ProjectTagComponent = (props: any) => {
 export default connect(({ estateList, loading }: any) => ({
   estateList,
   updateLoading: loading.effects['estateList/updateEstate'],
+  updateTagLoading: loading.effects['estateList/updateEstateProjectTag'],
 }))(ProjectTagComponent);

src/pages/mpEstate/estateList/edite/index.tsx

@@ -75,7 +75,7 @@ const VideoList: React.FC<any> = (props) => {
           <Card bordered={false} style={{ marginTop: '24px' }}>
             <Tabs defaultActiveKey="1" type="card">
               <TabPane tab="项目营销标签" key="1">
-                <ProjectTag baseData={baseData} isEdite={isEdite} />
+                <ProjectTag baseData={baseData} getBaseData={getBaseData} isEdite={isEdite} />
               </TabPane>
               <TabPane tab="分期开盘信息" key="2">
                 {baseData.type === 'house' && (

src/pages/mpEstate/estateList/index.tsx

@@ -2,8 +2,8 @@
 import { PageHeaderWrapper } from '@ant-design/pro-layout';
 import React, { useState, useEffect } from 'react';
 import { connect, history } from 'umi';
-import moment from 'moment';
-import { Card, Table, message, Button, Tag } from 'antd';
+// import moment from 'moment';
+import { Card, Table, message, Button, Switch } from 'antd';
 import SearchForm from '@/components/SearchForm';
 import { downfile } from '@/utils/fun';
 import configData from './config';
@@ -17,6 +17,8 @@ const EstateList: React.FC<any> = (props) => {
 
   const [currentSearchParams, setCurrentSearchParams] = useState({});
 
+  const [updateFlag, setUpdateFlag] = useState(false);
+
   const [estateData, setEstateData] = useState({
     list: [],
     pagination: {
@@ -57,7 +59,7 @@ const EstateList: React.FC<any> = (props) => {
     };
 
     getPageList(params);
-  }, [currentSearchParams, pageData]);
+  }, [currentSearchParams, pageData, updateFlag]);
 
   // 点击查询
   const searchFormOk = (form: any, fieldsValue: any) => {
@@ -88,6 +90,35 @@ const EstateList: React.FC<any> = (props) => {
     });
   };
 
+  // 更新数据
+  const updateData = (id: number, params: any = {},  callback?: any) => {
+    const { dispatch } = props;
+
+    dispatch({
+      type: `estateList/updateEstate`,
+      payload: {
+        id,
+        data: params
+      },
+      callback: (ret: any) => {
+        if (ret.error) {
+          message.error(ret.error);
+        } else {
+          message.success('更新成功');
+
+          if (callback) callback();
+
+          setUpdateFlag(!updateFlag);
+        }
+      }
+    });
+  }
+
+  // 切换在线状态
+  const changeStatus = (params: any, id: number) => {
+    updateData(id, params);
+  }
+
   // 查看编辑
   const editeEstate = (obj: any, isEdite: boolean) =>  {
     history.push({
@@ -193,13 +224,25 @@ const EstateList: React.FC<any> = (props) => {
     dataIndex: 'status',
     key: 'status',
     width: 100,
-    render: (text: any) => {
+    // render: (text: any) => {
+    //   const statusMap = {
+    //     online: (<Tag color="success">上线</Tag>),
+    //     offline: (<Tag color="error">下线</Tag>),
+    //   }
+
+    //   return statusMap[text];
+    // }
+    render: (text: any, record: any) => {
       const statusMap = {
-        online: (<Tag color="success">上线</Tag>),
-        offline: (<Tag color="error">下线</Tag>),
+        online: true,
+        offline: false,
       }
 
-      return statusMap[text];
+      return (
+        <Switch checked={statusMap[text]} onChange={(val) => { changeStatus({
+          status: val ? 'online' : 'offline',
+        }, record.id) }} />
+      )
     }
   }, {
     title: '操作',

src/pages/mpEstate/models/estateList.ts

@@ -3,6 +3,7 @@ import {
   fetchEstateBase,
   fetchEstateTag,
   updateEstate,
+  updateEstateProjectTag,
   updateEstateOfficeOpenInfo,
   updateEstateBusinessOpenInfo,
   updateEstateHouseOpenInfo,
@@ -59,6 +60,13 @@ const EstateListModel: EstateListModelType = {
         callback(response);
       }
     },
+    *updateEstateProjectTag({ payload, callback }: any, { call }: any) {
+      const response = yield call(updateEstateProjectTag, payload);
+
+      if (callback) {
+        callback(response);
+      }
+    },
     *updateEstateOfficeOpenInfo({ payload, callback }: any, { call }: any) {
       const response = yield call(updateEstateOfficeOpenInfo, payload);
 

src/pages/mpEstate/services/estateList.ts

@@ -26,6 +26,13 @@ export async function updateEstate(params: any) {
   });
 }
 
+export async function updateEstateProjectTag(params: any) {
+  return request(`/estate/list/projectTag`, {
+    data: params.data || [],
+    method: 'POST',
+  });
+}
+
 export async function updateEstateOfficeOpenInfo(params: any) {
   return request(`/estate/officeOpenInfo/update/${params.id}`, {
     data: params.data,

src/utils/request.ts

@@ -24,7 +24,7 @@ const codeMessage = {
   504: '网关超时。',
 };
 
-const loginErrorCode = [401, 422];
+const loginErrorCode = [401];
 
 /**
  * 异常处理程序
@@ -35,7 +35,7 @@ const errorHandler = (error: { response: Response, data: object }): Response | o
   let returnErrorObj: any = response;
 
   if (response && response.status) {
-    if (response.status >= 500 || response.status === 400) {
+    if (response.status >= 500 || response.status === 400 || response.status === 422) {
       returnErrorObj = data;
     } else if (loginErrorCode.includes(response.status)) {
       saveToken();