fix: 'web配置单选交互修改成开关'

src/pages/productCenter/webConfig/components/siteConfigDrawer.js

@@ -70,6 +70,13 @@ export default props => {
   const [keepText, setKeepText] = useState([]);
   const [keepValue, setKeepValue] = useState([]);
 
+  const [visibleChecked, setVisibleChecked] = useState('');
+  const [visibleChecked1, setVisibleChecked1] = useState('');
+  const [visibleChecked2, setVisibleChecked2] = useState('');
+  const [visibleChecked3, setVisibleChecked3] = useState('');
+  const [visibleChecked4, setVisibleChecked4] = useState('');
+  const [visibleChecked5, setVisibleChecked5] = useState('');
+
   useEffect(() => {
     console.log(webs);
     onGetLoginPages();
@@ -114,11 +121,42 @@ export default props => {
       if (isEdit) {
         // 获取表单回显
         console.log(config, 'config');
+        if (config.CloudStyle == '是') {
+          config.CloudStyle == true;
+          setVisibleChecked1(true);
+        } else {
+          config.CloudStyle == false;
+          setVisibleChecked1(false);
+        }
+
+        if (config.messageMarking == 'All') {
+          config.messageMarking == true;
+          setVisibleChecked3(true);
+        } else {
+          config.messageMarking == false;
+          setVisibleChecked3(false);
+        }
+
+        if (config.menuState == 'open') {
+          config.menuState == true;
+          setVisibleChecked5(true);
+        } else {
+          config.menuState == false;
+          setVisibleChecked5(false);
+        }
+
+        setVisibleChecked(config.navTheme == 'light');
+        setVisibleChecked2(config.hideMap);
+        setVisibleChecked4(config.messageVoice);
         form.setFieldsValue({
           ...config,
           primaryColor: config.primaryColor ? config.primaryColor : '#0087F7',
-          navTheme: config.navTheme ? config.navTheme : 'dark',
-          CloudStyle: config.CloudStyle ? config.CloudStyle : '是',
+          navTheme: config.navTheme == 'light',
+          CloudStyle: config.CloudStyle,
+          messageMarking: config.messageMarking,
+          hideMap: config.hideMap,
+          messageVoice: config.messageVoice,
+          menuState: config.menuState,
           headerPrimaryColor: config.headerPrimaryColor
             ? config.headerPrimaryColor
             : 'linear-gradient(0deg, #0066D6 0%, #39A9FF 100%)',
@@ -130,25 +168,37 @@ export default props => {
         );
       } else {
         setColor('linear-gradient(0deg, #0066D6 0%, #39A9FF 100%)');
+        setVisibleChecked(false);
+        setVisibleChecked1(true);
+        setVisibleChecked2(true);
+        setVisibleChecked3(true);
+        setVisibleChecked4(true);
+        setVisibleChecked5(true);
         form.setFieldsValue({
           shortcutIcon: 'assets\\images\\icon\\熊猫-蓝色.png',
           logo: 'assets\\images\\logo\\熊猫-蓝绿色.svg',
           bannerLogo: 'assets\\images\\logo\\熊猫-白色.svg',
           title: '新网站',
-          messageMarking: 'All',
+          messageMarking: true,
           messageVoice: true,
-          menuState: 'open',
-          hideMap: false,
+          menuState: true,
+          hideMap: true,
           loginTemplate: 'Dark',
           primaryColor: '#0087F7',
-          navTheme: 'dark',
-          CloudStyle: '是',
+          navTheme: false,
+          CloudStyle: true,
           headerPrimaryColor: 'linear-gradient(0deg, #0066D6 0%, #39A9FF 100%)',
         });
       }
     } else {
       setShowAdvanced(false);
       form.resetFields();
+      setVisibleChecked('');
+      setVisibleChecked1('');
+      setVisibleChecked2('');
+      setVisibleChecked3('');
+      setVisibleChecked4('');
+      setVisibleChecked5('');
     }
   }, [visible]);
   const onGetLoginPages = () => {
@@ -192,10 +242,9 @@ export default props => {
   });
   // 登录搜索头部
   const renderTitle = title => <span>{title}</span>;
+
   const onsubmit = () => {
     form.validateFields().then(validate => {
-      console.log(validate);
-      console.log(checkedList);
       // if (checkedList.find(i => i == '首页') && !validate.homePage) {
       //   notification.warning({
       //     message: '提示',
@@ -205,7 +254,10 @@ export default props => {
       //   return;
       // }
       validate.topMenu = checkedList.toString();
-      console.log(validate);
+      validate.navTheme = visibleChecked ? 'light' : 'dark';
+      validate.CloudStyle = visibleChecked1 ? '是' : '否';
+      validate.messageMarking = visibleChecked3 ? 'All' : 'One';
+      validate.menuState = visibleChecked5 ? 'open' : 'close';
       if (validate) {
         const colorIndex = colorList.findIndex(item => item.color === validate.primaryColor);
         onOk({
@@ -246,6 +298,34 @@ export default props => {
     setShowParmarModal(true);
   };
 
+  const change = e => {
+    console.log(e);
+    setVisibleChecked(e);
+  };
+
+  const change1 = e => {
+    console.log(e);
+    setVisibleChecked1(e);
+  };
+  const change2 = e => {
+    console.log(e);
+    setVisibleChecked2(e);
+  };
+
+  const change3 = e => {
+    console.log(e);
+    setVisibleChecked3(e);
+  };
+  const change4 = e => {
+    console.log(e);
+    setVisibleChecked4(e);
+  };
+
+  const change5 = e => {
+    console.log(e);
+    setVisibleChecked5(e);
+  };
+
   return (
     <Drawer
       title={isEdit ? '查看/编辑网站配置' : '新增网站'}
@@ -419,10 +499,16 @@ export default props => {
           </Select>
         </Form.Item>
         <Form.Item name="navTheme" label="菜单">
-          <Radio.Group>
+          {/* <Radio.Group>
             <Radio value="dark">暗</Radio>
             <Radio value="light">亮</Radio>
-          </Radio.Group>
+          </Radio.Group> */}
+          <Switch
+            checkedChildren="亮"
+            unCheckedChildren="暗"
+            checked={visibleChecked}
+            onChange={change}
+          />
         </Form.Item>
 
         <Form.Item>
@@ -450,10 +536,16 @@ export default props => {
             }
             name="CloudStyle"
           >
-            <Radio.Group>
+            {/* <Radio.Group>
               <Radio value="是">云</Radio>
               <Radio value="否">租户</Radio>
-            </Radio.Group>
+            </Radio.Group> */}
+            <Switch
+              checkedChildren="云"
+              unCheckedChildren="租户"
+              checked={visibleChecked1}
+              onChange={change1}
+            />
           </Form.Item>
           <Form.Item name="topMenu" label="顶部功能">
             <Checkbox
@@ -485,10 +577,16 @@ export default props => {
             <Input placeholder="请输入二维码地址" autoComplete="off" />
           </Form.Item>
           <Form.Item label="Web4地图" name="hideMap">
-            <Radio.Group>
+            {/* <Radio.Group>
               <Radio value={false}>开启</Radio>
               <Radio value>关闭</Radio>
-            </Radio.Group>
+            </Radio.Group> */}
+            <Switch
+              checkedChildren="开启"
+              unCheckedChildren="关闭"
+              checked={visibleChecked2}
+              onChange={change2}
+            />
           </Form.Item>
           <Form.Item
             label={
@@ -510,22 +608,40 @@ export default props => {
             }
             name="messageMarking"
           >
-            <Radio.Group>
+            {/* <Radio.Group>
               <Radio value="All">多人</Radio>
               <Radio value="One">单人</Radio>
-            </Radio.Group>
+            </Radio.Group> */}
+            <Switch
+              checkedChildren="多人"
+              unCheckedChildren="单人"
+              checked={visibleChecked3}
+              onChange={change3}
+            />
           </Form.Item>
           <Form.Item label="语音播报" name="messageVoice">
-            <Radio.Group>
+            {/* <Radio.Group>
               <Radio value>开启</Radio>
               <Radio value={false}>关闭</Radio>
-            </Radio.Group>
+            </Radio.Group> */}
+            <Switch
+              checkedChildren="开启"
+              unCheckedChildren="关闭"
+              checked={visibleChecked4}
+              onChange={change4}
+            />
           </Form.Item>
           <Form.Item label="菜单样式" name="menuState">
-            <Radio.Group>
+            {/* <Radio.Group>
               <Radio value="open">展开</Radio>
               <Radio value="close">折叠</Radio>
-            </Radio.Group>
+            </Radio.Group> */}
+            <Switch
+              checkedChildren="展开"
+              unCheckedChildren="折叠"
+              checked={visibleChecked5}
+              onChange={change5}
+            />
           </Form.Item>
         </div>
       </Form>