feat: add and delete website

src/components/BaseForm/index.js

@@ -36,8 +36,8 @@ const BaseFormItem = itemOption => {
     case ITEM_TYPE.SELECT:
       return (
         <Select {...rest}>
-          {options.map(o => (
-            <Select.Option {...o} />
+          {options.map((o, i) => (
+            <Select.Option key={`item_${i}`} {...o} />
           ))}
         </Select>
       );
@@ -47,16 +47,16 @@ const BaseFormItem = itemOption => {
       // eslint-disable-next-line no-case-declarations
       return (
         <Radio.Group {...rest}>
-          {options.map(o => (
-            <Radio {...o} />
+          {options.map((o, i) => (
+            <Radio {...o} key={`item_${i}`} />
           ))}
         </Radio.Group>
       );
     case ITEM_TYPE.CHECK_BOX:
       return (
         <Checkbox.Group {...rest}>
-          {options.map(o => (
-            <Checkbox {...o} />
+          {options.map((o, i) => (
+            <Checkbox key={`item_${i}`} {...o} />
           ))}
         </Checkbox.Group>
       );

src/pages/webConfig/components/siteConfigDrawer.js

@@ -37,7 +37,7 @@ export default props => {
             });
             return;
           }
-          values.alarmWays = values.alarmWays.join(',');
+          values.alarmWays = values.alarmWays?.join(',') || '';
           // eslint-disable-next-line no-unused-expressions
           onOk && onOk(values);
         }}

src/pages/webConfig/components/webConfigForm.js

@@ -6,7 +6,7 @@ import {
   getWebThemes,
 } from '@/services/webConfig/api';
 import { Row, Col } from 'antd';
-import { getDefaultGetWebconfig, singleStyleData } from '../utils';
+import { getDefaultGetWebconfig, singleStyleData, webMode } from '../utils';
 
 const WebConfigForm = props => {
   const {
@@ -106,7 +106,7 @@ const WebConfigForm = props => {
       labelCol={{ span: 6 }}
       wrapperCol={{ span: 14 }}
       onValuesChange={v => {
-        if (form && v.mode === 'single') {
+        if (form && v.mode === webMode.single) {
           const sty = form.getFieldValue('style');
           if (!singleStyleData[sty]) {
             form.setFieldsValue([{ name: 'style', value: 'platform' }]);

src/pages/webConfig/index.js

@@ -6,10 +6,14 @@ import {
   getWebconfig,
   postEditWebConfig,
   postAddWebSite,
+  deleteWebsite,
 } from '@/services/webConfig/api';
+import { ExclamationCircleOutlined } from '@ant-design/icons';
+import Modal from 'antd/lib/modal/Modal';
 import styles from './index.less';
 import SiteConfig from './components/siteConfigDrawer';
 import { appConnector } from '@/containers/App/store';
+import { defaultWebConfigObj, webMode } from './utils';
 const { TabPane } = Tabs;
 
 const WebConfigPage = props => {
@@ -23,7 +27,8 @@ const WebConfigPage = props => {
   const [isEdit, setIsEdit] = useState(true);
   const [submitting, setSubmitting] = useState(false);
 
-  const hasIntegerate = () => webs.some(w => w.mode === 'integrate');
+  const hasIntegerate = () =>
+    webs.some(w => w.id.startsWith(webMode.integration));
 
   useEffect(() => {
     let canceled = { cancel: false };
@@ -81,32 +86,67 @@ const WebConfigPage = props => {
       });
   };
 
-  const renderTabPane = tabPaneItem => (
-    <TabPane key={tabPaneItem.text} tab={tabPaneItem.text}>
-      <>
-        <span
-          className={styles.link}
-          onClick={() => {
-            setToEdit({ ...configObj });
-            setConfigVisible(true);
-            setIsEdit(true);
-          }}
-        >
-          查看/编辑网站配置
-        </span>
-      </>
-    </TabPane>
-  );
+  const handleDeleteWeb = (webToOperate, closeModal) => {
+    // eslint-disable-next-line prefer-destructuring
+    const client = webToOperate?.id?.split(
+      webToOperate.id.startsWith(webMode.single)
+        ? webMode.single
+        : webMode.integration,
+    )[1];
+    if (client) {
+      deleteWebsite(client)
+        .then(res => {
+          if (res.success) {
+            notification.success({
+              message: `删除网站${webToOperate.text}成功！`,
+              duration: 3,
+            });
+            updateModuleTree(userMode || 'super');
+          } else {
+            notification.error({
+              message: res.message || `删除网站 ${webToOperate.text} 失败`,
+            });
+          }
+          // eslint-disable-next-line no-unused-expressions
+          closeModal && closeModal();
+        })
+        .catch(err => {
+          // eslint-disable-next-line no-console
+          console.error(err);
+          notification.error({ message: '删除网站失败！', duration: 5 });
+          // eslint-disable-next-line no-unused-expressions
+          closeModal && closeModal();
+        });
+    }
+  };
 
   const onEdit = (targetKey, action) => {
-    // console.log(targetKey, action); // action: add|remove
+    const webToOperate = webs.find(w => w.id === targetKey);
     switch (action) {
       case 'add':
         setIsEdit(false);
-        setToEdit({});
+        setToEdit(defaultWebConfigObj);
         setConfigVisible(true);
         break;
       case 'remove':
+        Modal.confirm({
+          title: '删除网站',
+          icon: <ExclamationCircleOutlined />,
+          content: (
+            <span>
+              删除网站{' '}
+              <span style={{ fontWeight: 800, color: '#1890ff' }}>
+                {webToOperate.text}
+              </span>{' '}
+              后将无法恢复, 确认删除?
+            </span>
+          ),
+          okText: '确认',
+          cancelText: '取消',
+          onOk: closeModal => {
+            handleDeleteWeb(webToOperate, closeModal);
+          },
+        });
         break;
       default:
     }
@@ -117,7 +157,7 @@ const WebConfigPage = props => {
   };
 
   const handleTabChange = v => {
-    setCurWeb(webs.find(w => w.text === v));
+    setCurWeb(webs.find(w => w.id === v));
   };
 
   const handleSubmit = values => {
@@ -156,6 +196,23 @@ const WebConfigPage = props => {
       });
   };
 
+  const renderTabPane = tabPaneItem => (
+    <TabPane key={tabPaneItem.id} tab={tabPaneItem.text}>
+      <>
+        <span
+          className={styles.link}
+          onClick={() => {
+            setToEdit({ ...configObj });
+            setConfigVisible(true);
+            setIsEdit(true);
+          }}
+        >
+          查看/编辑网站配置
+        </span>
+      </>
+    </TabPane>
+  );
+
   return (
     <PageContainer>
       <div className={styles.webConfigContainer}>

src/pages/webConfig/utils.js

 import { ITEM_TYPE } from '@/components/BaseForm';
 
+export const webMode = {
+  single: 'single',
+  integration: 'integration',
+};
 const typeContent = hasIntegerate => {
   if (hasIntegerate) {
     return [];
   }
   return [
     {
-      value: 'integrate',
+      value: webMode.integration,
       children: '集成网站',
     },
   ];
@@ -47,7 +51,12 @@ const isIntegerate = (mode, hasIntegerate) => {
   return hasIntegerate;
 };
 
-export const defaultWebConfigObj = {};
+export const defaultWebConfigObj = {
+  mode: webMode.single,
+  menu: 'banner-left',
+  mdi: 'MDI',
+  hideMap: true,
+};
 
 export const getDefaultGetWebconfig = ({
   initialValues = {},
@@ -81,11 +90,11 @@ export const getDefaultGetWebconfig = ({
     mode: {
       label: '网站类型',
       formType: ITEM_TYPE.SINGLE_RADIO,
-      initialValue: 'single',
+      initialValue: webMode.single,
       disabled: isEdit,
       options: [
         {
-          value: 'single',
+          value: webMode.single,
           children: '一般网站',
         },
       ].concat(typeContent(hasIntegerate)),

src/services/webConfig/api.js

@@ -59,3 +59,6 @@ export const postEditWebConfig = (config, isAdd = false) =>
   );
 
 export const postAddWebSite = config => postEditWebConfig(config, true);
+
+export const deleteWebsite = client =>
+  get(`${CITY_SERVICE}/OMS.svc/W4_DeleteWebsite?_version=9999`, { client });