SiteConfig.jsx 5.55 KB
Newer Older
Maofei94's avatar
Maofei94 committed
1
import React, { useState, useEffect } from 'react';
Maofei94's avatar
Maofei94 committed
2
import { Form, Select, Input, Button, Radio, notification, Spin } from 'antd';
3
import { editWebsite, getWebsite, addWebsite } from '@/services/mobileConfig/api';
4
import PicturesWall from '@/components/Upload/index';
Maofei94's avatar
Maofei94 committed
5 6 7
const { Item } = Form;
const { Option } = Select;
const SiteConfig = props => {
8
  const { miniTitle, submitCallback, addCallback, parentKey, clientName } = props;
Maofei94's avatar
Maofei94 committed
9
  const [config, setConfig] = useState(''); // 网站配置信息
10
  const [loginList, setLoginList] = useState([{ text: '默认界面', value: 'default' }]); // 系统登陆页
Maofei94's avatar
Maofei94 committed
11
  const [styleList, setStyleList] = useState([
Maofei94's avatar
Maofei94 committed
12 13
    { text: '熊猫产品', value: 'default' },
    { text: '通用项目', value: 'project' },
Maofei94's avatar
Maofei94 committed
14
  ]); // 系统风格
15
  const [themeList, setThemeList] = useState([{ text: '默认皮肤', value: 'default' }]); // 系统皮肤
Maofei94's avatar
Maofei94 committed
16
  const [loading, setLoading] = useState(false);
Maofei94's avatar
Maofei94 committed
17 18 19
  const [form] = Form.useForm();
  const layout = {
    layout: 'horizontal',
Maofei94's avatar
Maofei94 committed
20
    labelCol: { span: 7 },
Maofei94's avatar
Maofei94 committed
21
    wrapperCol: { span: 8 },
Maofei94's avatar
Maofei94 committed
22 23
  };
  useEffect(() => {
Maofei94's avatar
Maofei94 committed
24
    console.log(miniTitle, 'miniTitle');
Maofei94's avatar
Maofei94 committed
25 26 27
    if (!miniTitle) {
      return;
    }
Maofei94's avatar
Maofei94 committed
28
    setLoading(true);
Maofei94's avatar
Maofei94 committed
29 30 31
    getWebsite({
      _version: 9999,
      _dc: Date.now(),
Maofei94's avatar
Maofei94 committed
32
      title: miniTitle,
Maofei94's avatar
Maofei94 committed
33 34 35
    })
      .then(res => {
        setLoading(false);
Maofei94's avatar
Maofei94 committed
36 37
        let obj = {};
        let arr = Object.keys(form.getFieldsValue());
Maofei94's avatar
Maofei94 committed
38
        arr.map(k => {
39
          obj[k] = res.data[k];
Maofei94's avatar
Maofei94 committed
40 41 42 43 44
        });
        form.setFieldsValue(obj);
      })
      .catch(err => {
        setLoading(false);
Maofei94's avatar
Maofei94 committed
45
      });
Maofei94's avatar
Maofei94 committed
46
  }, [miniTitle]);
Maofei94's avatar
Maofei94 committed
47 48 49 50
  // 单选值改变
  const radioChange = e => {};
  // 提交选择
  const submit = value => {
51 52
    form.validateFields().then(valid => {
      if (valid) {
Maofei94's avatar
Maofei94 committed
53
        setLoading(true);
54
        const obj = { ...form.getFieldsValue() };
Maofei94's avatar
Maofei94 committed
55
        let params = { ...obj, mode: 'single', client: clientName };
56
        editWebsite(params)
Maofei94's avatar
Maofei94 committed
57 58
          .then(res => {
            setLoading(false);
59
            if (res.code === 0) {
Maofei94's avatar
Maofei94 committed
60
              submitCallback(obj.title);
Maofei94's avatar
Maofei94 committed
61 62 63 64 65 66 67 68 69 70 71 72
              notification.success({
                message: '提示',
                duration: 3,
                description: '编辑成功',
              });
            } else {
              notification.error({
                message: '提示',
                duration: 3,
                description: res.message || '编辑失败',
              });
            }
Maofei94's avatar
Maofei94 committed
73
          })
Maofei94's avatar
Maofei94 committed
74 75 76
          .catch(err => {
            setLoading(false);
          });
77 78
      }
    });
Maofei94's avatar
Maofei94 committed
79 80
  };
  return (
Maofei94's avatar
Maofei94 committed
81
    <Spin spinning={loading} tip="loading...">
Maofei94's avatar
Maofei94 committed
82 83
      <div style={{ minHeight: 'calc(100vh  - 252px)', marginTop: '20px' }}>
        <Form form={form} name={`form-${miniTitle}`} {...layout}>
Maofei94's avatar
Maofei94 committed
84 85 86 87 88 89 90 91 92 93 94 95
          <Item
            label="应用名称:"
            name="title"
            rules={[
              {
                required: true,
                message: '请输入应用名称',
              },
            ]}
          >
            <Input placeholder="请输入应用名称" allowClear />
          </Item>
96
          <Item label="虚拟目录:">
Maofei94's avatar
Maofei94 committed
97 98
            <Input value={clientName} disabled />
          </Item>
Maofei94's avatar
Maofei94 committed
99 100 101 102 103 104 105 106 107 108
          <Item
            label="系统图标:"
            name="shortcutIcon"
            rules={[
              {
                required: true,
                message: '请选择系统图标',
              },
            ]}
          >
Maofei94's avatar
Maofei94 committed
109
            <PicturesWall picType="icon" />
Maofei94's avatar
Maofei94 committed
110
          </Item>
Maofei94's avatar
Maofei94 committed
111

Maofei94's avatar
Maofei94 committed
112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168
          <Item
            label="登陆页面:"
            name="loginTemplate"
            rules={[
              {
                required: true,
                message: '请选择登陆页面',
              },
            ]}
          >
            <Select placeholder="请选择登陆页面">
              {loginList &&
                loginList.map((item, index) => (
                  <Option value={item.value} key={`item${index}`}>
                    {item.text}
                  </Option>
                ))}
            </Select>
          </Item>
          <Item
            label="系统皮肤:"
            name="theme"
            rules={[
              {
                required: true,
                message: '请选择系统皮肤',
              },
            ]}
          >
            <Select placeholder="请选择系统皮肤">
              {themeList &&
                themeList.map((item, index) => (
                  <Option value={item.value} key={`item${index}`}>
                    {item.text}
                  </Option>
                ))}
            </Select>
          </Item>
          <Item
            label="系统风格:"
            name="style"
            rules={[
              {
                required: true,
                message: '请选择系统风格',
              },
            ]}
          >
            <Select placeholder="请选择系统风格">
              {styleList &&
                styleList.map((item, index) => (
                  <Option value={item.value} key={`item${index}`}>
                    {item.text}
                  </Option>
                ))}
            </Select>
          </Item>
Maofei94's avatar
Maofei94 committed
169
          <Item label="开启云登陆:" name="cloudLogin" initialValue={false}>
Maofei94's avatar
Maofei94 committed
170 171 172 173 174 175 176 177 178 179 180 181
            <Radio.Group onChange={radioChange}>
              <Radio value></Radio>
              <Radio value={false}></Radio>
            </Radio.Group>
          </Item>
          <Item wrapperCol={{ span: 6, offset: 7 }}>
            <Button type="primary" onClick={submit}>
              提交
            </Button>
          </Item>
        </Form>
      </div>
Maofei94's avatar
Maofei94 committed
182
    </Spin>
Maofei94's avatar
Maofei94 committed
183 184 185
  );
};
export default SiteConfig;