Commit d788f593 authored by Maofei94's avatar Maofei94

perf: 产品配置修改

parent f30314b6
Pipeline #23004 passed with stages
in 28 minutes 48 seconds
...@@ -16,12 +16,12 @@ const EditForm = props => { ...@@ -16,12 +16,12 @@ const EditForm = props => {
}; };
const environmentList = [ const environmentList = [
{ {
value: 'production', value: '已发布',
label: '已发布', label: '已发布',
key: 'production', key: 'production',
}, },
{ {
value: 'development', value: '研发中',
label: '研发中', label: '研发中',
key: 'development', key: 'development',
}, },
...@@ -35,7 +35,7 @@ const EditForm = props => { ...@@ -35,7 +35,7 @@ const EditForm = props => {
const finished = value => { const finished = value => {
let params = { let params = {
...value, ...value,
Id: productObj.Id, ID: productObj.ID,
}; };
editCallback(params); editCallback(params);
console.log(value, 'value'); console.log(value, 'value');
...@@ -46,42 +46,55 @@ const EditForm = props => { ...@@ -46,42 +46,55 @@ const EditForm = props => {
<div style={{ minHeight: 'calc(100vh - 252px)', marginTop: '35px' }}> <div style={{ minHeight: 'calc(100vh - 252px)', marginTop: '35px' }}>
<Form form={form} name="formEdit" {...layout} onFinish={finished}> <Form form={form} name="formEdit" {...layout} onFinish={finished}>
<Item <Item
label="产品名称:" label="产品包名:"
name="ProductName" name="PackageName"
rules={[ rules={[
{ {
required: true, required: true,
pattern: new RegExp(/^[a-z0-9A-Z]+$/), pattern: new RegExp(/^[a-z0-9A-Z]+$/),
message: '产品名称必须是英文或者数字', message: '产品包名必须是英文或者数字',
}, },
]} ]}
> >
<Input placeholder="请输入产品名称" allowClear disabled /> <Input placeholder="请输入产品包名" allowClear disabled />
</Item> </Item>
<Item <Item
label="产品包名:" label="产品名称:"
name="ProductAlias" name="ProductName"
// rules={[ // rules={[
// { // {
// required: true, // required: true,
// message: '请输入产品别名', // pattern: new RegExp(/^[a-z0-9A-Z]+$/),
// message: '产品名称必须是英文或者数字',
// }, // },
// ]} // ]}
> >
<Input placeholder="请输入产品包名:" allowClear /> <Input placeholder="请输入产品名称" allowClear />
</Item>
<Item
label="产品说明:"
name="Description"
// rules={[
// {
// required: true,
// pattern: new RegExp(/^[a-z0-9A-Z]+$/),
// message: '产品名称必须是英文或者数字',
// },
// ]}
>
<Input placeholder="请输入产品说明" />
</Item> </Item>
<Item <Item
label="发布状态:" label="发布状态:"
name="Environment" name="PublishState"
rules={[ rules={[
{ {
required: true, required: true,
message: '请选择发布状态', message: '请选择发布状态',
}, },
]} ]}
> >
<Select placeholder="请选择发布状态:"> <Select placeholder="请选择发布状态" disabled>
{environmentList && {environmentList &&
environmentList.map(item => ( environmentList.map(item => (
<Option value={item.value} key={item.key}> <Option value={item.value} key={item.key}>
...@@ -92,7 +105,7 @@ const EditForm = props => { ...@@ -92,7 +105,7 @@ const EditForm = props => {
</Item> </Item>
<Item <Item
label="访问路由" label="访问路由"
name="StartUrl" name="RouteUrl"
rules={[ rules={[
{ {
required: true, required: true,
...@@ -100,7 +113,11 @@ const EditForm = props => { ...@@ -100,7 +113,11 @@ const EditForm = props => {
}, },
]} ]}
> >
<Input addonBefore="//" placeholder="请输入访问路由" allowClear /> {/* <Input addonBefore="//" placeholder="请输入访问路由" allowClear /> */}
<Input
placeholder="请输入访问路由,示例//localhost:3001/civmanage"
allowClear
/>
</Item> </Item>
<Item <Item
label="默认配置" label="默认配置"
......
...@@ -15,6 +15,7 @@ const AddForm = props => { ...@@ -15,6 +15,7 @@ const AddForm = props => {
configFiles, configFiles,
productList, productList,
} = props; } = props;
console.log(productList);
const [form] = Form.useForm(); const [form] = Form.useForm();
const [otherForm] = Form.useForm(); const [otherForm] = Form.useForm();
const layout = { const layout = {
...@@ -62,11 +63,12 @@ const AddForm = props => { ...@@ -62,11 +63,12 @@ const AddForm = props => {
<Input placeholder="请输入菜单别名" /> <Input placeholder="请输入菜单别名" />
</Item> </Item>
<Item label="产品类型:" name="product"> <Item label="产品类型:" name="product">
<Select placeholder="请选择产品类型"> <Select placeholder="请选择产品类型" allowClear>
{productList && {productList &&
productList.length > 0 &&
productList.map(item => ( productList.map(item => (
<Option value={item.ProductName} key={item.Id}> <Option value={item.PackageName} key={item.PackageName}>
{item.ProductAlias} {item.PackageName}
</Option> </Option>
))} ))}
</Select> </Select>
......
...@@ -73,11 +73,12 @@ const EditForm = props => { ...@@ -73,11 +73,12 @@ const EditForm = props => {
<Input placeholder="请输入菜单别名" /> <Input placeholder="请输入菜单别名" />
</Item> </Item>
<Item label="产品类型:" name="product"> <Item label="产品类型:" name="product">
<Select placeholder="请选择产品类型"> <Select placeholder="请选择产品类型" allowClear>
{productList && {productList &&
productList.length > 0 &&
productList.map(item => ( productList.map(item => (
<Option value={item.ProductName} key={item.Id}> <Option value={item.PackageName} key={item.PackageName}>
{item.ProductAlias} {item.PackageName || ''}
</Option> </Option>
))} ))}
</Select> </Select>
......
...@@ -47,7 +47,7 @@ const MiniMenu = props => { ...@@ -47,7 +47,7 @@ const MiniMenu = props => {
const [modalLoading, setModalLoading] = useState(false); const [modalLoading, setModalLoading] = useState(false);
const [submitLoading, setSubmitLoading] = useState(false); const [submitLoading, setSubmitLoading] = useState(false);
const [newTreeList, setNewTreeList] = useState([]); const [newTreeList, setNewTreeList] = useState([]);
const [productList, setProductList] = useState([]); const [productList, setProductList] = useState([]); // 选中的产品类型
const [menuList, setMenuList] = useState([]); // 菜单树 const [menuList, setMenuList] = useState([]); // 菜单树
/* ***************************************************** */ /* ***************************************************** */
...@@ -59,9 +59,15 @@ const MiniMenu = props => { ...@@ -59,9 +59,15 @@ const MiniMenu = props => {
}, [menuID, webid]); }, [menuID, webid]);
useEffect(() => { useEffect(() => {
getProductList().then(res => { getProductList().then(res => {
const { code, data } = res; const { code } = res;
if (code === 0) { if (code === 0) {
setProductList(data); const {
data: { UserProducts },
} = res;
if (UserProducts && UserProducts.length > 0) {
setProductList(UserProducts);
}
// setProductList(data);
} }
}); });
}, []); }, []);
......
...@@ -8,6 +8,7 @@ import { ...@@ -8,6 +8,7 @@ import {
Spin, Spin,
notification, notification,
Switch, Switch,
message,
} from 'antd'; } from 'antd';
import { import {
modifyProduct, modifyProduct,
...@@ -21,6 +22,7 @@ import styles from './productConfig.less'; ...@@ -21,6 +22,7 @@ import styles from './productConfig.less';
const ProductConfig = props => { const ProductConfig = props => {
const [addVisible, setAddVisible] = useState(false); const [addVisible, setAddVisible] = useState(false);
const [productList, setProductList] = useState([]); const [productList, setProductList] = useState([]);
const [userProductsList, setUserProductsList] = useState([]);
const [productObj, setProductObt] = useState(null); const [productObj, setProductObt] = useState(null);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [flag, setFlag] = useState(1); const [flag, setFlag] = useState(1);
...@@ -28,12 +30,18 @@ const ProductConfig = props => { ...@@ -28,12 +30,18 @@ const ProductConfig = props => {
setLoading(true); setLoading(true);
getProductList() getProductList()
.then(res => { .then(res => {
const { code, data } = res; const { code } = res;
if (code === 0) { if (code === 0) {
if (!productObj && data.length > 0) { const {
setProductObt(data[0]); data: { AllProducts, UserProducts },
} } = res;
setProductList(data); console.log(AllProducts, UserProducts);
setProductList(AllProducts);
setUserProductsList(UserProducts);
// if (!productObj && data.length > 0) {
// setProductObt(data[0]);
// }
// setProductList(data);
} }
}) })
.finally(() => { .finally(() => {
...@@ -45,17 +53,15 @@ const ProductConfig = props => { ...@@ -45,17 +53,15 @@ const ProductConfig = props => {
setAddVisible(true); setAddVisible(true);
}; };
// 删除 // 删除
const handleDel = () => { const handleDel = item => {
setLoading(true); setLoading(true);
delProductList({ delProductList({ ...item })
ids: productObj.Id,
})
.then(res => { .then(res => {
setLoading(false); setLoading(false);
if (res.code === 0) { if (res.code === 0) {
notification.success({ notification.success({
message: '提示', message: '提示',
description: '删除成功', description: '关闭成功',
duration: 3, duration: 3,
}); });
setProductObt(''); setProductObt('');
...@@ -63,7 +69,7 @@ const ProductConfig = props => { ...@@ -63,7 +69,7 @@ const ProductConfig = props => {
} else { } else {
notification.error({ notification.error({
message: '提示', message: '提示',
description: res.msg || '删除失败', description: res.msg || '关闭失败',
duration: 10, duration: 10,
}); });
} }
...@@ -104,30 +110,82 @@ const ProductConfig = props => { ...@@ -104,30 +110,82 @@ const ProductConfig = props => {
console.log(err); console.log(err);
}); });
}; };
const handleSwitchClick = (e, id) => { const handleSwitchClick = (e, item, userlist) => {
console.log(e, id); if (e) {
setLoading(true);
modifyProduct({ ...item })
.then(res => {
console.log(res);
setLoading(false);
if (res.code === 0) {
notification.success({
message: '提示',
description: '启用成功',
duration: 3,
});
setFlag(flag + 1);
} else {
notification.error({
message: '提示',
description: res.msg || '启用失败',
duration: 10,
});
}
})
.catch(err => {
setLoading(false);
console.log(err);
});
}
if (!e) {
let obj = userlist.find(i => i.PackageName === item.PackageName);
handleDel(obj);
}
console.log(e, item);
};
const handleClickItem = value => {
if (userProductsList.length > 0) {
let obj = userProductsList.find(i => i.PackageName === value.PackageName);
console.log(obj);
if (obj) {
setProductObt(obj);
} else {
message.warning({
content: '请先启用产品',
duration: 3,
});
}
} else {
message.warning({
content: '请先启用产品',
duration: 3,
});
}
}; };
const renderListItem = arr => const renderListItem = arr =>
arr.map(item => ( arr.map(item => (
<List.Item <List.Item
key={item.Id} key={item.PackageName}
className={classnames({ className={classnames({
[styles.listItem]: true, [styles.listItem]: true,
[styles.selected]: item.Id === productObj.Id, [styles.selected]: item.PackageName === productObj?.PackageName,
})} })}
onClick={() => setProductObt(item)} onClick={() => handleClickItem(item)}
> >
<Switch <div onClick={e => e.stopPropagation()}>
// size="small" <Switch
defaultChecked={!item.checked} // size="small"
checkedChildren="启用" // defaultChecked={item.IsUsed}
unCheckedChildren="关闭" checked={item.IsUsed}
onClick={e => { checkedChildren="启用"
handleSwitchClick(e, item.Id); unCheckedChildren="关闭"
}} onClick={e => {
/> handleSwitchClick(e, item, userProductsList);
}}
/>
</div>
<span className={classnames({ [styles.itemspan]: true })}> <span className={classnames({ [styles.itemspan]: true })}>
{item.ProductName} {item.PackageName}
</span> </span>
</List.Item> </List.Item>
)); ));
......
...@@ -122,4 +122,4 @@ export const modifyProduct = params => ...@@ -122,4 +122,4 @@ export const modifyProduct = params =>
// 删除产品列表 // 删除产品列表
export const delProductList = params => export const delProductList = params =>
get(`${PUBLISH_SERVICE}/UserCenter/DelProductList`, params); post(`${PUBLISH_SERVICE}/UserCenter/DelProduct`, params);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment