Skip to content

C
CivManage
Commit 5c5f61a0 authored by 邓超's avatar 邓超
Browse files
Options

fix: 添加流程节点是否发送短信配置，调整用户中心目录结构

parent 8baa4ed2
Pipeline #42335 passed with stages
          in 6 minutes 45 seconds
          Hide whitespace changes
          Inline Side-by-side
          Showing with 1074 additions and 1960 deletions
          src/components/BaseForm/index.js
          View file @ 5c5f61a0
          ......@@ -91,7 +91,7 @@ const BaseForm = props => {
          }, []);
          return (
          <Form size="small" form={form} {...formProps} {...restProps}>
          <Form form={form} {...formProps} {...restProps}>
          {items &&
          items.map(item => {
          const {
          ......
          src/components/Upload/index.tsx
          View file @ 5c5f61a0
          import React from 'react';
          import { Upload, Modal, message, Tabs, Result, Input, Collapse } from 'antd';
          import { Upload, Modal, message, Tabs, Result, Input, Collapse,Anchor } from 'antd';
          import { PlusOutlined, CheckCircleFilled } from '@ant-design/icons';
          import ImgCrop from 'antd-img-crop';
          import classnames from 'classnames';
          ......@@ -10,6 +10,7 @@ import styles from './index.less';
          import { getImageBases } from '@/services/common/api';
          import UploadContext from './context.js'
          import _, { clone } from 'lodash'
          const { Link } = Anchor;
          ......@@ -22,12 +23,12 @@ const wallCateName: any = {
          uploaded: '上传',
          };
          const tabNames: any = {
          CityTemp: '用户上传',
          icon: 'icon图标',
          androidMenu: '移动应用图标',
          menuNew: '应用图标',
          logo: '项目logo',
          menu: '菜单图标'
          menu: '菜单图标',
          CityTemp: '用户上传',
          }
          function getBase64(file: File | Blob) {
          ......@@ -163,6 +164,8 @@ class PicturesWall extends React.Component<PicturesWallType> {
          };
          handleImgSelected = (url: string, baseUrl: any) => {
          console.log(url,baseUrl);
          this.setState({
          curSelectedImg: url,
          baseUrl: baseUrl
          ......@@ -288,7 +291,7 @@ class PicturesWall extends React.Component<PicturesWallType> {
          <CheckCircleFilled />
          </span>
          </div>
          <span title={fileName}>{fileName}</span>
          <span id={`#${curSelectedImg}`} title={fileName}>{fileName}</span>
          </div>
          );
          }
          ......@@ -442,11 +445,12 @@ class PicturesWall extends React.Component<PicturesWallType> {
          onOk={this.handleModalOk}
          className={styles.modal}
          >
          {/* <Search onSearch={onSearch} /> */}
          {/* <Search style ={{ width:'200px',margin: '10px 0 10px 100px'}} onSearch={onSearch} /> */}
          <Tabs defaultActiveKey={imgBed[0]?.moduleName} tabPosition="left" style={{ height: 520 }}>
          {imgBed.map((item, i) => {
          if (item.moduleName == picType || item.moduleName == 'CityTemp') {
          const child = [...item.child] || [];
          console.log(item,'item');
          if (item.fileUrls.length > 0) {
          child.push({
          moduleName: item.moduleName,
          ......
          src/layouts/BasicLayout.js
          View file @ 5c5f61a0
          ......@@ -44,9 +44,7 @@ const BasicLayout = props => {
          matchRoutes(props.route.routes, props.location.pathname);
          return (
          <ProLayout
          logo={() => (
          <img src={logo} style={{ width: '32px', height: '32px' }} alt="" />
          )}
          logo={() => <img src={logo} style={{ width: '32px', height: '32px' }} alt="" />}
          style={{ height: '100vh' }}
          onCollapse={handleMenuCollapse}
          onMenuHeaderClick={() => {}}
          ......
          src/pages/database/InitDataBase.jsx
          View file @ 5c5f61a0
          ......@@ -466,14 +466,9 @@ const InitDataBase = props => {
          let mapCheckVersion = mapList.get(item.key);
          // 根据key值去匹配对应的checkVersion
          item.checkVersion =
          mapCheckVersion.checkVersion === undefined
          ? null
          : mapCheckVersion.checkVersion;
          mapCheckVersion.checkVersion === undefined ? null : mapCheckVersion.checkVersion;
          // 根据key值去匹配对应的二级目录的check
          item.check =
          mapCheckVersion.check === undefined
          ? null
          : mapCheckVersion.check;
          item.check = mapCheckVersion.check === undefined ? null : mapCheckVersion.check;
          if (item.check) {
          item.hasCheck = true;
          }
          ......@@ -526,8 +521,7 @@ const InitDataBase = props => {
          const radioChange = (index, value) => {
          setInitList(val => {
          const list = JSON.parse(JSON.stringify(val));
          const secondList =
          list[index.tabIndex].modularSolutions[index.radioIndex];
          const secondList = list[index.tabIndex].modularSolutions[index.radioIndex];
          // 取消功能 一开始未选中的才能取消
          if (value === secondList.checkVersion && !secondList.hasCheck) {
          secondList.checkVersion = null;
          ......@@ -651,7 +645,7 @@ const InitDataBase = props => {
          >
          修改描述
          </Button>
          <div onClick={e => e.stopPropagation()}>
          {/* <div onClick={e => e.stopPropagation()}>
          <Popconfirm
          title="是否删除该连接的历史记录？"
          okText="确认"
          ......@@ -664,7 +658,7 @@ const InitDataBase = props => {
          删除
          </Button>
          </Popconfirm>
          </div>
          </div> */}
          </Space>
          ),
          },
          ......@@ -710,9 +704,7 @@ const InitDataBase = props => {
          console.log(option);
          return (
          option.children &&
          option.children
          .toLowerCase()
          .indexOf(input.toLowerCase()) >= 0
          option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
          );
          }}
          >
          ......@@ -730,11 +722,7 @@ const InitDataBase = props => {
          <Space size="large" className={styles.btnBox}>
          <Space>
          <Button onClick={onCheck}>测试连接</Button>
          <Button
          type="primary"
          htmlType="submit"
          loading={tableLoading}
          >
          <Button type="primary" htmlType="submit" loading={tableLoading}>
          保存连接
          </Button>
          </Space>
          ......@@ -859,10 +847,7 @@ const InitDataBase = props => {
          visible={modalVisible.initVisible}
          onCancel={() => handleShowModal('initVisible', false)}
          footer={[
          <Button
          key="back"
          onClick={() => handleShowModal('initVisible', false)}
          >
          <Button key="back" onClick={() => handleShowModal('initVisible', false)}>
          取消
          </Button>,
          <Popconfirm
          ......
          src/pages/database/ManagementDataBase.jsx
          View file @ 5c5f61a0
          ......@@ -165,9 +165,7 @@ const ManagementDataBase = () => {
          const handleErrLog = (text, val) => {
          setModalTitle(val);
          let arr = [];
          arr.push(
          text.split(/(\r\n)|(\n)/).map((item, index) => <p key={index}>{item}</p>),
          );
          arr.push(text.split(/(\r\n)|(\n)/).map((item, index) => <p key={index}>{item}</p>));
          setModalVisible(true);
          // setContent(text);
          setContent(arr);
          ......@@ -175,9 +173,7 @@ const ManagementDataBase = () => {
          const handleLog = (text, val) => {
          setModalTitle(val);
          let arr = [];
          arr.push(
          text.split(/(\r\n)|(\n)/).map((item, index) => <p key={index}>{item}</p>),
          );
          arr.push(text.split(/(\r\n)|(\n)/).map((item, index) => <p key={index}>{item}</p>));
          setModalVisible(true);
          // setContent(text);
          setContent(arr);
          ......@@ -381,8 +377,7 @@ const ManagementDataBase = () => {
          </Card>
          <Card className={styles.mgTop20}>
          <div className={styles.tableTitle}>
          手动修复
          （字段长度不统一，请手动修改差异，数据可能会截断，请谨慎操作）
          手动修复 （字段长度不统一，请手动修改差异，数据可能会截断，请谨慎操作）
          </div>
          <Table
          className={styles.mgTop20}
          ......@@ -421,11 +416,7 @@ const ManagementDataBase = () => {
          }}
          style={{ top: '40px' }}
          footer={[
          <Button
          type="primary"
          onClick={() => setModalVisible(false)}
          key="back"
          >
          <Button type="primary" onClick={() => setModalVisible(false)} key="back">
          关闭窗口
          </Button>,
          ]}
          ......
          src/pages/platformCenter/bsmanager/workFlow/flowComponents/Timelimit.jsx
          View file @ 5c5f61a0
          ......@@ -103,9 +103,7 @@ const Timelimit = props => {
          dataIndex: 'TimeLimitField',
          align: 'center',
          render: text => (
          <span style={{ color: text === '(未配置)' ? 'grey' : '#0000009D' }}>
          {text}
          </span>
          <span style={{ color: text === '(未配置)' ? 'grey' : '#0000009D' }}>{text}</span>
          ),
          },
          {
          ......@@ -113,9 +111,7 @@ const Timelimit = props => {
          dataIndex: 'TimeoutField',
          align: 'center',
          render: text => (
          <span style={{ color: text === '(未配置)' ? 'grey' : '#0000009D' }}>
          {text}
          </span>
          <span style={{ color: text === '(未配置)' ? 'grey' : '#0000009D' }}>{text}</span>
          ),
          },
          {
          ......@@ -139,9 +135,7 @@ const Timelimit = props => {
          okText="是"
          cancelText="否"
          >
          <DeleteOutlined
          style={{ fontSize: '16px', color: '#e86060' }}
          />
          <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
          </Popconfirm>
          </Tooltip>
          </Space>
          ......@@ -186,8 +180,7 @@ const Timelimit = props => {
          },
          })}
          pagination={{
          showTotal: (total, range) =>
          `第${range[0]}-${range[1]} 条/共 ${total} 条`,
          showTotal: (total, range) => `第${range[0]}-${range[1]} 条/共 ${total} 条`,
          pageSizeOptions: [10, 20, 50, 100],
          defaultPageSize: 10,
          showQuickJumper: true,
          ......
          src/pages/platformCenter/bsmanager/workFlow/flowComponents/timelimitComponents/AddModal.jsx
          View file @ 5c5f61a0
          ......@@ -8,15 +8,7 @@ import { Form, Modal, Input, notification, Select } from 'antd';
          const { Option } = Select;
          const AddModal = props => {
          const {
          onSubumit,
          handleCancel,
          visible,
          msg,
          flowId,
          modalType,
          title,
          } = props;
          const { onSubumit, handleCancel, visible, msg, flowId, modalType, title } = props;
          const [flowNodes, setFlowNodes] = useState([]);
          const [timeLimitFlowNodes, setTimeLimitFlowNodes] = useState([]);
          const [startNodeIndex, setStartNodeIndex] = useState(null);
          ......@@ -147,11 +139,7 @@ const AddModal = props => {
          <Form.Item label="规则名称" name="Name" rules={[{ required: true }]}>
          <Input placeholder="请输入规则名称" />
          </Form.Item>
          <Form.Item
          label="起止节点"
          style={{ marginBottom: 0, message: '请选择节点' }}
          required
          >
          <Form.Item label="起止节点" style={{ marginBottom: 0, message: '请选择节点' }} required>
          <div style={{ display: 'flex' }}>
          <Form.Item
          name="StartNode"
          ......@@ -181,9 +169,7 @@ const AddModal = props => {
          <Option
          value={item.Name}
          key={item.ID}
          disabled={
          startNodeIndex !== null && index <= startNodeIndex
          }
          disabled={startNodeIndex !== null && index <= startNodeIndex}
          >
          {item.Name}
          </Option>
          ......@@ -201,9 +187,7 @@ const AddModal = props => {
          { required: true, message: '请选填写时限' },
          {
          validator: (_, value) =>
          value < 0
          ? Promise.reject(new Error('默认时限需要大于零'))
          : Promise.resolve(),
          value < 0 ? Promise.reject(new Error('默认时限需要大于零')) : Promise.resolve(),
          },
          ]}
          >
          ......
          src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNode.jsx
          View file @ 5c5f61a0
          ......@@ -172,7 +172,18 @@ const FlowNode = () => {
          key: 'outFields',
          align: 'center',
          width: 100,
          render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
          render: text => (
          <span
          style={{
          display: 'inline-block',
          width: '80px',
          color: Number(text) > 0 ? 'red' : '',
          backgroundColor: Number(text) > 0 ? 'yellow' : '',
          }}
          >
          {text}
          </span>
          ),
          },
          {
          ......@@ -220,6 +231,15 @@ const FlowNode = () => {
          <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
          ),
          },
          {
          title: '发送短信',
          dataIndex: 'IsSendMessage',
          align: 'center',
          width: 80,
          render: (text, record) => (
          <span style={{ color: record.colorType === 2 ? 'red' : '#000000D9' }}>{text}</span>
          ),
          },
          {
          title: '操作',
          align: 'center',
          ......@@ -369,6 +389,11 @@ const FlowNode = () => {
          align: 'center',
          width: 80,
          },
          {
          title: '发送短信',
          align: 'center',
          width: 80,
          },
          {
          title: '操作',
          align: 'center',
          ......
          src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNodeComponents/NodeEdit.jsx
          View file @ 5c5f61a0
          ......@@ -369,6 +369,12 @@ const NodeEdit = props => {
          <Radio value="1">是</Radio>
          </Radio.Group>
          </Form.Item>
          <Form.Item label="是否发送短信" name="IsSendMessage">
          <Radio.Group>
          <Radio value={0}>否</Radio>
          <Radio value={1}>是</Radio>
          </Radio.Group>
          </Form.Item>
          <Form.Item label="工单主表" name="TableName">
          <Select placeholder="请选择工单主表" onChange={changTable}>
          {eventTable.map(item => (
          ......
          src/pages/platformCenter/bsmanager/workFlow/flowNode/flowNodeComponents/auxiliaryComponents/AddModal.jsx
          View file @ 5c5f61a0
          import React, { useEffect } from 'react';
          import {
          getFlowNodeExtendPage,
          operateFlowNodeExtendPage,
          } from '@/services/platform/flow';
          import { getFlowNodeExtendPage, operateFlowNodeExtendPage } from '@/services/platform/flow';
          import { Form, Modal, Input, notification } from 'antd';
          const ProcessConfig = props => {
          const {
          onSubumit,
          handleCancel,
          visible,
          msg,
          flowNodeId,
          modalType,
          title,
          } = props;
          const { onSubumit, handleCancel, visible, msg, flowNodeId, modalType, title } = props;
          const [form] = Form.useForm();
          useEffect(() => {
          form.resetFields();
          ......
          src/pages/platformCenter/bsmanager/workOrder/incident.jsx
          View file @ 5c5f61a0
          ......@@ -202,7 +202,18 @@ const incident = () => {
          key: 'outFields',
          align: 'center',
          width: 100,
          render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
          render: text => (
          <span
          style={{
          display: 'inline-block',
          width: '80px',
          color: Number(text) > 0 ? 'red' : '',
          backgroundColor: Number(text) > 0 ? 'yellow' : '',
          }}
          >
          {text}
          </span>
          ),
          },
          {
          title: '上报方式',
          ......
          src/pages/platformCenter/bsmanager/workflowEdit/Workflow.jsx
          View file @ 5c5f61a0
          import React, { useEffect, useState } from 'react';
          import {
          WFGetAllFlow,
          GetFlowNode,
          DeleteFlow,
          } from '@/services/platform/workflow';
          import { WFGetAllFlow, GetFlowNode, DeleteFlow } from '@/services/platform/workflow';
          import { Card, Spin, Tooltip, notification, Empty, Modal } from 'antd';
          import {
          ......@@ -263,10 +259,7 @@ const Workflow = () => {
          <div style={{ display: `${treeVisible ? 'block' : 'none'}` }}>
          <span className={styles.processTitle}>流程树</span>
          <Tooltip title="添加流程组">
          <PlusSquareFilled
          onClick={e => addFlowGroup(e)}
          className={styles.treeHeadIcon}
          />
          <PlusSquareFilled onClick={e => addFlowGroup(e)} className={styles.treeHeadIcon} />
          </Tooltip>
          <hr className={styles.splitLine} />
          <div className={styles.treeContent}>
          ......@@ -303,10 +296,7 @@ const Workflow = () => {
          leaveCallBack={leaveCallBack}
          />
          ) : (
          <Empty
          image={Empty.PRESENTED_IMAGE_SIMPLE}
          description="当前未选中流程"
          />
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="当前未选中流程" />
          )}
          </div>
          </div>
          ......
          src/pages/platformCenter/bsmanager/workflowEdit/workFlowComponents/FlowChart.jsx
          View file @ 5c5f61a0
          ......@@ -155,9 +155,7 @@ const FlowChart = props => {
          diagram.nodeTemplate = objGo(
          go.Node,
          'Auto',
          new go.Binding('location', 'points', go.Point.parse).makeTwoWay(
          go.Point.stringify,
          ),
          new go.Binding('location', 'points', go.Point.parse).makeTwoWay(go.Point.stringify),
          // 节点样式配置
          objGo(
          go.Panel,
          ......@@ -165,13 +163,9 @@ const FlowChart = props => {
          go.Shape,
          new go.Binding('width', 'NodeType', v => (v === '0' ? 135 : 105)),
          new go.Binding('height', 'NodeType', v => (v === '0' ? 75 : 105)),
          new go.Binding('figure', 'NodeType', v =>
          v === '0' ? 'RoundedRectangle' : 'Ellipse',
          ),
          new go.Binding('figure', 'NodeType', v => (v === '0' ? 'RoundedRectangle' : 'Ellipse')),
          new go.Binding('strokeWidth', 'NodeType', v => (v === '0' ? 1 : 15)),
          new go.Binding('stroke', 'NodeType', v =>
          v === '0' ? '#0587E0' : '#D7EFFF',
          ),
          new go.Binding('stroke', 'NodeType', v => (v === '0' ? '#0587E0' : '#D7EFFF')),
          new go.Binding('fill', 'NodeType', v => {
          if (v === '0') {
          return '#DCF2FE';
          ......@@ -191,9 +185,7 @@ const FlowChart = props => {
          go.TextBlock,
          { maxSize: new go.Size(130, NaN), wrap: go.TextBlock.WrapFit },
          new go.Binding('text', 'NodeName'),
          new go.Binding('stroke', 'NodeType', v =>
          v === '0' ? '#077BD6' : '#fff',
          ),
          new go.Binding('stroke', 'NodeType', v => (v === '0' ? '#077BD6' : '#fff')),
          ),
          objGo(
          go.Picture,
          ......@@ -333,9 +325,7 @@ const FlowChart = props => {
          Nodes: diagramObj.nodeDataArray,
          Lines: diagramObj.linkDataArray,
          };
          if (
          JSON.stringify(stageJson.Nodes) === JSON.stringify(initFlowData.Nodes)
          ) {
          if (JSON.stringify(stageJson.Nodes) === JSON.stringify(initFlowData.Nodes)) {
          setShowLeaveTip(false);
          leaveCallBack(false);
          } else {
          ......@@ -373,6 +363,11 @@ const FlowChart = props => {
          })
          .then(res => {
          if (res.code === 0) {
          setDeleteNodes([]);
          setDeleteLines([]);
          setAddNodes([]);
          setDeleteNode('');
          setDeleteLine('');
          getFlowData();
          notification.success({
          message: '提示',
          ......@@ -397,10 +392,7 @@ const FlowChart = props => {
          };
          return (
          <>
          <Prompt
          message="编辑的内容还未保存，确定要离开该页面吗?"
          when={showLeaveTip}
          />
          <Prompt message="编辑的内容还未保存，确定要离开该页面吗?" when={showLeaveTip} />
          <div className={styles.buttonList}>
          <Button onClick={() => addNode()}>添加节点</Button>
          <Button type="primary" onClick={() => saveFlow()}>
          ......
          src/pages/platformCenter/bsmanager/workflowEdit/workFlowComponents/flowChartComponents/NodeModal.jsx
          View file @ 5c5f61a0
          ......@@ -70,10 +70,7 @@ const NodeModal = props => {
          return;
          }
          // 如果已经有角色就提示
          if (
          nodeMsg.roleList.some(item => item.roleId === obj.roleId) &&
          isEdit === 'add'
          ) {
          if (nodeMsg.roleList.some(item => item.roleId === obj.roleId) && isEdit === 'add') {
          notification.error({
          message: '提示',
          duration: 3,
          ......@@ -82,9 +79,7 @@ const NodeModal = props => {
          return;
          }
          // 编辑角色覆盖原有
          let chooseIndex = nodeMsg.roleList.findIndex(
          item => item.roleId === obj.roleId,
          );
          let chooseIndex = nodeMsg.roleList.findIndex(item => item.roleId === obj.roleId);
          let newList;
          if (chooseIndex === -1) {
          // 添加表格
          ......@@ -146,9 +141,7 @@ const NodeModal = props => {
          okText="是"
          cancelText="否"
          >
          <DeleteOutlined
          style={{ fontSize: '16px', color: '#e86060' }}
          />
          <DeleteOutlined style={{ fontSize: '16px', color: '#e86060' }} />
          </Popconfirm>
          </Tooltip>
          <Tooltip title="修改默认承办人">
          ......
          src/pages/platformCenter/bsmanager/workflowEdit/workFlowComponents/flowChartComponents/nodeModalComponents/RoalChoose.jsx
          View file @ 5c5f61a0
          ......@@ -220,10 +220,7 @@ const RoalChoose = props => {
          treeData={treeData.map(item => mapTree(item))}
          />
          ) : (
          <Empty
          image={Empty.PRESENTED_IMAGE_SIMPLE}
          description="未有查找到角色"
          />
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="未有查找到角色" />
          );
          return (
          <Modal
          ......@@ -250,11 +247,7 @@ const RoalChoose = props => {
          />
          </Form.Item>
          <Form.Item>
          <Button
          type="primary"
          htmlType="submit"
          disabled={modalType === 'edit'}
          >
          <Button type="primary" htmlType="submit" disabled={modalType === 'edit'}>
          搜索
          </Button>
          </Form.Item>
          ......@@ -296,26 +289,15 @@ const RoalChoose = props => {
          {/* 用户列表 */}
          <div className={styles.userContent}>
          <div className={styles.userCheckBox}>
          <Checkbox
          indeterminate={indeterminate}
          onChange={onCheckAllChange}
          checked={checkAll}
          >
          <Checkbox indeterminate={indeterminate} onChange={onCheckAllChange} checked={checkAll}>
          <span style={{ fontWeight: 700 }}>用户列表</span>
          </Checkbox>
          <Divider style={{ margin: '10px 0' }} />
          <div className={styles.checkContent}>
          {plainOptions.length > 0 ? (
          <CheckboxGroup
          options={plainOptions}
          value={checkedList}
          onChange={onChange}
          />
          <CheckboxGroup options={plainOptions} value={checkedList} onChange={onChange} />
          ) : (
          <Empty
          image={Empty.PRESENTED_IMAGE_SIMPLE}
          description="未有查找到用户"
          />
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} description="未有查找到用户" />
          )}
          </div>
          </div>
          ......
          src/pages/platformCenter/standingBook/standingBook.jsx
          View file @ 5c5f61a0
          ......@@ -104,7 +104,18 @@ const standingBook = props => {
          key: 'outFields',
          align: 'center',
          width: 100,
          render: text => <span style={{ color: Number(text) > 0 ? 'red' : '' }}>{text}</span>,
          render: text => (
          <span
          style={{
          display: 'inline-block',
          width: '80px',
          color: Number(text) > 0 ? 'red' : '',
          backgroundColor: Number(text) > 0 ? 'yellow' : '',
          }}
          >
          {text}
          </span>
          ),
          },
          {
          title: '操作',
          ......
          src/pages/testPages/request.jsx
          View file @ 5c5f61a0
          ......@@ -3,10 +3,7 @@ import { Form, Input, Button, Space, Select, Col } from 'antd';
          import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
          import { get, post } from '../../services';
          const methods = [
          { label: 'get', value: 'get' },
          { label: 'post', value: 'post' },
          ];
          const methods = [{ label: 'get', value: 'get' }, { label: 'post', value: 'post' }];
          const RequestTest = () => {
          const [protocal, setprotocal] = useState('http://');
          ......@@ -46,11 +43,7 @@ const RequestTest = () => {
          };
          const protocalBefore = (
          <Select
          defaultValue="http://"
          className="select-before"
          onChange={handleProtoSelectChange}
          >
          <Select defaultValue="http://" className="select-before" onChange={handleProtoSelectChange}>
          <Select.Option value="http://">http://</Select.Option>
          <Select.Option value="https://">https://</Select.Option>
          </Select>
          ......
          src/pages/userCenter/roleManage/SelectUser/SelectUser.jsx
          View file @ 5c5f61a0
          ......@@ -278,18 +278,6 @@ const SelectUser = props => {
          ))}
          </div>
          </Spin>
          {/* 分页 */}
          <Pagination
          total={total}
          showTotal={(totals, range) => `第${range[0]}-${range[1]} 条/共 ${totals} 条`}
          defaultPageSize={pageSize}
          defaultCurrent={1}
          current={currentPage}
          onChange={paginationChange}
          style={{ marginBottom: '10px', width: '500px' }}
          size="small"
          showQuickJumper
          />
          </div>
          <div className={styles.tableRight}>
          <Table
          ......@@ -304,6 +292,18 @@ const SelectUser = props => {
          />
          </div>
          </div>
          {/* 分页 */}
          <Pagination
          total={total}
          showTotal={(totals, range) => `第${range[0]}-${range[1]} 条/共 ${totals} 条`}
          defaultPageSize={pageSize}
          defaultCurrent={1}
          current={currentPage}
          onChange={paginationChange}
          style={{ marginBottom: '10px' }}
          size="small"
          showQuickJumper
          />
          </Modal>
          </>
          );
          ......
          src/pages/userCenter/siteManage/SiteManage.jsx
          View file @ 5c5f61a0
          import React, { useState, useEffect } from 'react';
          import React, { useEffect, useState } from 'react';
          import {
          Row,
          Col,
          Card,
          // Tree,
          Table,
          Space,
          message,
          Modal,
          Input,
          notification,
          Tooltip,
          Card,
          Button,
          notification,
          Spin,
          List,
          Space,
          Checkbox,
          Pagination,
          Dropdown,
          Menu,
          Row,
          Col,
          Empty,
          Pagination,
          Checkbox,
          } from 'antd';
          import lodash, { clone } from 'lodash';
          import classnames from 'classnames';
          import {
          UserOutlined,
          PlusSquareOutlined,
          UsergroupAddOutlined,
          EditOutlined,
          FormOutlined,
          DeleteOutlined,
          DoubleLeftOutlined,
          DoubleRightOutlined,
          UserOutlined,
          DownOutlined,
          PlusOutlined,
          ApartmentOutlined,
          CaretUpOutlined,
          CaretDownOutlined,
          } from '@ant-design/icons';
          import PageContainer from '@/components/BasePageContainer';
          import Tree from '@/components/ExpendableTree';
          import voca from 'voca';
          import zhCN from 'antd/es/locale/zh_CN';
          import qs from 'qs';
          import lodash, { clone } from 'lodash';
          import styles from './SiteManage.less';
          import {
          getWebModuleTree,
          chooseUserToStation,
          ......@@ -28,27 +52,30 @@ import {
          getUserByStation,
          getStationUserList,
          groupUserPagingList,
          addChildSiteNode,
          getSiteTree,
          getStationUsers,
          DragGroup,
          } from '@/services/userCenter/siteManage/api';
          // import ListCard, {
          // checkChildrenByCondition,
          // getId,
          // } from '@/components/CheckGroup';
          import styles from '@/pages/userCenter/siteManage/SiteManage.less';
          import qs from 'qs';
          import { appConnector } from '@/containers/App/store';
          import classnames from 'classnames';
          import AddModal from './AddModal';
          import DelModal from './DelModal';
          import EditModal from './EditModal';
          import userStyles from '@/pages/userCenter/userManage/UserManage.less';
          import AddChildModal from './AddChildModal';
          const { Search } = Input;
          const placeholder = '请输入机构名称';
          const SiteManage = props => {
          const { userMode } = props;
          const [treeData, setTreeData] = useState([]); // 树结构数据
          const SiteManageV2 = () => {
          const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
          const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
          const [treeData, setTreeData] = useState([]); // 用户站点树
          const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份，用于更改机构
          const [treeState, setTreeState] = useState(true); // 树第一次加载
          const [treeLoading, setTreeLoading] = useState(false);
          const [currentStation, setCurrentStation] = useState(''); // 当前选中站点
          const [currentStationMsg, setCurrentStationMsg] = useState({}); // 当前编辑节点信息
          const [currentStationOperate, setCurrentStationOperate] = useState(false);
          const [flag, setFlag] = useState(1); // 操作标致触发界面刷新
          const [dataList, setdataList] = useState([]); // 当前站点对应的分页用户列表
          const [selectedState, setSelectedState] = useState(false); // 已选列表展开状态true为展开false为收起
          const [visibleParams, setvisibleParams] = useState({
          modalVisible: false, // 新增弹窗
          delVisible: false, // 删除弹窗
          ......@@ -58,105 +85,132 @@ const SiteManage = props => {
          loading: false,
          checkBoxLoading: false,
          });
          const [flag, setFlag] = useState(1);
          const [dataList, setdataList] = useState([]);
          const [mulu, setMulu] = useState(true);
          const [selectList, setSelectList] = useState([]); // 选择列表数据
          const [total, setTotal] = useState(0); // 分页总数
          const [page, setPage] = useState({ pageNum: 1, pageSize: 5 });
          const [update, setUpdate] = useState(1);
          const [update1, setUpdate1] = useState(1);
          const [page, setPage] = useState({ pageNum: 1, pageSize: 10 });
          const [selectList, setSelectList] = useState([]); // 选择列表数据
          const [updatePageUser, setUpdatePageUser] = useState(1); //
          const [updateCheck, setUpdateCheck] = useState(1);
          const [name, setName] = useState('');
          // 侧边栏站点
          useEffect(() => {
          handleShowModal('spinLoading', true);
          getWebModuleTree({
          userMode: userMode || 'super',
          select: '',
          node: -2,
          })
          .then(res => {
          handleShowModal('spinLoading', false);
          let arr = [];
          if (code === 0) {
          arr.push(res.find(item => item.id === 'Web4StationRoot'));
          }
          if (arr[0]) {
          const stations = arr[0].children || [];
          setTreeData(stations);
          if (stations.length > 0) {
          if (!currentStation.stationID) {
          setCurrentStation(stations[0]);
          } else {
          setCurrentStation(
          stations.find(s => s.stationID === currentStation.stationID) ||
          stations[0],
          );
          }
          } else {
          setdataList([]);
          }
          const [des, setDes] = useState('');
          const [data, setData] = useState('');
          const [ch, setCh] = useState('');
          let a = [];
          // 渲染机构树
          const mapTree = org => {
          const haveChildren = Array.isArray(org.children) && org.children.length > 0;
          return {
          title: (
          <div className={styles.title}>
          <div className={styles.titleText}>{org.text}</div>
          <div className={styles.tip}>
          <Tooltip title="添加下级站点" className={styles.fs}>
          <PlusSquareOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => addSite(e, org)}
          />
          </Tooltip>
          <Tooltip title="编辑当前站点" className={styles.fs}>
          <FormOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => editorSite(e, org)}
          />
          </Tooltip>
          <Tooltip title="删除当前站点" className={styles.fs}>
          <DeleteOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => delSite(e, org)}
          />
          </Tooltip>
          </div>
          </div>
          ),
          key: org.id,
          // icon: <UserOutlined style={{ display: 'inline' }} />,
          // 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作
          children: haveChildren ? org.children.map(i => mapTree(i)) : [],
          };
          };
          // 添加下级站点
          const addSite = (e, recode) => {
          e.stopPropagation();
          setCurrentStation(recode.id);
          handleShowModal('addChildVisible', true);
          };
          // 删除当前站点
          const delSite = (e, recode) => {
          e.stopPropagation();
          setCurrentStation(recode.id);
          handleShowModal('delVisible', true);
          };
          // 编辑当前站点
          const editorSite = (e, recode) => {
          e.stopPropagation();
          // console.log(recode);
          // 保存编辑回显信息
          setCurrentStationMsg(recode);
          // setCurrentStation(recode.id);
          handleShowModal('editVisible', true);
          };
          // 重新渲染树
          const updateTrees = () => {
          setTreeLoading(true);
          getSiteTree({ selectNode: -1 }).then(res => {
          if (res.data.length > 0) {
          setTreeLoading(false);
          setTreeData(res.data);
          setTreeDataCopy(res.data);
          // 第一次加载，默认选择第一个组织
          if (treeState) {
          onSelect([res.data[0].id], false); // 待会儿要改
          setTreeState(false);
          }
          })
          .catch(err => {
          handleShowModal('spinLoading', false);
          console.error(err);
          });
          }, [flag]);
          // 右边对应的机构
          } else {
          setTreeLoading(false);
          notification.error({
          message: '提示',
          duration: 15,
          description: res.msg,
          });
          }
          });
          };
          // 获取用户机构树
          // useEffect(() => {
          // updateTrees();
          // }, [flag]);
          useEffect(() => {
          if (!currentStation.stationID) return;
          handleShowModal('loading', true);
          getValue();
          updateTrees();
          }, []);
          // 切换站点，点击分页按钮，提交
          useEffect(() => {
          if (!currentStation) return;
          getList();
          }, [update, name]);
          setShowSearchStyle(false);
          }, [updatePageUser]);
          // 切换站点，提交时触发已勾选列表更新
          useEffect(() => {
          if (!currentStation.stationID) return;
          handleShowModal('loading', true);
          getAllcheckList();
          }, [currentStation, update1]);
          const getAllcheckList = async () => {
          let res = await getUserByStation({
          stationID: currentStation.stationID,
          _version: 9999,
          _dc: new Date().getTime(),
          });
          if (res.length > 0) {
          // 还原从后台返回的数据 选中的列表
          let list = [];
          // console.log(res);
          res.forEach(item => {
          if (item.userList.length > 0) {
          item.userList.forEach(value => {
          // console.log(value);
          if (
          value.isChecked &&
          list.findIndex(
          v => +v.GroupId === +item.OUID && +v.userID === +value.userID,
          ) === -1
          ) {
          list.push({
          GroupId: +item.OUID,
          GroupName: item.OUName,
          userName: value.userName,
          userID: value.userID,
          });
          }
          });
          }
          });
          setSelectList(lodash.cloneDeep(list));
          setUpdate(update + 1);
          }
          };
          if (!currentStation) return;
          // getAllcheckList();
          getAllCheckListNew();
          }, [currentStation, updateCheck]);
          // 获取当前站点可编辑用户(已勾选和未勾选)分页展示
          const getList = () => {
          let params = {
          stationId: +currentStation.stationID || '',
          id: +currentStation || '',
          PageIndex: +page.pageNum,
          PageSize: +page.pageSize,
          };
          if (name) params = { ...params, name };
          groupUserPagingList(params).then(res => {
          if (res.code === 0 && res.data) {
          setShowSearchStyle(true);
          let { list } = res.data;
          // 还原选择的数据
          if (selectList.length > 0) {
          ......@@ -168,8 +222,7 @@ const SiteManage = props => {
          list[index].Users[userIndex].isChecked = true;
          }
          });
          let checkedLen = list[index].Users.filter(v => v.isChecked)
          .length;
          let checkedLen = list[index].Users.filter(v => v.isChecked).length;
          if (checkedLen === list[index].Users.length) {
          list[index].isChecked = true;
          }
          ......@@ -186,6 +239,98 @@ const SiteManage = props => {
          }
          });
          };
          // 获取当前站点所有已经勾选的用户
          const getAllcheckList = async () => {
          let res = await getUserByStation({
          stationID: currentStation,
          _version: 9999,
          _dc: new Date().getTime(),
          });
          if (res.length > 0) {
          // 还原从后台返回的数据 选中的列表
          let list = [];
          // console.log(res);
          res.forEach(item => {
          if (item.userList.length > 0) {
          item.userList.forEach(value => {
          // console.log(value);
          if (
          value.isChecked &&
          list.findIndex(v => +v.GroupId === +item.OUID && +v.userID === +value.userID) === -1
          ) {
          list.push({
          GroupId: +item.OUID,
          GroupName: item.OUName,
          userName: value.userName,
          userID: value.userID,
          });
          }
          });
          }
          });
          setSelectList(lodash.cloneDeep(list));
          setUpdatePageUser(updatePageUser + 1);
          }
          };
          // 获取当前站点所有已经勾选的用户新接口
          const getAllCheckListNew = () => {
          getStationUsers({
          stationId: currentStation,
          }).then(res => {
          let list = [];
          if (res.data.length > 0) {
          res.data.map((item, index) => {
          list.push({
          GroupId: +item.OUID,
          GroupName: item.OUName,
          userName: item.userName,
          userID: item.userID,
          });
          });
          }
          setSelectList(lodash.cloneDeep(list));
          setUpdatePageUser(updatePageUser + 1);
          });
          };
          // 选中某个站点
          const onSelect = (props, e) => {
          console.log('props[0]', props[0]);
          setCh(props[0]);
          if (!props[0]) {
          setCurrentStation(currentStation);
          } else {
          setCurrentStation(props[0]);
          }
          setPage({ pageNum: 1, pageSize: 10 });
          console.log(data);
          data.map((item, index) => {
          if (item.id == props[0]) {
          console.log(item.id);
          console.log(item.describe);
          setDes(item.describe);
          }
          });
          };
          const getValue = () => {
          getSiteTree({ selectNode: -1 }).then(res => {
          console.log(res.data);
          getData1(res.data);
          });
          };
          const getData1 = e => {
          console.log(e);
          e.map((i, j) => {
          a.push(i);
          if (i.children.length > 0) {
          getData1(i.children);
          }
          });
          console.log(a);
          setData(a);
          };
          // 弹出模态框
          const handleShowModal = (key, value) => {
          setvisibleParams({ ...visibleParams, [key]: value });
          ......@@ -193,40 +338,29 @@ const SiteManage = props => {
          // 获取搜索框的值
          const handleSearch = value => {
          setName(value);
          // getList(value);
          getList(value);
          };
          const confirmModal = e => {
          handleShowModal('modalVisible', false);
          setFlag(flag + 1);
          updateTrees();
          // setFlag(flag + 1);
          };
          const delModal = () => {
          handleShowModal('delVisible', false);
          setFlag(flag + 1);
          updateTrees();
          // setFlag(flag + 1);
          };
          const editModal = () => {
          handleShowModal('editVisible', false);
          setFlag(flag + 1);
          updateTrees();
          // setFlag(flag + 1);
          };
          const handleHide = () => {
          setMulu(!mulu);
          const addChildModal = () => {
          handleShowModal('addChildVisible', false);
          updateTrees();
          // setFlag(flag + 1);
          };
          const renderListItem = items =>
          items.map(t => (
          <List.Item
          onClick={() => {
          // setSelectList(lodash.cloneDeep([]));
          setPage({ pageNum: 1, pageSize: 5 });
          setCurrentStation(t);
          }}
          key={t.id}
          className={classnames({
          [styles.listItem]: true,
          [styles.selected]: currentStation.id === t.id,
          })}
          >
          {t.text}
          </List.Item>
          ));
          const handleChangeCollpase = (groupId, isShow) => {
          let index = dataList.findIndex(item => item.GroupId === groupId);
          if (dataList[index].children && dataList[index].children.length > 0) {
          ......@@ -234,15 +368,13 @@ const SiteManage = props => {
          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));
          }
          },
          );
          getStationUserList({ stationID: currentStation, 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) => {
          ......@@ -293,16 +425,13 @@ const SiteManage = props => {
          setdataList(lodash.cloneDeep(dataList));
          };
          const isAllChecked = index =>
          dataList[index].Users.filter(item => item.isChecked).length ===
          dataList[index].Users.length;
          dataList[index].Users.filter(item => item.isChecked).length === dataList[index].Users.length;
          // 删除已选列表
          const handleDel = index => {
          let { GroupId, userID } = selectList[index];
          let outerIndex = dataList.findIndex(item => item.GroupId === GroupId);
          if (outerIndex > -1) {
          let innerIndex = dataList[outerIndex].Users.findIndex(
          item => item.userID === userID,
          );
          let innerIndex = dataList[outerIndex].Users.findIndex(item => item.userID === userID);
          dataList[outerIndex].Users[innerIndex].isChecked = false;
          dataList[outerIndex].isChecked = isAllChecked(outerIndex);
          }
          ......@@ -322,11 +451,11 @@ const SiteManage = props => {
          obj[item.GroupId] = [item.userID];
          }
          });
          dataList.forEach(item => {
          if (obj[item.GroupId] && item.Users.length === obj[item.GroupId].length) {
          obj[item.GroupId].push(item.GroupId);
          }
          });
          // dataList.forEach(item => {
          // if (obj[item.GroupId] && item.Users.length === obj[item.GroupId].length) {
          // obj[item.GroupId].push(item.GroupId);
          // }
          // });
          result = Object.values(obj);
          // 数据处理成后台需要的格式
          if (result.length === 0)
          ......@@ -334,23 +463,16 @@ const SiteManage = props => {
          message: '提示',
          description: '请至少选择选择一个用户！',
          });
          chooseUserToStation(
          qs.stringify({
          userList: String(result.flat()),
          stationID: currentStation.stationID,
          }),
          {
          headers: {
          'content-type': 'application/x-www-form-urlencggoded;charset=UTF-8',
          },
          },
          )
          chooseUserToStation({
          userList: String(result.flat()),
          stationID: currentStation,
          })
          .then(res => {
          handleShowModal('btnLoading', false);
          if (res.code === 0) {
          setSelectList([]);
          setUpdate1(update1 + 1);
          setUpdateCheck(updateCheck + 1);
          notification.success({
          message: '提示',
          duration: 3,
          ......@@ -360,7 +482,7 @@ const SiteManage = props => {
          notification.error({
          message: '提示',
          duration: 15,
          description: res.message,
          description: res.msg,
          });
          }
          })
          ......@@ -372,202 +494,345 @@ const SiteManage = props => {
          // 分页
          const handleChangePage = (pageNum, pageSize) => {
          setPage({ pageNum, pageSize });
          setUpdate(update + 1);
          setUpdatePageUser(updatePageUser + 1);
          };
          /** ***操作按钮**** */
          // 机构操作
          const addTopStation = () => {
          handleShowModal('modalVisible', true);
          };
          // 模糊查询匹配的样式
          const searchStyle = val => {
          console.log(showSearchStyle);
          console.log(name);
          let n;
          if (showSearchStyle) {
          n = val.replace(new RegExp(name, 'g'), `<span style='color:red'>${name}</span>`);
          } else {
          n = val;
          }
          console.log(n);
          return <div dangerouslySetInnerHTML={{ __html: n }} />;
          };
          // 返回拖拽完毕后的信息
          const loop = (datas, key, parentID, callback) => {
          for (let i = 0; i < datas.length; i++) {
          if (datas[i].id === key) {
          return callback(datas[i], i, datas, parentID);
          }
          if (datas[i].children) {
          loop(datas[i].children, key, datas[i].id, callback);
          }
          }
          };
          // 树的拖拽
          const handleDrop = infos => {
          console.log(infos);
          const dropKey = infos.node.key;
          const dragKey = infos.dragNode.key;
          const dropPos = infos.node.pos.split('-');
          const dropPosition = infos.dropPosition - Number(dropPos[dropPos.length - 1]);
          const datas = JSON.parse(JSON.stringify(treeData));
          console.log(dropKey, 'dropKey');
          console.log(dragKey, 'dragKey');
          // 找到拖拽的元素
          let dragObj;
          let dropObj;
          let parId;
          let dragList;
          // 保存拖拽到的节点信息
          loop(datas, dropKey, -1, item => {
          dropObj = item;
          });
          // 保存节点信息并删除节点
          loop(datas, dragKey, -1, (item, index, arr) => {
          arr.splice(index, 1);
          dragObj = item;
          });
          // 将节点插入到正确的位置
          if (!infos.dropToGap) {
          console.log('33333333333');
          dropObj.children = dropObj.children || [];
          // 在哪里插入,示例添加到头部，可以是随意位置
          dropObj.children.unshift(dragObj);
          parId = dropObj.id;
          dragList = dropObj.children.map(val => val.id);
          } else {
          let ar;
          let i;
          loop(datas, dropKey, -1, (item, index, arr, parentID) => {
          ar = arr;
          i = index;
          parId = parentID;
          });
          if (dropPosition === -1) {
          ar.splice(i, 0, dragObj);
          } else {
          ar.splice(i + 1, 0, dragObj);
          }
          dragList = ar.map(ele => ele.id);
          }
          DragGroup({
          dragGroupType: 3,
          groupId: dragKey.toString(),
          groupList: dragList.map(item => item.toString()),
          parentId: parId.toString(),
          }).then(res => {
          if (res.code === 0) {
          updateTrees();
          } else {
          message.error(res.msg);
          }
          });
          };
          const Panels = React.memo(props => {
          let { index, GroupId, GroupName, Users, isChecked, isShow, color } = props;
          return (
          <div className={styles.sitePanel} key={GroupId} id={`siteId${GroupId}`}>
          {/* onClick={() => props.handleChangeCollpase(GroupId, isShow)} */}
          <div className={styles.sitePanelHead}>
          {/* {isShow ? (
          <UpOutlined className={styles.siteIcon} />
          ) : (
          <DownOutlined className={styles.siteIcon} />
          )} */}
          {/* <UpOutlined className={styles.siteIcon} /> */}
          <ApartmentOutlined className={styles.siteIcon} />
          {searchStyle(GroupName)}
          <Checkbox
          key="0"
          className={styles.siteListTitle}
          checked={isChecked}
          onClick={e => props.handleChangeAll(e, index)}
          >
          全选
          </Checkbox>
          </div>
          <div className={styles.sitePanelCon}>
          {Users.length > 0 &&
          Users.map((v, vIndex) => (
          <CheckBoxRow
          {...v}
          index={index}
          vIndex={vIndex}
          key={v.userID}
          handleChangeSignel={props.handleChangeSignel}
          />
          ))}
          </div>
          </div>
          );
          });
          return (
          <PageContainer>
          <div className={styles.content}>
          <PageContainer className={styles.siteManageContainer}>
          <div className={styles.contentContainer}>
          <Card
          className={classnames({
          [styles.cardBox]: true,
          [styles.hideBox]: !mulu,
          [styles.orgContainer]: true,
          [styles.orgContainerHide]: !treeVisible,
          })}
          >
          <Spin
          tip="loading...."
          spinning={visibleParams.spinLoading}
          style={{ marginTop: '20px' }}
          >
          <div className={userStyles.siteTitle}>
          <span>选择站点：</span>
          <span style={{ margin: '0 180px 0 10px' }}>站点列表</span>
          <Tooltip title="添加顶级站点">
          <PlusOutlined
          onClick={() => addTopStation()}
          style={{
          color: '#1890FF',
          fontSize: '18px',
          verticalAlign: '0.04em',
          }}
          />
          </Tooltip>
          {treeData.length > 0 && (
          <div style={{ height: 'calc(100vh - 120px)', overflowY: 'scroll' }}>
          <Tree
          showIcon="true"
          showLine={{ showLeafIcon: false }}
          blockNode
          autoExpandParent
          selectedKeys={[currentStation]}
          onSelect={onSelect}
          treeData={treeData.map(t => mapTree(t))}
          draggable
          onDrop={handleDrop}
          />
          </div>
          <List>{renderListItem(treeData)}</List>
          </Spin>
          )}
          <div className={styles.switcher}>
          {treeVisible && (
          <Tooltip title="隐藏站点列表">
          <DoubleLeftOutlined onClick={() => setTreeVisible(false)} />
          </Tooltip>
          )}
          {!treeVisible && (
          <Tooltip title="显示站点列表">
          <DoubleRightOutlined onClick={() => setTreeVisible(true)} />
          </Tooltip>
          )}
          </div>
          </Card>
          {/* 右侧用户表 */}
          <div
          className={classnames({
          [styles.userContainer]: true,
          [styles.userContainerHide]: !treeVisible,
          })}
          >
          <AddModal
          visible={visibleParams.modalVisible}
          onCancel={() => handleShowModal('modalVisible', false)}
          confirmModal={confirmModal}
          />
          <AddChildModal
          visible={visibleParams.addChildVisible}
          pid={currentStation}
          onCancel={() => handleShowModal('addChildVisible', false)}
          confirmModal={addChildModal}
          />
          <DelModal
          visible={visibleParams.delVisible}
          stationId={currentStation.stationID}
          stationId={currentStation}
          onCancel={() => handleShowModal('delVisible', false)}
          confirmModal={delModal}
          />
          <EditModal
          visible={visibleParams.editVisible}
          stationObj={currentStation}
          stationObj={currentStationMsg}
          des={des}
          onCancel={() => handleShowModal('editVisible', false)}
          confirmModal={editModal}
          />
          <div>
          {mulu && (
          <Tooltip title="隐藏站点" className={styles.hide}>
          <DoubleLeftOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          {!mulu && (
          <Tooltip title="显示站点" className={styles.hide}>
          <DoubleRightOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          </div>
          </Card>
          {/* <div>
          {mulu && (
          <Tooltip title="隐藏站点" className={styles.hide}>
          <DoubleLeftOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          {!mulu && (
          <Tooltip title="显示站点" className={styles.hide}>
          <DoubleRightOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          </div> */}
          {/* </Col> */}
          {/* <Col span={mulu ? 0 : 1}>
          {mulu && (
          <Tooltip title="隐藏站点" className={styles.hide}>
          <DoubleLeftOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          {!mulu && (
          <Tooltip title="显示站点" className={styles.hide}>
          <DoubleRightOutlined onClick={() => handleHide()} />
          </Tooltip>
          )}
          </Col> */}
          {/* <Col span={mulu ? 20 : 23}> */}
          <div
          className={classnames({
          [styles.boxR]: true,
          [styles.boxH]: mulu,
          })}
          >
          <Card
          <div
          className={classnames({
          [styles.cardBoxTop]: true,
          [styles.boxH]: mulu,
          [styles.boxR]: true,
          [styles.boxH]: treeVisible,
          })}
          >
          <Row align="middle">
          <Col span={1}>搜索</Col>
          <Col span={8}>
          <Search
          allowClear
          placeholder={placeholder}
          onSearch={handleSearch}
          // onChange={handleChange}
          enterButton
          />
          </Col>
          <Col span={3} />
          <Col span={8}>
          <Space size="large">
          <Button
          type="primary"
          onClick={() => {
          handleShowModal('modalVisible', true);
          }}
          >
          新增
          </Button>
          <Button
          type="primary"
          onClick={() => {
          handleShowModal('editVisible', true);
          }}
          disabled={
          !currentStation.stationID || visibleParams.spinLoading
          }
          >
          编辑
          </Button>
          <Button
          danger
          type="primary"
          onClick={() => {
          handleShowModal('delVisible', true);
          }}
          disabled={
          !currentStation.stationID || visibleParams.spinLoading
          }
          >
          删除
          </Button>
          </Space>
          </Col>
          </Row>
          </Card>
          <div style={{ background: '#fff' }}>
          <Card
          className={classnames({
          [styles.boxH]: mulu,
          [styles.cardBoxR]: true,
          [styles.cardBoxTop]: true,
          [styles.boxH]: treeVisible,
          })}
          >
          {/* <Checkbox className={styles.siteAll}>全选/反选</Checkbox> */}
          <Spin spinning={visibleParams.loading}>
          {dataList.map((item, index) => (
          <Panels
          {...item}
          index={index}
          key={item.GroupId}
          handleChangeCollpase={handleChangeCollpase}
          handleChangeAll={handleChangeAll}
          handleChangeSignel={handleChangeSignel}
          <Row align="middle">
          <Col span={1}>搜索</Col>
          <Col span={8}>
          <Search
          allowClear
          placeholder={placeholder}
          onSearch={handleSearch}
          // onChange={handleChange}
          enterButton
          />
          ))}
          </Spin>
          {dataList.length > 0 && !visibleParams.loading ? (
          <>
          <div style={{ textAlign: 'right' }}>
          <Pagination
          size="small"
          total={total}
          current={page.pageNum}
          defaultPageSize="5"
          onChange={handleChangePage}
          pageSizeOptions={['5']}
          />
          </div>
          <p className={styles.siteline}>已选择列表：</p>
          <div className={styles.siteSelectList}>
          <ul className={styles.siteSelectUl}>
          {selectList.map((item, index) => (
          <li
          key={`${item.userName}${item.GroupId}${index}`}
          onClick={() => handleDel(index)}
          >
          {`${item.userName}(${item.GroupName})`}
          </li>
          </Col>
          <Col span={3} />
          </Row>
          </Card>
          <div style={{ background: '#fff' }}>
          <Card
          className={classnames({
          [styles.boxH]: treeVisible,
          [styles.cardBoxR]: true,
          })}
          >
          <div
          style={{
          display: 'flex',
          flexDirection: 'column ',
          height: 'calc(100vh - 240px)',
          }}
          >
          {/* <Checkbox className={styles.siteAll}>全选/反选</Checkbox> */}
          {dataList.length > 0 && !visibleParams.loading ? (
          <>
          <p className={styles.siteline}>已选择列表：</p>
          <div
          className={styles.siteSelectList}
          style={{
          height: selectedState ? '1200px' : '220px',
          transition: 'height 0.5s',
          }}
          >
          <ul className={styles.siteSelectUl}>
          {selectList.map((item, index) => (
          <li
          key={`${item.userName}${item.GroupId}${index}`}
          onClick={() => handleDel(index)}
          >
          {`${item.userName}(${item.GroupName})`}
          </li>
          ))}
          </ul>
          </div>
          <div style={{ textAlign: 'center', margin: '10px 0' }}>
          <Tooltip title="收起">
          <CaretUpOutlined
          style={{
          fontSize: '20px',
          color: '#178BF6',
          display: selectedState ? 'block' : 'none',
          }}
          onClick={() => setSelectedState(false)}
          />
          </Tooltip>
          <Tooltip title="展开">
          <CaretDownOutlined
          style={{
          fontSize: '20px',
          color: '#178BF6',
          display: selectedState ? 'none' : 'block',
          }}
          onClick={() => setSelectedState(true)}
          />
          </Tooltip>
          </div>
          </>
          ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
          )}
          <div
          style={{
          overflowY: 'scroll',
          flexGrow: '1',
          }}
          >
          <Spin spinning={visibleParams.loading}>
          {dataList.map((item, index) => (
          <Panels
          {...item}
          index={index}
          key={item.GroupId}
          handleChangeCollpase={handleChangeCollpase}
          handleChangeAll={handleChangeAll}
          handleChangeSignel={handleChangeSignel}
          />
          ))}
          </ul>
          </Spin>
          </div>
          </>
          </div>
          </Card>
          {dataList.length > 0 && !visibleParams.loading ? (
          <div style={{ textAlign: 'right' }}>
          <Pagination
          size="small"
          total={total}
          current={page.pageNum}
          defaultPageSize="10"
          onChange={handleChangePage}
          pageSizeOptions={['10']}
          />
          </div>
          ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
          ''
          )}
          </Card>
          <div className={styles.siteBtn}>
          <Button
          type="primary"
          className={styles.siteCommit}
          onClick={handleCommitBtn}
          >
          提交
          </Button>
          <div className={styles.siteBtn}>
          <Button type="primary" className={styles.siteCommit} onClick={handleCommitBtn}>
          提交
          </Button>
          </div>
          </div>
          </div>
          </div>
          ......@@ -576,45 +841,6 @@ const SiteManage = props => {
          );
          };
          const Panels = React.memo(props => {
          let { index, GroupId, GroupName, Users, isChecked, isShow, color } = props;
          return (
          <div className={styles.sitePanel} key={GroupId} id={`siteId${GroupId}`}>
          {/* onClick={() => props.handleChangeCollpase(GroupId, isShow)} */}
          <div className={styles.sitePanelHead}>
          {/* {isShow ? (
          <UpOutlined className={styles.siteIcon} />
          ) : (
          <DownOutlined className={styles.siteIcon} />
          )} */}
          {/* <UpOutlined className={styles.siteIcon} /> */}
          <UserOutlined className={styles.siteIcon} />
          <p style={{ color }}>{GroupName}</p>
          </div>
          <div className={styles.sitePanelCon}>
          <Checkbox
          key="0"
          className={styles.siteList}
          checked={isChecked}
          onClick={e => props.handleChangeAll(e, index)}
          >
          全选
          </Checkbox>
          {Users.length > 0 &&
          Users.map((v, vIndex) => (
          <CheckBoxRow
          {...v}
          index={index}
          vIndex={vIndex}
          key={v.userID}
          handleChangeSignel={props.handleChangeSignel}
          />
          ))}
          </div>
          </div>
          );
          });
          const CheckBoxRow = React.memo(props => {
          let { vIndex, index, isChecked, userName } = props;
          return (
          ......@@ -627,5 +853,4 @@ const CheckBoxRow = React.memo(props => {
          </Checkbox>
          );
          });
          export default React.memo(appConnector(SiteManage));
          export default SiteManageV2;
          src/pages/userCenter/siteManage/SiteManage.less
          View file @ 5c5f61a0
          .cardBox{
          min-height: calc(100vh - 75px);
          max-height: calc(100vh - 75px);
          overflow-y: scroll;
          overflow-x: hidden;
          width: 300px;
          left: 0;
          top: 0;
          margin-right: 10px;
          position: relative;
          // transition: left,width 10s;
          transition-property:width,left;
          transition-duration: 0.5s;
          white-space: nowrap
          :global {
          ::-webkit-scrollbar {
          height: 6px; //x轴滚动条粗细
          width: 6px; //y轴滚动条粗细
          border-bottom: 2px solid white;
          }
          //滚动条里面的小方块，能上下左右移动（取决于是垂直滚动条还是水平滚动条）
          ::-webkit-scrollbar-thumb {
          border-radius: 10px;
          box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
          background: rgba(74, 74, 75, 0.3);
          margin-bottom: 10px;
          }
          //滚动条的轨道（里面装有thumb）滚动槽
          ::-webkit-scrollbar-track {
          box-shadow: 0;
          border-radius: 0;
          background: white; //滚动槽背景色
          border-radius: 10px; //滚动条边框半径设置
          }
          .ant-tree-node-content-wrapper {
          width: 100%;
          overflow: hidden !important;
          .ant-tree-title {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          display: block;
          }
          }
          .ant-pagination-prev,
          .ant-pagination-next {
          line-height: 8px !important;
          }
          .ant-input-search-button {
          line-height: 1;
          }
          .ant-dropdown-menu-item > .anticon:first-child {
          vertical-align: 0.15em !important;
          }
          .ant-table-tbody {
          .ant-table-row:hover > td {
          background: #aed8fa !important;
          }
          }
          .ant-modal-close-icon {
          vertical-align: 0.3em;
          }
          .ant-notification-close-icon {
          vertical-align: 0.2em;
          }
          .ant-tree-switcher-icon svg {
          font-size: 14px;
          }
          }
          .hideBox{
          left: 0px;
          top: 0;
          width: 20px;
          .redText {
          color: red;
          cursor: pointer;
          }
          .hideH{
          width: 100%;
          .ant-layout {
          overflow: auto;
          .ant-layout-content {
          margin: 12px !important;
          }
          }
          .siteTitle{
          .siteTitle {
          font-size: 16px;
          margin: 0 0 6px 0;
          user-select: none;
          padding: 3px;
          border-bottom: 1px solid #ccc;
          }
          .cardBoxR{
          min-height: calc(100vh - 210px);
          max-height: calc(100vh - 210px);
          min-width: 600px;
          overflow-y: scroll;
          }
          .cardBoxTop{
          // max-width: calc( 100% - 450px);
          // margin-bottom: 10px;
          }
          .ant-tree-node-content-wrapper-open{
          display: flex;
          align-items: center;
          }
          .treeTitle {
          display: flex;
          span {
          display: none;
          .siteManageContainer {
          .ant-card-body {
          padding: 15px;
          }
          }
          .treeTitle:hover {
          span {
          margin-left: 20px;
          display: block;
          .ant-spin-container {
          // overflow-y: scroll;
          // height: calc(100vh - 410px);
          }
          }
          .titleBox{
          display: flex;
          // flex-wrap: wrap;
          justify-content: space-around;
          align-items: center;
          }
          .listItem{
          height: 35px !important;
          padding-left: 5px;
          cursor: pointer;
          font-size: 14px;
          }
          .listItem:hover{
          background-color: #f8f8f8 ;
          }
          .selected{
          font-weight: bold;
          background-color: #bae7ff!important;
          }
          .ant-tree-treenode {
          width: 100% !important;
          .hide{
          display: block;
          position: absolute;
          font-size: 18px;
          color: #1890FF!important;
          top: 45%;
          right: -3px;
          transform: translate(0%,-50%);
          z-index: 2;
          }
          // .hide{
          // left: 0;
          // }
          .content{
          width: 100%;
          display: flex;
          position: relative;
          .ant-tree-node-content-wrapper {
          display: inline-block;
          width: 100%;
          }
          .iconWraper1 {
          float: right;
          span {
          display: none;
          }
          }
          }
          .ant-tree-treenode:hover {
          .iconWraper1 > span {
          margin-left: 12px;
          font-size: 18px;
          display: inline-block;
          }
          }
          .contentContainer {
          display: flex;
          width: 100%;
          position: relative;
          .orgContainer {
          height: calc(100vh - 74px);
          width: 407px;
          padding-right: 10px;
          left: 0;
          top: 0;
          overflow: hidden;
          margin-right: 10px;
          position: relative;
          transition-property: width, left;
          transition-duration: 0.5s;
          white-space: nowrap;
          .ant-tree {
          padding-top: 6px;
          .ant-tree-switcher {
          line-height: 1;
          margin-right: 0px !important;
          color: #1890ff;
          .ant-tree-switcher-line-icon {
          margin-left: 5px;
          }
          }
          }
          .switcher {
          display: block;
          position: absolute;
          font-size: 18px;
          color: #1890ff !important;
          top: 45%;
          right: 2px;
          transform: translate(0%, -50%);
          z-index: 1;
          }
          }
          .orgContainerHide {
          // transform: translateX(-230px);
          left: 0px;
          top: 0;
          width: 26px;
          }
          .userContainer {
          height: calc(100vh - 74px) !important;
          z-index: 999;
          // min-width: 800px;
          background: white;
          width: 100%;
          position: relative;
          transition: width 0.5s;
          .title {
          margin: 16px 0 10px 16px;
          display: inline-block;
          width: 270px;
          cursor: pointer;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          }
          .ant-table-pagination {
          padding-right: 12px;
          background: white;
          margin: 1px 0;
          padding: 8px;
          padding-right: 20px;
          }
          .ant-btn {
          margin: 0px 10px;
          .ant-btn-primary {
          background: #50aefc;
          }
          }
          .ant-input-search-button {
          margin-left: 0px !important;
          }
          .ant-table-thead tr th {
          font-weight: 600;
          color: rgba(0, 0, 0, 0.85);
          }
          .ant-table-cell {
          text-align: center;
          overflow: hidden;
          // text-overflow:ellipsis;
          white-space: nowrap;
          }
          .ant-table-body {
          height: calc(100vh - 210px);
          border-right: white;
          overflow: auto !important;
          }
          .clickRowStyle {
          background: #cfe7fd;
          }
          .ant-pagination {
          z-index: 999;
          border-top: 1px solid #f0eded;
          }
          }
          }
          }
          .boxR{
          //机构编辑面板
          .boxR {
          width: 100%;
          position: relative;
          transition: width 2s;
          }
          .siteCheckbox .ant-collapse-content > .ant-collapse-content-box{
          .cardBoxR {
          min-height: calc(100vh - 210px);
          max-height: calc(100vh - 210px);
          min-width: 600px;
          }
          .siteCheckbox .ant-collapse-content > .ant-collapse-content-box {
          padding: 16px 16px 0;
          }
          .siteList{
          width:199px;
          .siteList {
          width: 199px;
          // margin:0 0 15px 0;
          padding:0 0 15px 0;
          padding: 0 0 15px 0;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .sitePanel{
          .siteListTitle {
          width: 199px;
          // margin:0 0 15px 0;
          padding: 0 0 0 15px;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .sitePanel {
          margin: 0 0 10px 0;
          }
          .sitePanelHead{
          .sitePanelHead {
          background-color: #f5f5f5;
          padding:8px 10px;
          padding: 8px 10px;
          cursor: pointer;
          display: flex;
          align-items: center;
          flex-direction: row;
          }
          .sitePanelHead p{
          .sitePanelHead p {
          margin: 0;
          margin-right: 0.6rem;
          }
          .sitePanelCon{
          border:1px solid #f5f5f5;
          padding:20px;
          .sitePanelCon {
          border: 1px solid #f5f5f5;
          padding: 20px;
          padding-bottom: 0;
          border-top:0;
          border-top: 0;
          max-height: 200px;
          overflow: auto;
          }
          .sitePanel .ant-checkbox-wrapper + .ant-checkbox-wrapper{
          margin:0
          .sitePanel .ant-checkbox-wrapper + .ant-checkbox-wrapper {
          margin: 0;
          }
          .siteIcon{
          color:#ccc;
          margin:4px 10px 0 0;
          .siteIcon {
          color: #ccc;
          margin: 4px 10px 0 0;
          }
          .siteAll{
          margin:0 0 10px 0;
          .siteAll {
          margin: 0 0 10px 0;
          }
          .siteColor{
          color:#f00
          .siteColor {
          color: #f00;
          }
          .siteCommit{
          margin: 10px 0;
          .siteCommit {
          margin: 10px 0;
          }
          .siteSelectList{
          border:1px solid #f5f5f5;
          height: 200px;
          .siteSelectList {
          border: 1px solid #f5f5f5;
          overflow: auto;
          margin-bottom: 50px;
          .siteSelectUl{
          .siteSelectUl {
          margin: 0;
          padding: 15px;
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          li{
          width:200px;
          li {
          height: 35px;
          line-height: 35px;
          background: rgba(24, 144, 255,0.16) url('../../../assets/images/icons/close.png') no-repeat 175px;
          background: rgba(24, 144, 255, 0.16)
          url('../../../assets/images/icons/close.png') no-repeat 170px;
          background-size: 20px;
          background-position: center right;
          margin: 0 10px 10px 0;
          cursor: pointer;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          padding: 0 20px 0 10px;
          padding: 0 40px 0 10px;
          }
          }
          }
          .siteline{
          border-top: 1px solid #eee;
          padding-top: 15px;
          margin-top: 20px;
          .siteline {
          }
          .siteBtn{
          width:98%;
          .siteBtn {
          width: 98%;
          display: flex;
          flex-direction: row;
          align-items: center;
          justify-content: flex-end;
          }
          \ No newline at end of file
          justify-content: center;
          }
          .ant-modal-root {
          .ant-tree-switcher {
          line-height: 1;
          color: #1890ff;
          margin-right: 0px !important;
          }
          .ant-checkbox-group .ant-checkbox-group-item {
          margin-right: 0px !important;
          min-width: 300px !important;
          }
          .ant-tree-list-holder {
          overflow: auto;
          overflow-x: hidden;
          height: 40vh;
          }
          .ant-tabs-content-holder {
          overflow: auto;
          height: 50vh;
          }
          }
          .title {
          display: flex;
          align-items: center;
          width: 100%;
          }
          .tip {
          display: none;
          }
          .title:hover {
          .tip {
          display: flex;
          align-items: center;
          justify-content: flex-end;
          width: 100%;
          }
          }
          .titleText {
          width: 12rem;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .fs {
          font-size: 18px;
          margin-left: 10px;
          }
          .titleTop {
          width: 12rem;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          src/pages/userCenter/siteManageV2/siteManage.jsx deleted 100644 → 0
          View file @ 8baa4ed2
          import React, { useEffect, useState } from 'react';
          import {
          // Tree,
          Table,
          Space,
          message,
          Modal,
          Input,
          notification,
          Tooltip,
          Card,
          Button,
          Spin,
          Dropdown,
          Menu,
          Row,
          Col,
          Empty,
          Pagination,
          Checkbox,
          } from 'antd';
          import classnames from 'classnames';
          import {
          UserOutlined,
          PlusSquareOutlined,
          UsergroupAddOutlined,
          EditOutlined,
          FormOutlined,
          DeleteOutlined,
          DoubleLeftOutlined,
          DoubleRightOutlined,
          DownOutlined,
          PlusOutlined,
          ApartmentOutlined,
          CaretUpOutlined,
          CaretDownOutlined,
          } from '@ant-design/icons';
          import PageContainer from '@/components/BasePageContainer';
          import Tree from '@/components/ExpendableTree';
          import voca from 'voca';
          import zhCN from 'antd/es/locale/zh_CN';
          import qs from 'qs';
          import lodash, { clone } from 'lodash';
          import styles from './siteManage.less';
          import {
          getWebModuleTree,
          chooseUserToStation,
          getAllGroup,
          getUserByStation,
          getStationUserList,
          groupUserPagingList,
          addChildSiteNode,
          getSiteTree,
          getStationUsers,
          DragGroup,
          } from '@/services/userCenter/siteManage/api';
          import AddModal from '../siteManage/AddModal';
          import DelModal from '../siteManage/DelModal';
          import EditModal from '../siteManage/EditModal';
          import AddChildModal from '../siteManage/AddChildModal';
          const { Search } = Input;
          const placeholder = '请输入机构名称';
          const SiteManageV2 = () => {
          const [showSearchStyle, setShowSearchStyle] = useState(false); // 是否显示模糊查询样式
          const [treeVisible, setTreeVisible] = useState(true); // 树是否可见
          const [treeData, setTreeData] = useState([]); // 用户站点树
          const [treeDataCopy, setTreeDataCopy] = useState([]); // 机构树数据备份，用于更改机构
          const [treeState, setTreeState] = useState(true); // 树第一次加载
          const [treeLoading, setTreeLoading] = useState(false);
          const [currentStation, setCurrentStation] = useState(''); // 当前选中站点
          const [currentStationMsg, setCurrentStationMsg] = useState({}); // 当前编辑节点信息
          const [currentStationOperate, setCurrentStationOperate] = useState(false);
          const [flag, setFlag] = useState(1); // 操作标致触发界面刷新
          const [dataList, setdataList] = useState([]); // 当前站点对应的分页用户列表
          const [selectedState, setSelectedState] = useState(false); // 已选列表展开状态true为展开false为收起
          const [visibleParams, setvisibleParams] = useState({
          modalVisible: false, // 新增弹窗
          delVisible: false, // 删除弹窗
          editVisible: false, // 修改弹窗
          spinLoading: false, // 加载弹窗
          btnLoading: false,
          loading: false,
          checkBoxLoading: false,
          });
          const [total, setTotal] = useState(0); // 分页总数
          const [page, setPage] = useState({ pageNum: 1, pageSize: 10 });
          const [selectList, setSelectList] = useState([]); // 选择列表数据
          const [updatePageUser, setUpdatePageUser] = useState(1); //
          const [updateCheck, setUpdateCheck] = useState(1);
          const [name, setName] = useState('');
          const [des, setDes] = useState('');
          const [data, setData] = useState('');
          const [ch, setCh] = useState('');
          let a = [];
          // 渲染机构树
          const mapTree = org => {
          const haveChildren = Array.isArray(org.children) && org.children.length > 0;
          return {
          title: (
          <div className={styles.title}>
          <div className={styles.titleText}>{org.text}</div>
          <div className={styles.tip}>
          <Tooltip title="添加下级站点" className={styles.fs}>
          <PlusSquareOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => addSite(e, org)}
          />
          </Tooltip>
          <Tooltip title="编辑当前站点" className={styles.fs}>
          <FormOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => editorSite(e, org)}
          />
          </Tooltip>
          <Tooltip title="删除当前站点" className={styles.fs}>
          <DeleteOutlined
          style={{ fontSize: '16px', color: '#1890FF' }}
          onClick={e => delSite(e, org)}
          />
          </Tooltip>
          </div>
          </div>
          ),
          key: org.id,
          // icon: <UserOutlined style={{ display: 'inline' }} />,
          // 判断它是否存在子集，若果存在就进行再次进行遍历操作，知道不存在子集便对其他的元素进行操作
          children: haveChildren ? org.children.map(i => mapTree(i)) : [],
          };
          };
          // 添加下级站点
          const addSite = (e, recode) => {
          e.stopPropagation();
          setCurrentStation(recode.id);
          handleShowModal('addChildVisible', true);
          };
          // 删除当前站点
          const delSite = (e, recode) => {
          e.stopPropagation();
          setCurrentStation(recode.id);
          handleShowModal('delVisible', true);
          };
          // 编辑当前站点
          const editorSite = (e, recode) => {
          e.stopPropagation();
          // console.log(recode);
          // 保存编辑回显信息
          setCurrentStationMsg(recode);
          // setCurrentStation(recode.id);
          handleShowModal('editVisible', true);
          };
          // 重新渲染树
          const updateTrees = () => {
          setTreeLoading(true);
          getSiteTree({ selectNode: -1 }).then(res => {
          if (res.data.length > 0) {
          setTreeLoading(false);
          setTreeData(res.data);
          setTreeDataCopy(res.data);
          // 第一次加载，默认选择第一个组织
          if (treeState) {
          onSelect([res.data[0].id], false); // 待会儿要改
          setTreeState(false);
          }
          } else {
          setTreeLoading(false);
          notification.error({
          message: '提示',
          duration: 15,
          description: res.msg,
          });
          }
          });
          };
          // 获取用户机构树
          // useEffect(() => {
          // updateTrees();
          // }, [flag]);
          useEffect(() => {
          getValue();
          updateTrees();
          }, []);
          // 切换站点，点击分页按钮，提交
          useEffect(() => {
          if (!currentStation) return;
          getList();
          setShowSearchStyle(false);
          }, [updatePageUser]);
          // 切换站点，提交时触发已勾选列表更新
          useEffect(() => {
          if (!currentStation) return;
          // getAllcheckList();
          getAllCheckListNew();
          }, [currentStation, updateCheck]);
          // 获取当前站点可编辑用户(已勾选和未勾选)分页展示
          const getList = () => {
          let params = {
          id: +currentStation || '',
          PageIndex: +page.pageNum,
          PageSize: +page.pageSize,
          };
          if (name) params = { ...params, name };
          groupUserPagingList(params).then(res => {
          if (res.code === 0 && res.data) {
          setShowSearchStyle(true);
          let { list } = res.data;
          // 还原选择的数据
          if (selectList.length > 0) {
          selectList.forEach(item => {
          list.forEach((value, index) => {
          if (item.GroupId === value.GroupId) {
          list[index].Users.forEach((user, userIndex) => {
          if (user.userID === item.userID) {
          list[index].Users[userIndex].isChecked = true;
          }
          });
          let checkedLen = list[index].Users.filter(v => v.isChecked)
          .length;
          if (checkedLen === list[index].Users.length) {
          list[index].isChecked = true;
          }
          }
          });
          });
          }
          handleShowModal('loading', false);
          setdataList(lodash.cloneDeep(list));
          setTotal(res.data.TotalCount);
          } else {
          handleShowModal('loading', false);
          setdataList(lodash.cloneDeep([]));
          }
          });
          };
          // 获取当前站点所有已经勾选的用户
          const getAllcheckList = async () => {
          let res = await getUserByStation({
          stationID: currentStation,
          _version: 9999,
          _dc: new Date().getTime(),
          });
          if (res.length > 0) {
          // 还原从后台返回的数据 选中的列表
          let list = [];
          // console.log(res);
          res.forEach(item => {
          if (item.userList.length > 0) {
          item.userList.forEach(value => {
          // console.log(value);
          if (
          value.isChecked &&
          list.findIndex(
          v => +v.GroupId === +item.OUID && +v.userID === +value.userID,
          ) === -1
          ) {
          list.push({
          GroupId: +item.OUID,
          GroupName: item.OUName,
          userName: value.userName,
          userID: value.userID,
          });
          }
          });
          }
          });
          setSelectList(lodash.cloneDeep(list));
          setUpdatePageUser(updatePageUser + 1);
          }
          };
          // 获取当前站点所有已经勾选的用户新接口
          const getAllCheckListNew = () => {
          getStationUsers({
          stationId: currentStation,
          }).then(res => {
          let list = [];
          if (res.data.length > 0) {
          res.data.map((item, index) => {
          list.push({
          GroupId: +item.OUID,
          GroupName: item.OUName,
          userName: item.userName,
          userID: item.userID,
          });
          });
          }
          setSelectList(lodash.cloneDeep(list));
          setUpdatePageUser(updatePageUser + 1);
          });
          };
          // 选中某个站点
          const onSelect = (props, e) => {
          console.log('props[0]', props[0]);
          setCh(props[0]);
          if (!props[0]) {
          setCurrentStation(currentStation);
          } else {
          setCurrentStation(props[0]);
          }
          setPage({ pageNum: 1, pageSize: 10 });
          console.log(data);
          data.map((item, index) => {
          if (item.id == props[0]) {
          console.log(item.id);
          console.log(item.describe);
          setDes(item.describe);
          }
          });
          };
          const getValue = () => {
          getSiteTree({ selectNode: -1 }).then(res => {
          console.log(res.data);
          getData1(res.data);
          });
          };
          const getData1 = e => {
          console.log(e);
          e.map((i, j) => {
          a.push(i);
          if (i.children.length > 0) {
          getData1(i.children);
          }
          });
          console.log(a);
          setData(a);
          };
          // 弹出模态框
          const handleShowModal = (key, value) => {
          setvisibleParams({ ...visibleParams, [key]: value });
          };
          // 获取搜索框的值
          const handleSearch = value => {
          setName(value);
          getList(value);
          };
          const confirmModal = e => {
          handleShowModal('modalVisible', false);
          updateTrees();
          // setFlag(flag + 1);
          };
          const delModal = () => {
          handleShowModal('delVisible', false);
          updateTrees();
          // setFlag(flag + 1);
          };
          const editModal = () => {
          handleShowModal('editVisible', false);
          updateTrees();
          // setFlag(flag + 1);
          };
          const addChildModal = () => {
          handleShowModal('addChildVisible', false);
          updateTrees();
          // setFlag(flag + 1);
          };
          const handleChangeCollpase = (groupId, isShow) => {
          let index = dataList.findIndex(item => item.GroupId === groupId);
          if (dataList[index].children && dataList[index].children.length > 0) {
          setdataList(lodash.cloneDeep(dataList));
          return;
          }
          handleShowModal('loading', true);
          getStationUserList({ stationID: currentStation, 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].Users.forEach(item => {
          item.isChecked = e.target.checked;
          let delIndex = selectList.findIndex(
          v => v.GroupId === dataList[index].GroupId && v.userID === item.userID,
          );
          if (e.target.checked) {
          if (delIndex === -1) {
          selectList.push({
          GroupId: dataList[index].GroupId,
          GroupName: dataList[index].GroupName,
          userName: item.userName,
          userID: item.userID,
          });
          }
          }
          if (!e.target.checked) {
          selectList.splice(delIndex, 1);
          }
          });
          setSelectList(lodash.cloneDeep(selectList));
          setdataList(lodash.cloneDeep(dataList));
          };
          // 单个选择checkbox
          const handleChangeSignel = (e, index, vIndex) => {
          dataList[index].Users[vIndex].isChecked = e.target.checked;
          let checked = isAllChecked(index);
          let hasIndex = selectList.findIndex(
          item =>
          item.userID === dataList[index].Users[vIndex].userID &&
          item.GroupId === dataList[index].GroupId,
          );
          dataList[index].isChecked = checked;
          if (e.target.checked && hasIndex === -1) {
          selectList.push({
          GroupId: dataList[index].GroupId,
          GroupName: dataList[index].GroupName,
          userName: dataList[index].Users[vIndex].userName,
          userID: dataList[index].Users[vIndex].userID,
          });
          } else {
          selectList.splice(hasIndex, 1);
          }
          setdataList(lodash.cloneDeep(dataList));
          };
          const isAllChecked = index =>
          dataList[index].Users.filter(item => item.isChecked).length ===
          dataList[index].Users.length;
          // 删除已选列表
          const handleDel = index => {
          let { GroupId, userID } = selectList[index];
          let outerIndex = dataList.findIndex(item => item.GroupId === GroupId);
          if (outerIndex > -1) {
          let innerIndex = dataList[outerIndex].Users.findIndex(
          item => item.userID === userID,
          );
          dataList[outerIndex].Users[innerIndex].isChecked = false;
          dataList[outerIndex].isChecked = isAllChecked(outerIndex);
          }
          selectList.splice(index, 1);
          setSelectList(lodash.cloneDeep(selectList));
          setdataList(lodash.cloneDeep(dataList));
          };
          // 提交
          const handleCommitBtn = () => {
          handleShowModal('btnLoading', true);
          let result = [];
          let obj = {};
          selectList.forEach(item => {
          if (obj[item.GroupId]) {
          obj[item.GroupId].push(item.userID);
          } else {
          obj[item.GroupId] = [item.userID];
          }
          });
          // dataList.forEach(item => {
          // if (obj[item.GroupId] && item.Users.length === obj[item.GroupId].length) {
          // obj[item.GroupId].push(item.GroupId);
          // }
          // });
          result = Object.values(obj);
          // 数据处理成后台需要的格式
          if (result.length === 0)
          return notification.warning({
          message: '提示',
          description: '请至少选择选择一个用户！',
          });
          chooseUserToStation({
          userList: String(result.flat()),
          stationID: currentStation,
          })
          .then(res => {
          handleShowModal('btnLoading', false);
          if (res.code === 0) {
          setSelectList([]);
          setUpdateCheck(updateCheck + 1);
          notification.success({
          message: '提示',
          duration: 3,
          description: '设置成功',
          });
          } else {
          notification.error({
          message: '提示',
          duration: 15,
          description: res.msg,
          });
          }
          })
          .catch(err => {
          handleShowModal('btnLoading', false);
          console.log(err);
          });
          };
          // 分页
          const handleChangePage = (pageNum, pageSize) => {
          setPage({ pageNum, pageSize });
          setUpdatePageUser(updatePageUser + 1);
          };
          /** ***操作按钮**** */
          // 机构操作
          const addTopStation = () => {
          handleShowModal('modalVisible', true);
          };
          // 模糊查询匹配的样式
          const searchStyle = val => {
          console.log(showSearchStyle);
          console.log(name);
          let n;
          if (showSearchStyle) {
          n = val.replace(
          new RegExp(name, 'g'),
          `<span style='color:red'>${name}</span>`,
          );
          } else {
          n = val;
          }
          console.log(n);
          return <div dangerouslySetInnerHTML={{ __html: n }} />;
          };
          // 返回拖拽完毕后的信息
          const loop = (datas, key, parentID, callback) => {
          for (let i = 0; i < datas.length; i++) {
          if (datas[i].id === key) {
          return callback(datas[i], i, datas, parentID);
          }
          if (datas[i].children) {
          loop(datas[i].children, key, datas[i].id, callback);
          }
          }
          };
          // 树的拖拽
          const handleDrop = infos => {
          console.log(infos);
          const dropKey = infos.node.key;
          const dragKey = infos.dragNode.key;
          const dropPos = infos.node.pos.split('-');
          const dropPosition =
          infos.dropPosition - Number(dropPos[dropPos.length - 1]);
          const datas = JSON.parse(JSON.stringify(treeData));
          console.log(dropKey, 'dropKey');
          console.log(dragKey, 'dragKey');
          // 找到拖拽的元素
          let dragObj;
          let dropObj;
          let parId;
          let dragList;
          // 保存拖拽到的节点信息
          loop(datas, dropKey, -1, item => {
          dropObj = item;
          });
          // 保存节点信息并删除节点
          loop(datas, dragKey, -1, (item, index, arr) => {
          arr.splice(index, 1);
          dragObj = item;
          });
          // 将节点插入到正确的位置
          if (!infos.dropToGap) {
          console.log('33333333333');
          dropObj.children = dropObj.children || [];
          // 在哪里插入,示例添加到头部，可以是随意位置
          dropObj.children.unshift(dragObj);
          parId = dropObj.id;
          dragList = dropObj.children.map(val => val.id);
          } else {
          let ar;
          let i;
          loop(datas, dropKey, -1, (item, index, arr, parentID) => {
          ar = arr;
          i = index;
          parId = parentID;
          });
          if (dropPosition === -1) {
          ar.splice(i, 0, dragObj);
          } else {
          ar.splice(i + 1, 0, dragObj);
          }
          dragList = ar.map(ele => ele.id);
          }
          DragGroup({
          dragGroupType: 3,
          groupId: dragKey.toString(),
          groupList: dragList.map(item => item.toString()),
          parentId: parId.toString(),
          }).then(res => {
          if (res.code === 0) {
          updateTrees();
          } else {
          message.error(res.msg);
          }
          });
          };
          const Panels = React.memo(props => {
          let { index, GroupId, GroupName, Users, isChecked, isShow, color } = props;
          return (
          <div className={styles.sitePanel} key={GroupId} id={`siteId${GroupId}`}>
          {/* onClick={() => props.handleChangeCollpase(GroupId, isShow)} */}
          <div className={styles.sitePanelHead}>
          {/* {isShow ? (
          <UpOutlined className={styles.siteIcon} />
          ) : (
          <DownOutlined className={styles.siteIcon} />
          )} */}
          {/* <UpOutlined className={styles.siteIcon} /> */}
          <ApartmentOutlined className={styles.siteIcon} />
          {searchStyle(GroupName)}
          <Checkbox
          key="0"
          className={styles.siteListTitle}
          checked={isChecked}
          onClick={e => props.handleChangeAll(e, index)}
          >
          全选
          </Checkbox>
          </div>
          <div className={styles.sitePanelCon}>
          {Users.length > 0 &&
          Users.map((v, vIndex) => (
          <CheckBoxRow
          {...v}
          index={index}
          vIndex={vIndex}
          key={v.userID}
          handleChangeSignel={props.handleChangeSignel}
          />
          ))}
          </div>
          </div>
          );
          });
          return (
          <PageContainer className={styles.siteManageContainer}>
          <div className={styles.contentContainer}>
          <Card
          className={classnames({
          [styles.orgContainer]: true,
          [styles.orgContainerHide]: !treeVisible,
          })}
          >
          <span style={{ margin: '0 180px 0 10px' }}>站点列表</span>
          <Tooltip title="添加顶级站点">
          <PlusOutlined
          onClick={() => addTopStation()}
          style={{
          color: '#1890FF',
          fontSize: '18px',
          verticalAlign: '0.04em',
          }}
          />
          </Tooltip>
          {treeData.length > 0 && (
          <div style={{ height: 'calc(100vh - 120px)', overflowY: 'scroll' }}>
          <Tree
          showIcon="true"
          showLine={{ showLeafIcon: false }}
          blockNode
          autoExpandParent
          selectedKeys={[currentStation]}
          onSelect={onSelect}
          treeData={treeData.map(t => mapTree(t))}
          draggable
          onDrop={handleDrop}
          />
          </div>
          )}
          <div className={styles.switcher}>
          {treeVisible && (
          <Tooltip title="隐藏站点列表">
          <DoubleLeftOutlined onClick={() => setTreeVisible(false)} />
          </Tooltip>
          )}
          {!treeVisible && (
          <Tooltip title="显示站点列表">
          <DoubleRightOutlined onClick={() => setTreeVisible(true)} />
          </Tooltip>
          )}
          </div>
          </Card>
          {/* 右侧用户表 */}
          <div
          className={classnames({
          [styles.userContainer]: true,
          [styles.userContainerHide]: !treeVisible,
          })}
          >
          <AddModal
          visible={visibleParams.modalVisible}
          onCancel={() => handleShowModal('modalVisible', false)}
          confirmModal={confirmModal}
          />
          <AddChildModal
          visible={visibleParams.addChildVisible}
          pid={currentStation}
          onCancel={() => handleShowModal('addChildVisible', false)}
          confirmModal={addChildModal}
          />
          <DelModal
          visible={visibleParams.delVisible}
          stationId={currentStation}
          onCancel={() => handleShowModal('delVisible', false)}
          confirmModal={delModal}
          />
          <EditModal
          visible={visibleParams.editVisible}
          stationObj={currentStationMsg}
          des={des}
          onCancel={() => handleShowModal('editVisible', false)}
          confirmModal={editModal}
          />
          <div
          className={classnames({
          [styles.boxR]: true,
          [styles.boxH]: treeVisible,
          })}
          >
          <Card
          className={classnames({
          [styles.cardBoxTop]: true,
          [styles.boxH]: treeVisible,
          })}
          >
          <Row align="middle">
          <Col span={1}>搜索</Col>
          <Col span={8}>
          <Search
          allowClear
          placeholder={placeholder}
          onSearch={handleSearch}
          // onChange={handleChange}
          enterButton
          />
          </Col>
          <Col span={3} />
          </Row>
          </Card>
          <div style={{ background: '#fff' }}>
          <Card
          className={classnames({
          [styles.boxH]: treeVisible,
          [styles.cardBoxR]: true,
          })}
          >
          <div
          style={{
          display: 'flex',
          flexDirection: 'column ',
          height: 'calc(100vh - 240px)',
          }}
          >
          {/* <Checkbox className={styles.siteAll}>全选/反选</Checkbox> */}
          {dataList.length > 0 && !visibleParams.loading ? (
          <>
          <p className={styles.siteline}>已选择列表：</p>
          <div
          className={styles.siteSelectList}
          style={{
          height: selectedState ? '1200px' : '220px',
          transition: 'height 0.5s',
          }}
          >
          <ul className={styles.siteSelectUl}>
          {selectList.map((item, index) => (
          <li
          key={`${item.userName}${item.GroupId}${index}`}
          onClick={() => handleDel(index)}
          >
          {`${item.userName}(${item.GroupName})`}
          </li>
          ))}
          </ul>
          </div>
          <div style={{ textAlign: 'center', margin: '10px 0' }}>
          <Tooltip title="收起">
          <CaretUpOutlined
          style={{
          fontSize: '20px',
          color: '#178BF6',
          display: selectedState ? 'block' : 'none',
          }}
          onClick={() => setSelectedState(false)}
          />
          </Tooltip>
          <Tooltip title="展开">
          <CaretDownOutlined
          style={{
          fontSize: '20px',
          color: '#178BF6',
          display: selectedState ? 'none' : 'block',
          }}
          onClick={() => setSelectedState(true)}
          />
          </Tooltip>
          </div>
          </>
          ) : (
          <Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
          )}
          <div
          style={{
          overflowY: 'scroll',
          flexGrow: '1',
          }}
          >
          <Spin spinning={visibleParams.loading}>
          {dataList.map((item, index) => (
          <Panels
          {...item}
          index={index}
          key={item.GroupId}
          handleChangeCollpase={handleChangeCollpase}
          handleChangeAll={handleChangeAll}
          handleChangeSignel={handleChangeSignel}
          />
          ))}
          </Spin>
          </div>
          </div>
          </Card>
          {dataList.length > 0 && !visibleParams.loading ? (
          <div style={{ textAlign: 'right' }}>
          <Pagination
          size="small"
          total={total}
          current={page.pageNum}
          defaultPageSize="10"
          onChange={handleChangePage}
          pageSizeOptions={['10']}
          />
          </div>
          ) : (
          ''
          )}
          <div className={styles.siteBtn}>
          <Button
          type="primary"
          className={styles.siteCommit}
          onClick={handleCommitBtn}
          >
          提交
          </Button>
          </div>
          </div>
          </div>
          </div>
          </div>
          </PageContainer>
          );
          };
          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 SiteManageV2;
          src/pages/userCenter/siteManageV2/siteManage.less deleted 100644 → 0
          View file @ 8baa4ed2
          :global {
          ::-webkit-scrollbar {
          height: 6px; //x轴滚动条粗细
          width: 6px; //y轴滚动条粗细
          border-bottom: 2px solid white;
          }
          //滚动条里面的小方块，能上下左右移动（取决于是垂直滚动条还是水平滚动条）
          ::-webkit-scrollbar-thumb {
          border-radius: 10px;
          box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.1);
          background: rgba(74, 74, 75, 0.3);
          margin-bottom: 10px;
          }
          //滚动条的轨道（里面装有thumb）滚动槽
          ::-webkit-scrollbar-track {
          box-shadow: 0;
          border-radius: 0;
          background: white; //滚动槽背景色
          border-radius: 10px; //滚动条边框半径设置
          }
          .ant-tree-node-content-wrapper {
          width: 100%;
          overflow: hidden !important;
          .ant-tree-title {
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          display: block;
          }
          }
          .ant-pagination-prev,
          .ant-pagination-next {
          line-height: 8px !important;
          }
          .ant-input-search-button {
          line-height: 1;
          }
          .ant-dropdown-menu-item > .anticon:first-child {
          vertical-align: 0.15em !important;
          }
          .ant-table-tbody {
          .ant-table-row:hover > td {
          background: #aed8fa !important;
          }
          }
          .ant-modal-close-icon {
          vertical-align: 0.3em;
          }
          .ant-notification-close-icon {
          vertical-align: 0.2em;
          }
          .ant-tree-switcher-icon svg {
          font-size: 14px;
          }
          }
          .redText {
          color: red;
          cursor: pointer;
          }
          .ant-layout {
          overflow: auto;
          .ant-layout-content {
          margin: 12px !important;
          }
          }
          .siteTitle {
          font-size: 16px;
          margin: 0 0 6px 0;
          user-select: none;
          padding: 3px;
          border-bottom: 1px solid #ccc;
          }
          .siteManageContainer {
          .ant-card-body {
          padding: 15px;
          }
          .ant-spin-container {
          // overflow-y: scroll;
          // height: calc(100vh - 410px);
          }
          .ant-tree-treenode {
          width: 100% !important;
          .ant-tree-node-content-wrapper {
          display: inline-block;
          width: 100%;
          }
          .iconWraper1 {
          float: right;
          span {
          display: none;
          }
          }
          }
          .ant-tree-treenode:hover {
          .iconWraper1 > span {
          margin-left: 12px;
          font-size: 18px;
          display: inline-block;
          }
          }
          .contentContainer {
          display: flex;
          width: 100%;
          position: relative;
          .orgContainer {
          height: calc(100vh - 74px);
          width: 407px;
          padding-right: 10px;
          left: 0;
          top: 0;
          overflow: hidden;
          margin-right: 10px;
          position: relative;
          transition-property: width, left;
          transition-duration: 0.5s;
          white-space: nowrap;
          .ant-tree {
          padding-top: 6px;
          .ant-tree-switcher {
          line-height: 1;
          margin-right: 0px !important;
          color: #1890ff;
          .ant-tree-switcher-line-icon {
          margin-left: 5px;
          }
          }
          }
          .switcher {
          display: block;
          position: absolute;
          font-size: 18px;
          color: #1890ff !important;
          top: 45%;
          right: 2px;
          transform: translate(0%, -50%);
          z-index: 1;
          }
          }
          .orgContainerHide {
          // transform: translateX(-230px);
          left: 0px;
          top: 0;
          width: 26px;
          }
          .userContainer {
          height: calc(100vh - 74px) !important;
          z-index: 999;
          // min-width: 800px;
          background: white;
          width: 100%;
          position: relative;
          transition: width 0.5s;
          .title {
          margin: 16px 0 10px 16px;
          display: inline-block;
          width: 270px;
          cursor: pointer;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          }
          .ant-table-pagination {
          padding-right: 12px;
          background: white;
          margin: 1px 0;
          padding: 8px;
          padding-right: 20px;
          }
          .ant-btn {
          margin: 0px 10px;
          .ant-btn-primary {
          background: #50aefc;
          }
          }
          .ant-input-search-button {
          margin-left: 0px !important;
          }
          .ant-table-thead tr th {
          font-weight: 600;
          color: rgba(0, 0, 0, 0.85);
          }
          .ant-table-cell {
          text-align: center;
          overflow: hidden;
          // text-overflow:ellipsis;
          white-space: nowrap;
          }
          .ant-table-body {
          height: calc(100vh - 210px);
          border-right: white;
          overflow: auto !important;
          }
          .clickRowStyle {
          background: #cfe7fd;
          }
          .ant-pagination {
          z-index: 999;
          border-top: 1px solid #f0eded;
          }
          }
          }
          }
          //机构编辑面板
          .boxR {
          width: 100%;
          position: relative;
          transition: width 2s;
          }
          .cardBoxR {
          min-height: calc(100vh - 210px);
          max-height: calc(100vh - 210px);
          min-width: 600px;
          }
          .siteCheckbox .ant-collapse-content > .ant-collapse-content-box {
          padding: 16px 16px 0;
          }
          .siteList {
          width: 199px;
          // margin:0 0 15px 0;
          padding: 0 0 15px 0;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .siteListTitle {
          width: 199px;
          // margin:0 0 15px 0;
          padding: 0 0 0 15px;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .sitePanel {
          margin: 0 0 10px 0;
          }
          .sitePanelHead {
          background-color: #f5f5f5;
          padding: 8px 10px;
          cursor: pointer;
          display: flex;
          align-items: center;
          flex-direction: row;
          }
          .sitePanelHead p {
          margin: 0;
          margin-right: 0.6rem;
          }
          .sitePanelCon {
          border: 1px solid #f5f5f5;
          padding: 20px;
          padding-bottom: 0;
          border-top: 0;
          max-height: 200px;
          overflow: auto;
          }
          .sitePanel .ant-checkbox-wrapper + .ant-checkbox-wrapper {
          margin: 0;
          }
          .siteIcon {
          color: #ccc;
          margin: 4px 10px 0 0;
          }
          .siteAll {
          margin: 0 0 10px 0;
          }
          .siteColor {
          color: #f00;
          }
          .siteCommit {
          margin: 10px 0;
          }
          .siteSelectList {
          border: 1px solid #f5f5f5;
          overflow: auto;
          .siteSelectUl {
          margin: 0;
          padding: 15px;
          display: flex;
          flex-direction: row;
          flex-wrap: wrap;
          li {
          height: 35px;
          line-height: 35px;
          background: rgba(24, 144, 255, 0.16)
          url('../../../assets/images/icons/close.png') no-repeat 170px;
          background-size: 20px;
          background-position: center right;
          margin: 0 10px 10px 0;
          cursor: pointer;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          padding: 0 40px 0 10px;
          }
          }
          }
          .siteline {
          }
          .siteBtn {
          width: 98%;
          display: flex;
          flex-direction: row;
          align-items: center;
          justify-content: center;
          }
          .ant-modal-root {
          .ant-tree-switcher {
          line-height: 1;
          color: #1890ff;
          margin-right: 0px !important;
          }
          .ant-checkbox-group .ant-checkbox-group-item {
          margin-right: 0px !important;
          min-width: 300px !important;
          }
          .ant-tree-list-holder {
          overflow: auto;
          overflow-x: hidden;
          height: 40vh;
          }
          .ant-tabs-content-holder {
          overflow: auto;
          height: 50vh;
          }
          }
          .title {
          display: flex;
          align-items: center;
          width: 100%;
          }
          .tip {
          display: none;
          }
          .title:hover {
          .tip {
          display: flex;
          align-items: center;
          justify-content: flex-end;
          width: 100%;
          }
          }
          .titleText {
          width: 12rem;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          .fs {
          font-size: 18px;
          margin-left: 10px;
          }
          .titleTop {
          width: 12rem;
          overflow: hidden;
          white-space: nowrap;
          text-overflow: ellipsis;
          }
          src/routes/config.js
          View file @ 5c5f61a0
          ......@@ -23,7 +23,7 @@ import CurrentSolution from '@/pages/currentSolution/CurrentSolution';
          import UserManage from '../pages/userCenter/userManage/UserManage';
          import RoleManage from '@/pages/userCenter/roleManage/RoleManage';
          import SiteManage from '../pages/userCenter/siteManage/SiteManage';
          import SiteManageV2 from '../pages/userCenter/siteManageV2/siteManage';
          import Dictionary from '../pages/dataCenter/dictionary';
          import Dictionary1 from '../pages/dataCenter/dictionary1';
          // import Search from '../pages/dataCenter/search';
          ......@@ -150,7 +150,7 @@ export default {
          {
          path: '/userCenter/SiteManage',
          name: '站点管理',
          component: SiteManageV2,
          component: SiteManage,
          },
          ],
          },
          ......@@ -173,7 +173,7 @@ export default {
          routes: [
          {
          path: '/platformCenter/gis/twoDimensionConfig',
          name: '二维配置',
          name: '地图配置',
          component: SchemeConfig,
          },
          {
          ......
          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