Commit ea0ef603 authored by tianfen's avatar tianfen

style: fix styles

parent 84294082
Pipeline #21497 skipped with stages
const rm = require('rimraf');
const path = require('path');
const webpack = require('webpack');
const chalk = require('chalk');
const ora = require('ora')
const webpackConfig = require('./webpack.prod.babel')
const ora = require('ora');
const webpackConfig = require('./webpack.prod.babel');
const spinner = ora('building for production...');
// const Diff = require('diff');
/* eslint-disable */
......
......@@ -8,7 +8,9 @@ module.exports = options => ({
entry: options.entry,
output: Object.assign(
{
path: process.env.npm_config_releasepath ? path.resolve(process.env.npm_config_releasepath, 'civmanage'): path.resolve(process.cwd(), 'civmanage'),
path: process.env.npm_config_releasepath
? path.resolve(process.env.npm_config_releasepath, 'civmanage')
: path.resolve(process.cwd(), 'civmanage'),
publicPath: process.env.PUBLIC_PATH || '/civmanage/',
},
options.output,
......
......@@ -17,7 +17,7 @@ module.exports = require('./webpack.base.babel')({
],
// Utilize long-term caching by adding content hashes (not compilation hashes) to compiled assets
//[chunkhash:8] [chunkhash:8]
// [chunkhash:8] [chunkhash:8]
output: {
filename: 'static/[name].[chunkhash:8].js',
chunkFilename: 'static/[name].[chunkhash:8].chunk.js',
......
......@@ -12,12 +12,22 @@ import {
Space,
Collapse,
Checkbox,
Select
Select,
} from 'antd';
import lodash from 'lodash';
import { DoubleLeftOutlined, DoubleRightOutlined,DownOutlined,UpOutlined } from '@ant-design/icons';
import {
DoubleLeftOutlined,
DoubleRightOutlined,
DownOutlined,
UpOutlined,
} from '@ant-design/icons';
import PageContainer from '@/components/BasePageContainer';
import {getWebModuleTree,chooseUserToStation,getAllGroup,getStationUserList} from '@/services/userCenter/siteManage/api';
import {
getWebModuleTree,
chooseUserToStation,
getAllGroup,
getStationUserList,
} from '@/services/userCenter/siteManage/api';
import ListCard, {
checkChildrenByCondition,
getId,
......@@ -40,22 +50,22 @@ const SiteManage = props => {
const [treeData, setTreeData] = useState([]); // 树结构数据
const [currentStation, setCurrentStation] = useState({}); // 当前选中站点
const [searchWord, setSearchWord] = useState(''); // 关键字
const [visibleParams,setvisibleParams]=useState({
modalVisible:false,//新增弹窗
delVisible:false,//删除弹窗
editVisible:false,//修改弹窗
spinLoading:false,//加载弹窗
btnLoading:false,
loading:false,
checkBoxLoading:false
})
const [visibleParams, setvisibleParams] = useState({
modalVisible: false, // 新增弹窗
delVisible: false, // 删除弹窗
editVisible: false, // 修改弹窗
spinLoading: false, // 加载弹窗
btnLoading: false,
loading: false,
checkBoxLoading: false,
});
const [flag, setFlag] = useState(1);
const [dataList, setdataList] = useState([]);
const [mulu, setMulu] = useState(true);
const [optionsList,setOptionsList]=useState([])
//侧边栏站点
const [optionsList, setOptionsList] = useState([]);
// 侧边栏站点
useEffect(() => {
handleShowModal('spinLoading',true)
handleShowModal('spinLoading', true);
getWebModuleTree({
userMode: userMode || 'super',
select: '',
......@@ -64,7 +74,7 @@ const SiteManage = props => {
node: -2,
})
.then(res => {
handleShowModal('spinLoading',false)
handleShowModal('spinLoading', false);
let arr = [];
if (res) {
arr.push(res.find(item => item.id === 'Web4StationRoot'));
......@@ -83,69 +93,67 @@ const SiteManage = props => {
}
})
.catch(err => {
handleShowModal('spinLoading',false)
handleShowModal('spinLoading', false);
console.error(err);
});
}, [flag]);
//右边对应的机构
// 右边对应的机构
useEffect(() => {
if (!currentStation.stationID) return;
handleShowModal('loading',true)
getAllGroup({stationId: currentStation.stationID,}).then(res=>{
if(res.code===0){
let data=res.data;
handleShowModal('loading', true);
getAllGroup({ stationId: currentStation.stationID }).then(res => {
if (res.code === 0) {
let { data } = res;
// for(let i=0;i<2000;i++){
// data.push({
// GroupId:i+10000,
// GroupName:`测试${i}`
// })
// }
handleShowModal('loading',false)
setdataList(data)
setOptionsList(data)
handleShowModal('loading', false);
setdataList(data);
setOptionsList(data);
}
})
});
}, [currentStation]);
//弹出模态框
const handleShowModal=(key,value)=>{
setvisibleParams({...visibleParams,[key]:value});
}
// 弹出模态框
const handleShowModal = (key, value) => {
setvisibleParams({ ...visibleParams, [key]: value });
};
// 获取搜索框的值
const handleSearch = value => {
if(value){
dataList.forEach(item=>{
item.color=item.GroupName.indexOf(value)>-1?'#f00':'#333'
})
setdataList(lodash.cloneDeep(dataList))
if (value) {
dataList.forEach(item => {
item.color = item.GroupName.indexOf(value) > -1 ? '#f00' : '#333';
});
setdataList(lodash.cloneDeep(dataList));
setSearchWord(value);
}
};
//搜索框点击进行锚点链接跳转
// 搜索框点击进行锚点链接跳转
const handleChange = value => {
if(value){
let index=dataList.findIndex(item=>item.GroupId===value)
dataList.forEach(item=>{
item.color='#333'
})
dataList[index].color='#f00'
setdataList(lodash.cloneDeep(dataList))
if (value) {
let index = dataList.findIndex(item => item.GroupId === value);
dataList.forEach(item => {
item.color = '#333';
});
dataList[index].color = '#f00';
setdataList(lodash.cloneDeep(dataList));
let anchorElement = document.getElementById(`siteId${value}`);
anchorElement.scrollIntoView()
anchorElement.scrollIntoView();
}
};
const confirmModal = e => {
handleShowModal('modalVisible',false)
handleShowModal('modalVisible', false);
setFlag(flag + 1);
};
const delModal = () => {
handleShowModal('delVisible',false)
handleShowModal('delVisible', false);
setFlag(flag + 1);
};
const editModal = () => {
handleShowModal('editVisible',false)
handleShowModal('editVisible', false);
setFlag(flag + 1);
};
const handleHide = () => {
......@@ -166,52 +174,59 @@ const SiteManage = props => {
{t.text}
</List.Item>
));
const handleChangeCollpase=(groupId,isShow)=>{
let index=dataList.findIndex(item=>item.GroupId==groupId)
dataList[index].isShow=!isShow
if(dataList[index].children&&dataList[index].children.length>0){
setdataList(lodash.cloneDeep(dataList))
const handleChangeCollpase = (groupId, isShow) => {
let index = dataList.findIndex(item => item.GroupId == groupId);
dataList[index].isShow = !isShow;
if (dataList[index].children && dataList[index].children.length > 0) {
setdataList(lodash.cloneDeep(dataList));
return;
}
handleShowModal('loading',true)
getStationUserList({stationID:currentStation.stationID,groupId}).then(res=>{
if(res.code===0&&res.data){
handleShowModal('loading',false)
dataList[index].children=res.data;
setdataList(lodash.cloneDeep(dataList))
}
})
}
//每组全选全不选
const handleChangeAll=(e,index)=>{
dataList[index].isChecked=e.target.checked
dataList[index].selectList=e.target.checked?dataList[index].userList:[]
dataList[index].children&&dataList[index].children.forEach(item=>{
item.isChecked=e.target.checked
})
setdataList(lodash.cloneDeep(dataList))
}
//单个选择checkbox
const handleChangeSignel=(e,index,vIndex)=>{
dataList[index].children[vIndex].isChecked=e.target.checked;
let checked=dataList[index].children.filter(item=>item.isChecked).length==dataList[index].children.length
dataList[index].isChecked=checked
let selectArray=dataList[index].children.filter(item=>item.isChecked)
dataList[index].selectList=selectArray
setdataList(lodash.cloneDeep(dataList))
}
//提交
const handleCommitBtn=()=>{
handleShowModal('btnLoading',true)
let result=[]
//数据处理成后台需要的格式
dataList.forEach(item=>{
if(item.selectList&&item.selectList.length>0){
let idArr=item.selectList.map(v=>v.userID)
item.isChecked&&idArr.push(item.id)
result.push(...idArr)
handleShowModal('loading', true);
getStationUserList({ stationID: currentStation.stationID, groupId }).then(
res => {
if (res.code === 0 && res.data) {
handleShowModal('loading', false);
dataList[index].children = res.data;
setdataList(lodash.cloneDeep(dataList));
}
},
);
};
// 每组全选全不选
const handleChangeAll = (e, index) => {
dataList[index].isChecked = e.target.checked;
dataList[index].selectList = e.target.checked
? dataList[index].userList
: [];
dataList[index].children &&
dataList[index].children.forEach(item => {
item.isChecked = e.target.checked;
});
setdataList(lodash.cloneDeep(dataList));
};
// 单个选择checkbox
const handleChangeSignel = (e, index, vIndex) => {
dataList[index].children[vIndex].isChecked = e.target.checked;
let checked =
dataList[index].children.filter(item => item.isChecked).length ==
dataList[index].children.length;
dataList[index].isChecked = checked;
let selectArray = dataList[index].children.filter(item => item.isChecked);
dataList[index].selectList = selectArray;
setdataList(lodash.cloneDeep(dataList));
};
// 提交
const handleCommitBtn = () => {
handleShowModal('btnLoading', true);
let result = [];
// 数据处理成后台需要的格式
dataList.forEach(item => {
if (item.selectList && item.selectList.length > 0) {
let idArr = item.selectList.map(v => v.userID);
item.isChecked && idArr.push(item.id);
result.push(...idArr);
}
})
});
chooseUserToStation(
qs.stringify({
userList: String(result.flat()),
......@@ -224,8 +239,8 @@ const SiteManage = props => {
},
)
.then(res => {
handleShowModal('btnLoading',false)
handleShowModal('btnLoading', false);
if (res.success) {
notification.success({
message: '提示',
......@@ -241,10 +256,10 @@ const SiteManage = props => {
}
})
.catch(err => {
handleShowModal('btnLoading',false)
handleShowModal('btnLoading', false);
console.log(err);
});
}
};
return (
<PageContainer>
{/* <Row>
......@@ -268,19 +283,19 @@ const SiteManage = props => {
</Spin>
<AddModal
visible={visibleParams.modalVisible}
onCancel={()=>handleShowModal('modalVisible',false)}
onCancel={() => handleShowModal('modalVisible', false)}
confirmModal={confirmModal}
/>
<DelModal
visible={visibleParams.delVisible}
stationId={currentStation.stationID}
onCancel={()=>handleShowModal('delVisible',false)}
onCancel={() => handleShowModal('delVisible', false)}
confirmModal={delModal}
/>
<EditModal
visible={visibleParams.editVisible}
stationObj={currentStation}
onCancel={()=>handleShowModal('editVisible',false)}
onCancel={() => handleShowModal('editVisible', false)}
confirmModal={editModal}
/>
<div>
......@@ -338,7 +353,7 @@ const SiteManage = props => {
<Col span={1}>搜索</Col>
<Col span={8}>
<Select
style={{width:'100%'}}
style={{ width: '100%' }}
showSearch
placeholder={placeholder}
onSearch={handleSearch}
......@@ -347,18 +362,20 @@ const SiteManage = props => {
option.children.indexOf(input) >= 0
}
>
{optionsList.map(item=>{
return <Option key={item.GroupId} value={item.GroupId}>{item.GroupName}</Option>
})}
{optionsList.map(item => (
<Option key={item.GroupId} value={item.GroupId}>
{item.GroupName}
</Option>
))}
</Select>
</Col>
{/* <Col span={3} /> */}
<Col span={15} style={{textAlign:'right'}}>
<Col span={15} style={{ textAlign: 'right' }}>
<Space size="small">
<Button
type="primary"
onClick={() => {
handleShowModal('modalVisible',true);
handleShowModal('modalVisible', true);
}}
>
新增
......@@ -366,9 +383,11 @@ const SiteManage = props => {
<Button
type="primary"
onClick={() => {
handleShowModal('editVisible',true);
handleShowModal('editVisible', true);
}}
disabled={!currentStation.stationID || visibleParams.spinLoading}
disabled={
!currentStation.stationID || visibleParams.spinLoading
}
>
编辑
</Button>
......@@ -376,9 +395,11 @@ const SiteManage = props => {
danger
type="primary"
onClick={() => {
handleShowModal('delVisible',true);
handleShowModal('delVisible', true);
}}
disabled={!currentStation.stationID || visibleParams.spinLoading}
disabled={
!currentStation.stationID || visibleParams.spinLoading
}
>
删除
</Button>
......@@ -386,22 +407,35 @@ const SiteManage = props => {
</Col>
</Row>
</Card>
<Card className={classnames({ [styles.boxH]: mulu, [styles.cardBoxR]: true, })}>
<Card
className={classnames({
[styles.boxH]: mulu,
[styles.cardBoxR]: true,
})}
>
{/* <Checkbox className={styles.siteAll}>全选/反选</Checkbox> */}
<Spin spinning={visibleParams.loading}>
{dataList.map((item,index)=>{
return <Panels {...item}
index={index}
key={item.GroupId}
{dataList.map((item, index) => (
<Panels
{...item}
index={index}
key={item.GroupId}
handleChangeCollpase={handleChangeCollpase}
handleChangeAll={handleChangeAll}
handleChangeSignel={handleChangeSignel}
/>
})}
))}
</Spin>
{dataList.length?<Button type='primary' className={styles.siteCommit} onClick={handleCommitBtn}>提交</Button>:null}
{dataList.length ? (
<Button
type="primary"
className={styles.siteCommit}
onClick={handleCommitBtn}
>
提交
</Button>
) : null}
</Card>
</div>
</div>
{/* </Col>
......@@ -410,28 +444,58 @@ const SiteManage = props => {
);
};
const Panels=React.memo((props)=>{
let {index,GroupId,GroupName,children,isChecked,isShow,color}=props;
return <div className={styles.sitePanel} key={GroupId} id={`siteId${GroupId}`}>
<div className={styles.sitePanelHead} onClick={()=>props.handleChangeCollpase(GroupId,isShow)}>
{isShow?<UpOutlined className={styles.siteIcon}/>:<DownOutlined className={styles.siteIcon}/>}
<p style={{color:color}}>{GroupName}</p>
const Panels = React.memo(props => {
let { index, GroupId, GroupName, children, isChecked, isShow, color } = props;
return (
<div className={styles.sitePanel} key={GroupId} id={`siteId${GroupId}`}>
<div
className={styles.sitePanelHead}
onClick={() => props.handleChangeCollpase(GroupId, isShow)}
>
{isShow ? (
<UpOutlined className={styles.siteIcon} />
) : (
<DownOutlined className={styles.siteIcon} />
)}
<p style={{ color }}>{GroupName}</p>
</div>
{isShow?
{isShow ? (
<div className={styles.sitePanelCon}>
<Checkbox key={'0'} className={styles.siteList} checked={isChecked} onClick={(e)=>props.handleChangeAll(e,index)}>全选</Checkbox>
{children&&children.map((v,vIndex)=>{
return <CheckBoxRow {...v} index={index} vIndex={vIndex} key={v.userID} handleChangeSignel={props.handleChangeSignel}/>
})}
</div>:null
}
<Checkbox
key="0"
className={styles.siteList}
checked={isChecked}
onClick={e => props.handleChangeAll(e, index)}
>
全选
</Checkbox>
{children &&
children.map((v, vIndex) => (
<CheckBoxRow
{...v}
index={index}
vIndex={vIndex}
key={v.userID}
handleChangeSignel={props.handleChangeSignel}
/>
))}
</div>
) : null}
</div>
})
);
});
const CheckBoxRow=React.memo((props)=>{
let {vIndex,index,isChecked,userName}=props;
return <Checkbox className={styles.siteList} checked={isChecked} onClick={(e)=>props.handleChangeSignel(e,index,vIndex)}>{userName}</Checkbox>
})
const CheckBoxRow = React.memo(props => {
let { vIndex, index, isChecked, userName } = props;
return (
<Checkbox
className={styles.siteList}
checked={isChecked}
onClick={e => props.handleChangeSignel(e, index, vIndex)}
>
{userName}
</Checkbox>
);
});
export default React.memo(appConnector(SiteManage));
import { get, post, CITY_SERVICE,PUBLISH_SERVICE } from '@/services/index';
import { get, post, CITY_SERVICE, PUBLISH_SERVICE } from '@/services/index';
/*
** params
......@@ -31,11 +31,10 @@ export const chooseUserToStation = (params, options) =>
export const getUserByStation = params =>
get(`${CITY_SERVICE}/OMS.svc/P_GetUserByStation`, params);
//获取站点一级列表
// 获取站点一级列表
export const getAllGroup = params =>
get(`${PUBLISH_SERVICE}/UserCenter/GetAllGroup`, params);
//获取站点二级列表
// 获取站点二级列表
export const getStationUserList = params =>
get(`${PUBLISH_SERVICE}/UserCenter/GetStationUserList`, 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