feat: 后台静态

zjk

2026-01-18 83ab2d2173a249d8c65ba5cda185d24f6402ae8f

 feat: 后台静态

 estate-frontend-v2024/src/config/menuConfig.js

@@ -12,7 +12,7 @@
        title: "智慧大屏",
        path: "/dashboard",
        icon: "line-chart",
        permissions: ["*"]
        permissions: ["*"],
      },
      // {
      //   title: "任务日历",
@@ -20,7 +20,29 @@
      //   icon: "calendar",
      //   permissions: ["*"]
      // }
    ]
    ],
  },
  {
    title: "智慧大屏设置",
    path: "/screenSetting",
    icon: "setting",
    children: [
      {
        title: "大屏账号设置",
        path: "/screenSetting/accountSetting",
        permissions: ["*"],
      },
      {
        title: "事故分类设置",
        path: "/screenSetting/accidentTypeSetting",
        permissions: ["*"],
      },
      {
        title: "事故简讯",
        path: "/screenSetting/accidentMessageSetting",
        permissions: ["*"],
      },
    ],
  },
  {
    title: "人事管理",
@@ -30,22 +52,22 @@
      {
        title: "用户管理",
        path: "/management/userManagement",
        permissions: ["user:*"]
        permissions: ["user:*"],
      },
      {
        title: "岗位管理",
        path: "/management/roleManagement",
        permissions: ["role:*"]
        permissions: ["role:*"],
      },
      {
        title: "部门管理",
        path: "/management/departmentManagement",
        permissions: ["department:*"]
        permissions: ["department:*"],
      },
      {
        title: "车辆调度",
        path: "/management/vehicleDispatch",
        permissions: ["car:*"]
        permissions: ["car:*"],
      },
      // {
      //   title: "调度管理",
@@ -69,7 +91,7 @@
      //     // }
      //   ]
      // }
    ]
    ],
  },
  {
    title: "业务信息",
@@ -79,23 +101,23 @@
      {
        title: "委托方清单",
        path: "/business/clientInfo",
        permissions: ["client:*"]
        permissions: ["client:*"],
      },
      {
        title: "合同管理",
        path: "/business/contract",
        permissions: ["contract:*"]
        permissions: ["contract:*"],
      },
      {
        title: "项目列表",
        path: "/business/projects",
        permissions: ["project:*"]
        permissions: ["project:*"],
      },
      {
        title: "设备管理",
        path: "/business/devices",
        permissions: ["device:*"]
      }
        permissions: ["device:*"],
      },
    ],
  },
  {
@@ -106,57 +128,62 @@
      {
        title: "综合体系-标准-层级管理",
        path: "/standard/layer",
        permissions: ["systemHierarchy:*"]
        permissions: ["systemHierarchy:*"],
      },
      {
        title: "综合体系-标准-问题管理",
        path: "/standard/problems",
        permissions: ["systemProblem:*"]
        permissions: ["systemProblem:*"],
      },
      {
        title: "综合体系-模型管理",
        path: "/standard/models",
        permissions: ["systemModel:*"]
        permissions: ["systemModel:*"],
      },
      {
        title: "综合体系-专家管理",
        path: "/standard/expert",
        permissions: ["systemExpert:*"]
        permissions: ["systemExpert:*"],
      },
      {
        title: "设备体系-标准-层级管理",
        path: "/standard/deviceLayer",
        permissions: ["deviceHierarchy:*"]
        permissions: ["deviceHierarchy:*"],
      },
      {
        title: "设备体系-标准-问题管理",
        path: "/standard/deviceProblems",
        permissions: ["deviceProblem:*"]
        permissions: ["deviceProblem:*"],
      },
      {
        title: "设备体系-模型管理",
        path: "/standard/deviceModels",
        permissions: ["deviceModel:*"]
        permissions: ["deviceModel:*"],
      },
      {
        title: "设备体系-专家管理",
        path: "/standard/deviceExperts",
        permissions: ["deviceExpert:*"]
        permissions: ["deviceExpert:*"],
      },
      {
        title: "实测实量体系-标准-层级管理",
        path: "/standard/measurementLayer",
        permissions: ["*"]
        permissions: ["*"],
      },
      {
        title: "实测实量体系-标准-规则管理",
        path: "/standard/measurementRule",
        permissions: ["*"]
        permissions: ["*"],
      },
      {
        title: "实测实量-模型管理",
        path: "/standard/measurementModel",
        permissions: ["*"]
        permissions: ["*"],
      },
      {
        title: "岗位设置",
        path: "/standard/position",
        permissions: ["*"],
      },
    ],
  },
@@ -168,7 +195,7 @@
      {
        title: "计划管理",
        path: "/procucePlan/management",
        permissions: ["plan:*"]
        permissions: ["plan:*"],
      },
      // {
      //   title: "委托任务",
@@ -185,22 +212,32 @@
      {
        title: "正确做法",
        path: "/businessData/correct-practice",
        permissions: ["warningRecord:*"]
        permissions: ["warningRecord:*"],
      },
      {
        title: "综合问题",
        path: "/system/error",
        permissions: ["errorRecord:*"]
        permissions: ["errorRecord:*"],
      },
      {
        title: "设备问题",
        path: "/device/error",
        permissions: ["deviceRecord:*"]
        permissions: ["deviceRecord:*"],
      },
      {
        title: "测量记录",
        path: "/businessData/measure-record",
        permissions: ["*"]
        permissions: ["*"],
      },
      {
        title: "在岗情况",
        path: "/businessData/on-duty",
        permissions: ["*"],
      },
      {
        title: "检查情况",
        path: "/businessData/check",
        permissions: ["*"],
      },
    ],
  },
@@ -212,7 +249,7 @@
      {
        title: "模版清单",
        path: "/report/module",
        permissions: ["reportTemplate:*"]
        permissions: ["reportTemplate:*"],
      },
    ],
  },
@@ -224,7 +261,7 @@
      {
        title: "档案管理",
        path: "/document/list",
        permissions: ["archive:*"]
        permissions: ["archive:*"],
      },
    ],
  },
@@ -236,17 +273,17 @@
      {
        title: "模糊评价",
        path: "/project/fuzzy",
        permissions: ["fuzzyEvaluation:*"]
        permissions: ["fuzzyEvaluation:*"],
      },
      {
        title: "打分评价",
        path: "/project/calc",
        permissions: ["scoreEvaluation:*"]
        permissions: ["scoreEvaluation:*"],
      },
      {
        title: "测量评价",
        path: "/project/measurement",
        permissions: ["*"]
        permissions: ["*"],
      },
    ],
  },
@@ -258,12 +295,12 @@
      {
        title: "数字地图",
        path: "/map/digital-map",
        permissions: ["*"]
        permissions: ["*"],
      },
      {
        title: "地图配置",
        path: "/map/map-config",
        permissions: ["*"]
        permissions: ["*"],
      },
    ],
  },

 estate-frontend-v2024/src/config/routeMap.js

@@ -57,6 +57,12 @@
const Error404 = Loadable({ loader: () => import(/*webpackChunkName:'Error404'*/'@/views/error/404'), loading: Loading });
const Bug = Loadable({ loader: () => import(/*webpackChunkName:'Bug'*/'@/views/bug'), loading: Loading });
const Personal = Loadable({ loader: () => import(/*webpackChunkName:'Personal'*/'@/views/personal'), loading: Loading });
const AccountSetting = Loadable({ loader: () => import(/*webpackChunkName:'AccountSetting'*/'@/views/screenSetting/accountSetting'), loading: Loading });
const AccidentTypeSetting = Loadable({ loader: () => import(/*webpackChunkName:'AccidentTypeSetting'*/'@/views/screenSetting/accidentTypeSetting'), loading: Loading });
const AccidentMessageSetting = Loadable({ loader: () => import(/*webpackChunkName:'AccidentMessageSetting'*/'@/views/screenSetting/accidentMessageSetting'), loading: Loading });
const PositionSetting = Loadable({ loader: () => import(/*webpackChunkName:'PositionSetting'*/'@/views/standard/position'), loading: Loading });
const OnDuty = Loadable({ loader: () => import(/*webpackChunkName:'OnDuty'*/'@/views/business/onDuty'), loading: Loading });
const Check = Loadable({ loader: () => import(/*webpackChunkName:'Check'*/'@/views/business/check'), loading: Loading });

export default [
  { path: "/dashboard", component: Dashboard },
@@ -116,4 +122,11 @@
  { path: "/bug", component: Bug },
  { path: "/personal", component: Personal },
  { path: "/error/404", component: Error404 },

  { path: "/screenSetting/accountSetting", component: AccountSetting },
  { path: "/screenSetting/accidentTypeSetting", component: AccidentTypeSetting },
  { path: "/screenSetting/accidentMessageSetting", component: AccidentMessageSetting },
  { path: "/standard/position", component: PositionSetting },
  { path: "/businessData/on-duty", component: OnDuty },
  { path: "/businessData/check", component: Check },
];

 estate-frontend-v2024/src/views/business/check.jsx

New file
@@ -0,0 +1,172 @@
import React from "react";
import { Button, Card, Divider, Select, Table, Modal } from "antd";
import { deleteDataProblem, getBusinessDataProbList } from "@/api/business";
import "../business/style/clientInfo.less";
import {
  errorLevelMap,
  errorReviewStateMap,
  riskLevelMap,
} from "../common/constants";
import CorrectPractice from "./correctPractice";
import EditDataProblemForm from "./forms/edit-dataProblem-form";
import EditDataPForm from "./forms/edit-dataP-form";

import { formatDeletedString } from "../common/common_func";
import ImagePreview from "./components/imagePreview";
import ImagePreviewView from "./components/imagePreview";
import Spacer from "../common/components/Spacer";
import { includePermission } from "../../utils/auth";
import { exportDataProblem } from "../../api/export";

const { Column } = Table;
const { Option } = Select;
const axios = require("axios");

class Check extends CorrectPractice {
  moduleName = "errorRecord";

  getEntityList(pageInfo, listBody) {
    return getBusinessDataProbList(pageInfo, listBody);
  }

  deleteEntities(ids) {
    return deleteDataProblem(ids);
  }

  async exportEntities(listBody) {
    return exportDataProblem(listBody);
  }

  handleEditAssignee = (row) => {
    this.setState({
      currentRowData: JSON.parse(JSON.stringify(row)),
      editDataPModalVisible: true,
      editDataPModalLoading: false,
    });
  };

  handleEditDataPCancel = (row) => {
    this.setState({
      editDataPModalVisible: false,
      editDataPModalLoading: false,
    });
  };

  render() {
    const { entities } = this.state;
    const title = this.getTitle();
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            rowSelection={{
              type: "checkbox",
              selectedRowKeys: this.state.selectedRowKeys,
              onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                  selectedEntities: selectedRows,
                  selectedRowKeys: selectedRowKeys,
                });
              },
            }}
            dataSource={entities}
            pagination={false}
            scroll={{ x: "100%" }}
          >
            <Column
              title="计划名称"
              key="planName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.planName)}</span>
              )}
            />
            <Column
              title="项目"
              key="projectName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.projectName)}</span>
              )}
            />
            <Column
              title="委托方"
              key="projectName"
              align="center"
              ellipsis={true}
            />
            <Column
              title="安全告知单"
              key="hierarchyName"
              dataIndex="hierarchyName"
              align="center"
              ellipsis={true}
            />
            <Column
              title="检查人员照片"
              key="problemPart"
              align="center"
              dataIndex="problemPart"
              ellipsis={true}
            />
            <Column
              title="廉政告知单"
              dataIndex="problem.info"
              key="problem.info"
              align="center"
              ellipsis={true}
            />
            <Column
              title="检查时间"
              key="creator.name"
              align="center"
              dataIndex="creator.name"
              ellipsis={true}
            />
            <Column
              title="操作"
              key="action"
              width={340}
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>
                  <Button
                    title="详情"
                    hidden={!includePermission(this.moduleName + ":edit")}
                    onClick={this.handleEditEntity.bind(null, row)}
                  >
                    详情
                  </Button>
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <Modal
          title="在岗情况"
          visible={this.state.editModalVisible}
          onCancel={this.handleEditEntityCancel}
        >
          <div className="detail">
            <div>计划名称：xxx</div>
            <div>项目：xxx</div>
            <div>检查标题：xxx</div>
            <div>检查时间：xxx</div>
            <div>安全告知单：</div>
            <div>检查人员照片：</div>
            <div>廉政告知单：</div>
          </div>
        </Modal>
      </div>
    );
  }
}

export default Check;

 estate-frontend-v2024/src/views/business/clientInfo.jsx

@@ -3,6 +3,8 @@
import {getClientList, deleteClient, editClient} from "@/api/business";
import {getUsersOptions} from '@/api/user'
import EditClientForm from "./forms/edit-client-form"
import EditClientParamsForm from "./forms/edit-clientParams-form"

import './style/clientInfo.less'
import {clientTypeMap} from "../common/constants";
import {toOptionsData} from "../common/common_func";
@@ -59,7 +61,7 @@
    render() {
        const {entities} = this.state
        const title = (
            <div className="title flex">
            <div className="flex title">
                <div>
                    <Input
                        style={inputLongStyle}
@@ -138,8 +140,10 @@
                        <Column title="委托方意向" dataIndex="intention" key="intention" align="center" ellipsis={true}/>
                        <Column title="创建时间" key="createTime" dataIndex="createTime" align="center" ellipsis={true}/>
                        <Column title="创建人" dataIndex="creator.name" key="creator.name" align="center" ellipsis={true}/>
                        <Column title="操作" key="action" width={200} align="center" render={(text, row) => (
                        <Column title="操作" key="action" width={300} align="center" render={(text, row) => (
                            <span>
                                {this.renderParameterSettingButton(row, 'client:edit')}
                                <Spacer/>
                                {this.renderEditButton(row, 'client:edit')}
                                <Spacer/>
                                {this.renderDeleteButton(row, 'client:delete')}
@@ -157,6 +161,14 @@
                    onCancel={this.handleEditEntityCancel}
                    onOk={this.handleEditEntityOk}
                />
                <EditClientParamsForm
                    currentRowData={this.state.currentRowData}
                    wrappedComponentRef={formRef => this.editParamsFormRef = formRef}
                    visible={this.state.parameterSettingModalVisible}
                    confirmLoading={this.state.parameterSettingModalLoading}
                    onCancel={this.handleParameterSettingEntityCancel}
                    onOk={this.handleParameterSettingEntityOk}
                />
            </div>
        );
    }

 estate-frontend-v2024/src/views/business/dataProblem.jsx

@@ -1,102 +1,217 @@
import React from "react";
import {Button, Card, Divider, Select, Table} from "antd";
import {deleteDataProblem, getBusinessDataProbList} from "@/api/business";
import '../business/style/clientInfo.less'
import {errorLevelMap, errorReviewStateMap, riskLevelMap} from "../common/constants";
import { Button, Card, Divider, Select, Table } from "antd";
import { deleteDataProblem, getBusinessDataProbList } from "@/api/business";
import "../business/style/clientInfo.less";
import {
  errorLevelMap,
  errorReviewStateMap,
  riskLevelMap,
} from "../common/constants";
import CorrectPractice from "./correctPractice";
import EditDataProblemForm from "./forms/edit-dataProblem-form";
import {formatDeletedString} from "../common/common_func";
import EditDataPForm from "./forms/edit-dataP-form";

import { formatDeletedString } from "../common/common_func";
import ImagePreview from "./components/imagePreview";
import ImagePreviewView from "./components/imagePreview";
import Spacer from "../common/components/Spacer";
import {includePermission} from "../../utils/auth";
import {exportDataProblem} from "../../api/export";
import { includePermission } from "../../utils/auth";
import { exportDataProblem } from "../../api/export";

const {Column} = Table;
const {Option} = Select
const axios = require('axios');
const { Column } = Table;
const { Option } = Select;
const axios = require("axios");

class DataProb extends CorrectPractice {
  moduleName = "errorRecord";

    moduleName = 'errorRecord'
  getEntityList(pageInfo, listBody) {
    return getBusinessDataProbList(pageInfo, listBody);
  }

    getEntityList(pageInfo, listBody) {
        return getBusinessDataProbList(pageInfo, listBody)
    }
  deleteEntities(ids) {
    return deleteDataProblem(ids);
  }

    deleteEntities(ids) {
        return deleteDataProblem(ids)
    }
  async exportEntities(listBody) {
    return exportDataProblem(listBody);
  }

    async exportEntities(listBody) {
        return exportDataProblem(listBody)
    }
  handleEditAssignee = (row) => {
    this.setState({
      currentRowData: JSON.parse(JSON.stringify(row)),
      editDataPModalVisible: true,
      editDataPModalLoading: false,
    });
  };

    render() {
        const {entities} = this.state
        const title = this.getTitle()
        return (
            <div className="app-container">
                <Card title={title}>
                    <Table
                        bordered
                        rowKey="id"
                        rowSelection={{
                            type: 'checkbox',
                            selectedRowKeys: this.state.selectedRowKeys,
                            onChange: (selectedRowKeys, selectedRows) => {
                                this.setState({
                                    selectedEntities: selectedRows,
                                    selectedRowKeys: selectedRowKeys
                                })
                            },
                        }}
                        dataSource={entities}
                        pagination={false}
                        scroll={{x: '100%'}}>
                        <Column title="序号" dataIndex="id" key="id" align="center" ellipsis={true}/>
                        <Column title="计划" key="planName" align="center" ellipsis={true} render={(text, row) => (
                            <span>{formatDeletedString(row.planName)}</span>
                        )}/>
                        <Column title="项目" key="projectName" align="center" ellipsis={true} render={(text, row) => (
                            <span>{formatDeletedString(row.projectName)}</span>
                        )}/>
                        <Column title="检查内容" key="hierarchyName" dataIndex="hierarchyName" align="center" ellipsis={true}/>
                        <Column title="问题部位" key="problemPart" align="center" dataIndex="problemPart" ellipsis={true}/>
                        <Column title="问题描述" dataIndex="problem.info" key="problem.info" align="center" ellipsis={true}/>
                        <Column title="问题备注" dataIndex="remark" key="remark" align="center" ellipsis={true}/>
                        <Column title="隐患等级" dataIndex="level" key="level" ellipsis={true} render={(text, row) => (
                            <span>{errorLevelMap[row.level]}</span>
                        )}/>
                        <Column title="复查状态" key="errorReviewState" align="center" ellipsis={true} render={(text, row) => (
                            <span>{row.errorReviewState ? errorReviewStateMap[row.errorReviewState] : '未复查'}</span>
                        )}/>
                        {this.renderImagePreviewColumn()}
                        <Column title="创建人" key="creator.name" align="center" dataIndex="creator.name" ellipsis={true}/>
                        <Column title="操作" key="action" width={255} align="center" ellipsis={true}
                                render={(text, row) => (
                                    <span>
                                    <Button title="详情" hidden={!includePermission(this.moduleName + ":edit")}
                                            onClick={this.handleEditEntity.bind(null, row)}>详情</Button>
                                    <Spacer/>
                                    {this.renderDeleteButton(row, this.moduleName + ":delete")}
                                    </span>
                                )}/>
                    </Table>
                    <br/>
                    {this.renderPagination()}
                </Card>
                <EditDataProblemForm
                    currentRowData={this.state.currentRowData}
                    wrappedComponentRef={formRef => this.editFormRef = formRef}
                    visible={this.state.editModalVisible}
                    confirmLoading={this.state.editModalLoading}
                    onCancel={this.handleEditEntityCancel}
                />
                {this.renderImagePreviewModal()}
            </div>
        );
    }
  handleEditDataPCancel = (row) => {
    this.setState({
      editDataPModalVisible: false,
      editDataPModalLoading: false,
    });
  };

  render() {
    const { entities } = this.state;
    const title = this.getTitle();
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            rowSelection={{
              type: "checkbox",
              selectedRowKeys: this.state.selectedRowKeys,
              onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                  selectedEntities: selectedRows,
                  selectedRowKeys: selectedRowKeys,
                });
              },
            }}
            dataSource={entities}
            pagination={false}
            scroll={{ x: "100%" }}
          >
            <Column
              title="序号"
              dataIndex="id"
              key="id"
              align="center"
              ellipsis={true}
            />
            <Column
              title="计划"
              key="planName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.planName)}</span>
              )}
            />
            <Column
              title="项目"
              key="projectName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.projectName)}</span>
              )}
            />
            <Column
              title="检查内容"
              key="hierarchyName"
              dataIndex="hierarchyName"
              align="center"
              ellipsis={true}
            />
            <Column
              title="问题部位"
              key="problemPart"
              align="center"
              dataIndex="problemPart"
              ellipsis={true}
            />
            <Column
              title="问题描述"
              dataIndex="problem.info"
              key="problem.info"
              align="center"
              ellipsis={true}
            />
            <Column
              title="问题备注"
              dataIndex="remark"
              key="remark"
              align="center"
              ellipsis={true}
            />
            <Column
              title="隐患等级"
              dataIndex="level"
              key="level"
              ellipsis={true}
              render={(text, row) => <span>{errorLevelMap[row.level]}</span>}
            />
            <Column
              title="复查状态"
              key="errorReviewState"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>
                  {row.errorReviewState
                    ? errorReviewStateMap[row.errorReviewState]
                    : "未复查"}
                </span>
              )}
            />
            <Column
              title="责任人"
              key="assignee.name"
              align="center"
              ellipsis={true}
            />
            {this.renderImagePreviewColumn()}
            <Column
              title="创建人"
              key="creator.name"
              align="center"
              dataIndex="creator.name"
              ellipsis={true}
            />
            <Column
              title="操作"
              key="action"
              width={340}
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>
                  <Button
                    title="编辑责任人"
                    hidden={!includePermission(this.moduleName + ":edit")}
                    onClick={this.handleEditAssignee.bind(null, row)}
                  >
                    编辑责任人
                  </Button>
                  <Spacer />
                  <Button
                    title="详情"
                    hidden={!includePermission(this.moduleName + ":edit")}
                    onClick={this.handleEditEntity.bind(null, row)}
                  >
                    详情
                  </Button>
                  <Spacer />
                  {this.renderDeleteButton(row, this.moduleName + ":delete")}
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <EditDataProblemForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
        />
        {this.renderImagePreviewModal()}
        <EditDataPForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editDataPModalVisible}
          confirmLoading={this.state.editDataPModalLoading}
          onCancel={this.handleEditDataPCancel}
        />
      </div>
    );
  }
}

export default DataProb;

 estate-frontend-v2024/src/views/business/forms/edit-clientParams-form.jsx

New file
@@ -0,0 +1,666 @@
import React from "react";
import {
  Form,
  Input,
  Select,
  Modal,
  Tabs,
  Table,
  Checkbox,
  Upload,
  Icon,
  Row,
  Col,
  Switch,
  Radio,
  Button,
} from "antd";
import BaseForm from "../../common/edit-form-base";
import "../style/clientParams.less";
import { checkFileSize } from "../../common/common_func";

const { Option } = Select;
const { TabPane } = Tabs;
const { Column } = Table;

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = (error) => reject(error);
  });
}

// 初始表格数据
const initialDataSource = [
  { id: 1, title: "端口", subTitle: "大屏板块", visible: true },

  { id: 2, title: "委托方端", subTitle: "项目总数（在建工程）", visible: true },
  {
    id: 3,
    title: "委托方端",
    subTitle: "大型机械设备数（在建工程）",
    visible: true,
  },
  {
    id: 4,
    title: "委托方端",
    subTitle: "重大隐患数（在建工程）",
    visible: true,
  },
  { id: 5, title: "委托方端", subTitle: "项目总数（固定资产）", visible: true },
  {
    id: 6,
    title: "委托方端",
    subTitle: "重大隐患数（固定资产）",
    visible: true,
  },
  { id: 7, title: "委托方端", subTitle: "事故简讯", visible: true },
  { id: 8, title: "委托方端", subTitle: "工作展示", visible: true },

  { id: 9, title: "项目端", subTitle: "各分项隐患趋势", visible: true },
  { id: 10, title: "项目端", subTitle: "隐患数量", visible: true },
  { id: 11, title: "项目端", subTitle: "设备数量", visible: true },
  { id: 12, title: "项目端", subTitle: "查看报告入口", visible: true },
  { id: 13, title: "项目端", subTitle: "人员在岗率", visible: true },
  { id: 14, title: "项目端", subTitle: "重大风险源", visible: true },
  { id: 15, title: "项目端", subTitle: "项目风险趋势", visible: true },
];

class EditClientParamsForm extends BaseForm {
  constructor(props) {
    super(props);
    this.state = {
      editableData: this.initEditableData(),
      dataSource: initialDataSource,
      previewVisible: false,
      previewImage: "",
      assetRules: {
        A: [[{ level: undefined, count: undefined }]],
        B: [[{ level: undefined, count: undefined }]],
        C: [[{ level: undefined, count: undefined }]],
      },
    };
  }

  initEditableData() {
    return {
      name: "",
      file: [],
    };
  }

  handleCancel = () =>
    this.setState({
      previewVisible: false,
      previewImage: "",
    });

  handlePreview = async (file) => {
    if (!file.url && !file.preview) {
      file.preview = await getBase64(file.originFileObj);
    }

    this.setState({
      previewVisible: true,
      previewImage: file.url || file.preview,
    });
  };

  // 切换可见状态
  handleCheckboxChange = (record) => {
    this.setState((prevState) => ({
      dataSource: prevState.dataSource.map((item) =>
        item.id === record.id ? { ...item, visible: !item.visible } : item,
      ),
    }));
  };

  // 添加 OR 条件
  addOrCondition = (type) => {
    this.setState((prev) => ({
      assetRules: {
        ...prev.assetRules,
        [type]: [
          ...prev.assetRules[type],
          [{ level: undefined, count: undefined }],
        ],
      },
    }));
  };

  // 删除 OR 条件
  removeOrCondition = (type, orIndex) => {
    this.setState((prev) => {
      const rules = prev.assetRules[type].filter(
        (_, index) => index !== orIndex,
      );

      return {
        assetRules: {
          ...prev.assetRules,
          [type]: rules.length
            ? rules
            : [[{ level: undefined, count: undefined }]], // 至少保留一组
        },
      };
    });
  };

  // 删除 AND 条件
  removeAndCondition = (type, orIndex, andIndex) => {
    this.setState((prev) => {
      const rules = [...prev.assetRules[type]];

      // 删除 AND
      rules[orIndex] = rules[orIndex].filter((_, index) => index !== andIndex);

      // 如果 OR 里已经没有 AND 了，删除整个 OR
      if (rules[orIndex].length === 0) {
        rules.splice(orIndex, 1);
      }

      return {
        assetRules: {
          ...prev.assetRules,
          [type]: rules,
        },
      };
    });
  };

  // 添加 AND 条件
  addAndCondition = (type, orIndex) => {
    this.setState((prev) => {
      const rules = [...prev.assetRules[type]];
      rules[orIndex] = [
        ...rules[orIndex],
        { level: undefined, count: undefined },
      ];
      return { assetRules: { ...prev.assetRules, [type]: rules } };
    });
  };

  updateCondition = (type, orIndex, andIndex, key, value) => {
    this.setState((prev) => {
      const rules = [...prev.assetRules[type]];
      rules[orIndex][andIndex][key] = value;
      return { assetRules: { ...prev.assetRules, [type]: rules } };
    });
  };

  render() {
    const { visible, onCancel, onOk, form, confirmLoading } = this.props;
    const { getFieldDecorator } = form;
    const { name, file } = this.state.editableData;
    const { dataSource, previewVisible, previewImage, assetRules } = this.state;

    const uploadButton = (
      <div>
        <Icon type="plus" />
      </div>
    );

    return (
      <Modal
        title="参数设置"
        visible={visible}
        onCancel={onCancel}
        onOk={() => onOk(dataSource)}
        width={1100}
        destroyOnClose
        confirmLoading={confirmLoading}
      >
        <Tabs defaultActiveKey="1">
          {/* 参数设置 */}
          <TabPane tab="参数设置" key="1">
            <Form layout="inline">
              <Row gutter={24}>
                <Col span={12}>
                  <Form.Item label="大屏显示名称">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请输入大屏显示名称!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <Input
                        style={{ width: "300px" }}
                        maxLength={15}
                        placeholder="请输入15字内"
                      />,
                    )}
                  </Form.Item>
                </Col>
                <Col span={12}>
                  <Form.Item label="LOGO">
                    {getFieldDecorator("file", {
                      valuePropName: "file",
                      // getValueFromEvent: singleFile,
                      initialValue: file,
                      rules: [{ required: true, message: "请上传LOGO" }],
                    })(
                      <div>
                        <Upload
                          disabled={this.uploading}
                          name={"file"}
                          maxCount={1}
                          listType="picture-card"
                          multiple={false}
                          customRequest={this.uploadAttachment.bind(
                            null,
                            "file",
                          )}
                          onRemove={() => {
                            this.setFieldValue("file", []);
                          }}
                          onPreview={this.handlePreview}
                          beforeUpload={checkFileSize}
                          accept="image/*"
                        >
                          {!file || file.length === 0 ? uploadButton : null}
                        </Upload>
                        <Modal
                          visible={previewVisible}
                          footer={null}
                          onCancel={this.handleCancel}
                        >
                          <img
                            alt="example"
                            style={{ width: "100%" }}
                            src={previewImage}
                          />
                        </Modal>
                      </div>,
                    )}
                  </Form.Item>
                </Col>
                <Col span={24}>
                  <Form.Item label="是否显示整改状态">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请选择是否显示整改状态!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <div>
                        <span>
                          重大隐患：
                          <Switch />
                        </span>
                        <span style={{ marginLeft: 20 }}>
                          一般（设备/安全）隐患：
                          <Switch />
                        </span>
                        <div
                          style={{
                            fontSize: "12px",
                            color: "#999",
                            lineHeight: "12px",
                          }}
                        >
                          委托方查看整改列表时，是否显示整改状态字段
                        </div>
                      </div>,
                    )}
                  </Form.Item>
                </Col>
                <Col span={24} style={{ marginTop: 16 }}>
                  <Form.Item label="报告评价设置">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请选择报告评价设置!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <div>
                        <Radio.Group>
                          <Radio value={1}>模糊评价</Radio>
                          <Radio value={2}>打分评价</Radio>
                        </Radio.Group>
                        <div
                          style={{
                            fontSize: "12px",
                            color: "#999",
                            lineHeight: "12px",
                          }}
                        >
                          委托方查看项目报告时，报告记录显示模糊评价还是打分评价数据
                        </div>
                      </div>,
                    )}
                  </Form.Item>
                </Col>
                <Col span={24} style={{ marginTop: 16 }}>
                  <Form.Item label="报告生成方式">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请选择报告生成方式!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <div>
                        <div>
                          安全报告
                          <Select style={{ width: 200, marginLeft: 20 }}>
                            <Option value={1}>默认模板</Option>
                          </Select>
                        </div>
                        <div>
                          设备报表
                          <Select style={{ width: 200, marginLeft: 20 }}>
                            <Option value={1}>默认模板</Option>
                          </Select>
                        </div>
                        <div
                          style={{
                            fontSize: "12px",
                            color: "#999",
                            lineHeight: "12px",
                          }}
                        >
                          委托方查看项目报告时，报告样式是用哪个模板
                        </div>
                      </div>,
                    )}
                  </Form.Item>
                </Col>
                <Col span={24} style={{ marginTop: 16 }}>
                  <Form.Item label="委托方项目总数">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请输入委托方项目总数!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <Input
                        style={{ width: "300px" }}
                        type="number"
                        placeholder="请输入项目数"
                      />,
                    )}
                  </Form.Item>
                </Col>
                <Col span={24} style={{ marginTop: 16 }}>
                  <Form.Item label="风险等级参数设置">
                    {getFieldDecorator("name", {
                      rules: [
                        { required: true, message: "请设置风险等级参数!" },
                      ],
                      initialValue: name,
                      onChange: this.handleFieldChange("name"),
                    })(
                      <div className="container">
                        <div>在建项目：</div>
                        <div className="item">
                          <div className="label">A类：</div>
                          <div className="value">
                            平均分大于等于
                            <Input
                              className="value-input"
                              type="number"
                              placeholder="请输入分数"
                            />
                          </div>
                        </div>
                        <div className="item">
                          <div className="label">B类：</div>
                          <div className="value">
                            平均分大于等于
                            <Input
                              className="value-input"
                              type="number"
                              placeholder="请输入分数"
                            />
                          </div>
                        </div>
                        <div className="item">
                          <div className="label">C类：</div>
                          <div className="value">
                            平均分大于等于
                            <Input
                              className="value-input"
                              type="number"
                              placeholder="请输入分数"
                            />
                          </div>
                        </div>
                        <div className="item">
                          <div className="label">分数占比：</div>
                          <div className="footerValue">
                            <div>
                              安全检查
                              <Input
                                className="value-input"
                                type="number"
                                placeholder="请输入占比"
                              />{" "}
                              %
                            </div>
                            <div>
                              设备检查
                              <Input
                                className="value-input"
                                type="number"
                                placeholder="请输入占比"
                              />{" "}
                              %
                            </div>
                          </div>
                        </div>
                        <div>资产项目：</div>
                        {["A", "B", "C"].map((type) => (
                          <div
                            className="flex"
                            key={type}
                            style={{ marginTop: 12 }}
                          >
                            <div className="label">{type}类：</div>
                            <div>
                              <Button
                                type="primary"
                                onClick={() => this.addOrCondition(type)}
                              >
                                添加OR条件
                              </Button>

                              {assetRules[type].map((orGroup, orIndex) => (
                                <div
                                  key={orIndex}
                                  style={{
                                    alignItems: "center",
                                    flexWrap: "wrap",
                                    width: 700,
                                  }}
                                  className="flex"
                                >
                                  {orIndex > 0 && (
                                    <div>
                                      <span
                                        style={{
                                          color: "#ff4d4f",
                                        }}
                                      >
                                        OR
                                      </span>
                                      <Icon
                                        type="delete"
                                        style={{
                                          marginLeft: 8,
                                          fontSize: 18,
                                          color: "#FF4D4F",
                                          cursor: "pointer",
                                          marginRight: 8,
                                        }}
                                        onClick={() =>
                                          this.removeOrCondition(type, orIndex)
                                        }
                                      />
                                    </div>
                                  )}
                                  {orGroup.map((andItem, andIndex) => (
                                    <div
                                      key={andIndex}
                                      style={{
                                        display: "flex",
                                        alignItems: "center",
                                      }}
                                    >
                                      {andIndex > 0 && (
                                        <div>
                                          <span
                                            style={{
                                              marginLeft: 8,
                                              color: "#999",
                                            }}
                                          >
                                            and
                                          </span>
                                          <Icon
                                            type="minus-circle"
                                            theme="filled"
                                            style={{
                                              marginLeft: 8,
                                              fontSize: 18,
                                              color: "#FF4D4F",
                                              cursor: "pointer",
                                              marginRight: 8,
                                            }}
                                            onClick={() =>
                                              this.removeAndCondition(
                                                type,
                                                orIndex,
                                                andIndex,
                                              )
                                            }
                                          />
                                        </div>
                                      )}
                                      <Select
                                        style={{ width: 120 }}
                                        placeholder="隐患级别"
                                        value={andItem.level}
                                        onChange={(val) =>
                                          this.updateCondition(
                                            type,
                                            orIndex,
                                            andIndex,
                                            "level",
                                            val,
                                          )
                                        }
                                      >
                                        <Option value={1}>一级隐患</Option>
                                        <Option value={2}>二级隐患</Option>
                                        <Option value={3}>三级隐患</Option>
                                        <Option value={4}>四级隐患</Option>
                                      </Select>

                                      <Input
                                        style={{ width: 120, marginLeft: 16 }}
                                        type="number"
                                        placeholder="请输入数量"
                                        value={andItem.count}
                                        onChange={(e) =>
                                          this.updateCondition(
                                            type,
                                            orIndex,
                                            andIndex,
                                            "count",
                                            e.target.value,
                                          )
                                        }
                                      />
                                    </div>
                                  ))}
                                  <Icon
                                    type="plus-circle"
                                    theme="filled"
                                    style={{
                                      marginLeft: 8,
                                      fontSize: 18,
                                      color: "#1DA57A",
                                      cursor: "pointer",
                                    }}
                                    onClick={() =>
                                      this.addAndCondition(type, orIndex)
                                    }
                                  />
                                </div>
                              ))}
                            </div>
                          </div>
                        ))}
                      </div>,
                    )}
                  </Form.Item>
                </Col>
              </Row>
            </Form>
          </TabPane>

          {/* 权限板块设置 */}
          <TabPane tab="权限板块设置" key="2">
            <Table
              rowKey="id"
              dataSource={dataSource}
              bordered
              pagination={false}
            >
              <Column
                title="一级权限模块"
                dataIndex="title"
                key="title"
                render={(text, row, index) => {
                  if (index === 0) {
                    return { children: text, props: { rowSpan: 1 } };
                  }
                  if (index === 1) {
                    return { children: "委托方端", props: { rowSpan: 7 } };
                  }
                  if (index > 1 && index <= 7) {
                    return { children: null, props: { rowSpan: 0 } };
                  }
                  if (index === 8) {
                    return { children: "项目端", props: { rowSpan: 7 } };
                  }
                  if (index > 8 && index <= 14) {
                    return { children: null, props: { rowSpan: 0 } };
                  }
                  return text;
                }}
              />

              <Column
                title="二级权限模块"
                dataIndex="subTitle"
                key="subTitle"
              />

              <Column
                title="是否可见"
                key="visible"
                render={(text, row) => (
                  <Checkbox
                    checked={row.visible}
                    onChange={() => this.handleCheckboxChange(row)}
                  />
                )}
              />
            </Table>
          </TabPane>
        </Tabs>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditClientParamsForm" })(
  EditClientParamsForm,
);

 estate-frontend-v2024/src/views/business/forms/edit-dataP-form.jsx

New file
@@ -0,0 +1,45 @@
import React from "react";
import { Form, Input, Modal } from "antd";
import BaseForm from "../../common/edit-form-base";

class EditClientForm extends BaseForm {
  initEditableData() {
    return {
      name: "",
    };
  }

  render() {
    const { visible, onCancel, onOk, form, confirmLoading } = this.props;
    const { getFieldDecorator } = form;
    const { name } = this.state.editableData;
    // 替换标题为"编辑责任人"
    return (
      <Modal
        title="编辑责任人"
        visible={visible}
        onCancel={onCancel}
        onOk={onOk}
        destroyOnClose
        confirmLoading={confirmLoading}
      >
        <Form {...this.formItemLayout}>
          <Form.Item label="责任人:">
            {getFieldDecorator("name", {
              rules: [{ required: true, message: "请输入责任人!" }],
              initialValue: name,
              onChange: this.handleFieldChange("name"),
            })(
              <Input
                style={{ marginLeft: "10px" }}
                placeholder="请输入责任人"
              />,
            )}
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditClientForm" })(EditClientForm);

 estate-frontend-v2024/src/views/business/forms/edit-project-form.jsx

@@ -224,6 +224,17 @@
                    )}
                </Form.Item>
            </div>
            <div className="p-10">
                <Form.Item label="项目规格:">
                    {getFieldDecorator("clientId", {
                        initialValue: client? {key: client.id, label: client.name} : undefined,
                        rules: [{required: true, message: '请选择委托方！'}],
                        onChange: this.handleEntitySelectChange('client')
                    })(
                    <Input placeholder="请输入项目规格" />
                    )}
                </Form.Item>
            </div>
          </div>
          <div className="grid grid-1-1-1">
            <div className="p-10">
@@ -386,11 +397,21 @@
                <Form.Item label="详细地址:">
                    {getFieldDecorator("address", {
                        initialValue: addressInfo && addressInfo.detail ? addressInfo.detail : '',
                        rules: [{required: true, message: '请输入详细地址！'}],
                        onChange: this.handleEntityFieldSelectChange('addressInfo', 'detail')
                        })(<Input placeholder="详细地址" />)}
                </Form.Item>
            </div>
            <div className="p-10">
                <Form.Item label="经纬度:">
                    {getFieldDecorator("address", {
                        initialValue: addressInfo && addressInfo.detail ? addressInfo.detail : '',
                        rules: [{required: true, message: '请输入经纬度！'}],
                        onChange: this.handleEntityFieldSelectChange('addressInfo', 'detail')
                        })(<Input placeholder="经纬度" />)}
                </Form.Item>
            </div>
            <div className="p-10">
                <Form.Item label="工程造价:" >
                    {getFieldDecorator("projectCost", {
                        initialValue: projectCost,

 estate-frontend-v2024/src/views/business/forms/edit-projectPermission-form.jsx

New file
@@ -0,0 +1,124 @@
import React from "react";
import {
  Form,
  Input,
  Select,
  Modal,
  Tabs,
  Table,
  Checkbox,
  Upload,
  Icon,
  Row,
  Col,
  Switch,
  Radio,
  Button,
} from "antd";
import BaseForm from "../../common/edit-form-base";
import "../style/clientParams.less";
import { checkFileSize } from "../../common/common_func";

const { Option } = Select;
const { TabPane } = Tabs;
const { Column } = Table;

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = (error) => reject(error);
  });
}

// 初始表格数据
const initialDataSource = [
  { id: 1, title: "端口", subTitle: "大屏板块", visible: true },
  { id: 2, title: "项目端", subTitle: "各分项隐患趋势", visible: true },
  { id: 3, title: "项目端", subTitle: "隐患数量", visible: true },
  { id: 4, title: "项目端", subTitle: "设备数量", visible: true },
  { id: 5, title: "项目端", subTitle: "查看报告入口", visible: true },
  { id: 6, title: "项目端", subTitle: "人员在岗率", visible: true },
  { id: 7, title: "项目端", subTitle: "重大风险源", visible: true },
  { id: 8, title: "项目端", subTitle: "项目风险趋势", visible: true },
];

class EditClientParamsForm extends BaseForm {
  constructor(props) {
    super(props);
    this.state = {
      editableData: this.initEditableData(),
      dataSource: initialDataSource,
    };
  }

  initEditableData() {
    return {
      name: "",
    };
  }

  // 切换可见状态
  handleCheckboxChange = (record) => {
    this.setState((prevState) => ({
      dataSource: prevState.dataSource.map((item) =>
        item.id === record.id ? { ...item, visible: !item.visible } : item,
      ),
    }));
  };

  render() {
    const { visible, onCancel, onOk, form, confirmLoading } = this.props;
    const { dataSource } = this.state;

    return (
      <Modal
        title="参数设置"
        visible={visible}
        onCancel={onCancel}
        onOk={() => onOk(dataSource)}
        width={1100}
        destroyOnClose
        confirmLoading={confirmLoading}
      >
        <Table rowKey="id" dataSource={dataSource} bordered pagination={false}>
          <Column
            title="一级权限模块"
            dataIndex="title"
            key="title"
            render={(text, row, index) => {
              if (index === 0) {
                return { children: text, props: { rowSpan: 1 } };
              }
              if (index === 2) {
                return { children: "项目端", props: { rowSpan: 7 } };
              }
              if (index > 2 && index <= 8) {
                return { children: null, props: { rowSpan: 0 } };
              }
              return text;
            }}
          />

          <Column title="二级权限模块" dataIndex="subTitle" key="subTitle" />

          <Column
            title="是否可见"
            key="visible"
            render={(text, row) => (
              <Checkbox
                checked={row.visible}
                onChange={() => this.handleCheckboxChange(row)}
              />
            )}
          />
        </Table>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditClientParamsForm" })(
  EditClientParamsForm,
);

 estate-frontend-v2024/src/views/business/forms/edit-projectStatus-form.jsx

New file
@@ -0,0 +1,54 @@
import React from "react";
import { Form, DatePicker, Modal, Radio } from "antd";
import {clientTypeMap} from "../../common/constants";
import BaseForm from "../../common/edit-form-base";

class EditClientForm extends BaseForm {


  initEditableData () {
    return {
      date: '',
      status: 1
    }
  }

  render() {
    const { visible, onCancel, onOk, form, confirmLoading } = this.props;
    const { getFieldDecorator } = form;
    const { date, status } = this.state.editableData;

    return (
        <Modal
            title="修改状态"
            visible={visible}
            onCancel={onCancel}
            onOk={onOk}
            destroyOnClose
            confirmLoading={confirmLoading}
        >
          <Form {...this.formItemLayout}>
            <Form.Item label="">
              {getFieldDecorator("status", {
                rules: [{ required: true, message: "请选择状态!" }],
                initialValue: status,
                onChange: this.handleFieldChange('status')
              })(<Radio.Group style={{marginLeft: '10px'}}>
                <Radio value={1}>在建</Radio>
                <Radio value={2}>完成</Radio>
              </Radio.Group>)}
            </Form.Item>
            {status === 2 && <Form.Item label="完成时间:">
              {getFieldDecorator("date", {
                rules: [{ required: true, message: "请选择完成时间!" }],
                initialValue: date,
                onChange: this.handleFieldChange('date')
              })(<DatePicker style={{marginLeft: '10px'}} placeholder="请选择完成时间" />)}
            </Form.Item>}
          </Form>
        </Modal>
    );
  }
}

export default Form.create({ name: "EditClientForm" })(EditClientForm);

 estate-frontend-v2024/src/views/business/onDuty.jsx

New file
@@ -0,0 +1,180 @@
import React from "react";
import { Button, Card, Divider, Select, Table, Modal } from "antd";
import { deleteDataProblem, getBusinessDataProbList } from "@/api/business";
import "../business/style/clientInfo.less";
import {
  errorLevelMap,
  errorReviewStateMap,
  riskLevelMap,
} from "../common/constants";
import CorrectPractice from "./correctPractice";
import EditDataProblemForm from "./forms/edit-dataProblem-form";
import EditDataPForm from "./forms/edit-dataP-form";

import { formatDeletedString } from "../common/common_func";
import ImagePreview from "./components/imagePreview";
import ImagePreviewView from "./components/imagePreview";
import Spacer from "../common/components/Spacer";
import { includePermission } from "../../utils/auth";
import { exportDataProblem } from "../../api/export";

const { Column } = Table;
const { Option } = Select;
const axios = require("axios");

class OnDuty extends CorrectPractice {
  moduleName = "errorRecord";

  getEntityList(pageInfo, listBody) {
    return getBusinessDataProbList(pageInfo, listBody);
  }

  deleteEntities(ids) {
    return deleteDataProblem(ids);
  }

  async exportEntities(listBody) {
    return exportDataProblem(listBody);
  }

  handleEditAssignee = (row) => {
    this.setState({
      currentRowData: JSON.parse(JSON.stringify(row)),
      editDataPModalVisible: true,
      editDataPModalLoading: false,
    });
  };

  handleEditDataPCancel = (row) => {
    this.setState({
      editDataPModalVisible: false,
      editDataPModalLoading: false,
    });
  };

  render() {
    const { entities } = this.state;
    const title = this.getTitle();
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            rowSelection={{
              type: "checkbox",
              selectedRowKeys: this.state.selectedRowKeys,
              onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                  selectedEntities: selectedRows,
                  selectedRowKeys: selectedRowKeys,
                });
              },
            }}
            dataSource={entities}
            pagination={false}
            scroll={{ x: "100%" }}
          >
            <Column
              title="计划名称"
              key="planName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.planName)}</span>
              )}
            />
            <Column
              title="项目"
              key="projectName"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{formatDeletedString(row.projectName)}</span>
              )}
            />
            <Column
              title="检查内容"
              key="projectName"
              align="center"
              ellipsis={true}
            />
            <Column
              title="岗位"
              key="hierarchyName"
              dataIndex="hierarchyName"
              align="center"
              ellipsis={true}
            />
            <Column
              title="问题备注"
              key="problemPart"
              align="center"
              dataIndex="problemPart"
              ellipsis={true}
            />
            <Column
              title="图片"
              dataIndex="problem.info"
              key="problem.info"
              align="center"
              ellipsis={true}
            />
            <Column
              title="检查时间"
              key="creator.name"
              align="center"
              dataIndex="creator.name"
              ellipsis={true}
            />
            <Column
              title="在岗情况"
              key="creator.name"
              align="center"
              dataIndex="creator.name"
              ellipsis={true}
            />
            <Column
              title="操作"
              key="action"
              width={160}
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>
                  <Button
                    title="详情"
                    hidden={!includePermission(this.moduleName + ":edit")}
                    onClick={this.handleEditEntity.bind(null, row)}
                  >
                    详情
                  </Button>
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <Modal
          title="在岗情况"
          visible={this.state.editModalVisible}
          onCancel={this.handleEditEntityCancel}
        >
            <div className="detail">
                <div>计划名称：xxx</div>
                <div>项目：xxx</div>
                <div>检查内容：xxx</div>
                <div>岗位：xxx</div>
                <div>问题备注：</div>
                <div>在岗情况：</div>
                <div>检查时间：</div>
                <div>图片：</div>
            </div>
        </Modal>
      </div>
    );
  }
}

export default OnDuty;

 estate-frontend-v2024/src/views/business/projects.jsx

@@ -1,10 +1,13 @@
import React from "react";
import { Button, Card, Icon, Input, Select, Table } from "antd";
import { deleteProject, editProject, getProjectList } from "@/api/projects"
import { deleteProject, editProject, getProjectList } from "@/api/projects";
import ProjectInfo from "./components/projectInfo";
import EditProjectForm from "./forms/edit-project-form";
import './style/projects.less'
import './style/clientInfo.less'
import EditProjectPermissionForm from "./forms/edit-projectPermission-form";
import EditProjectStatusForm from "./forms/edit-projectStatus-form";

import "./style/projects.less";
import "./style/clientInfo.less";
import { projectTypeMap, projectUsageTypeMap } from "../common/constants";
import CompanyCollectionModal from "./components/companyCollectionModal";
import CrudViewBase from "../common/crud-view-base";
@@ -14,270 +17,426 @@
import { includePermission } from "../../utils/auth";
import { getClientOptions } from "../../api/business";
import { toOptionsData } from "../common/common_func";
import { exportPlan, exportProject, downloadProjectTemplate, importProject } from "../../api/export";
import {
  exportPlan,
  exportProject,
  downloadProjectTemplate,
  importProject,
} from "../../api/export";

const { Column } = Table;
const { Option } = Select;
const inputLongStyle = {
    padding: '1px 10px',
    width: '250px'
}
  padding: "1px 10px",
  width: "250px",
};

class Projects extends CrudViewBase {
  initListBody() {
    return {
      keyword: "",
      clientIds: null,
      projectTypes: null,
    };
  }

    initListBody() {
        return {
            keyword: '',
            clientIds: null,
            projectTypes: null
        }
    }
  initView() {
    this.getClientOptionsFunc();
    this.setState({
      clientOptions: [],
    });
  }

    initView() {
        this.getClientOptionsFunc()
  getClientOptionsFunc() {
    getClientOptions().then((res) => {
      if (res.data.status === "OK") {
        this.setState({
            clientOptions: []
        })
    }
          clientOptions: toOptionsData(res.data.data),
        });
      }
    });
  }

    getClientOptionsFunc() {
        getClientOptions().then(res => {
            if (res.data.status === 'OK') {
  getEntityList(pageInfo, listBody) {
    return getProjectList(pageInfo, listBody);
  }

  editEntity(data, isEdit) {
    return editProject(data, isEdit);
  }

  deleteEntities(ids) {
    return deleteProject(ids);
  }

  async exportEntities(listBody) {
    return exportProject(listBody);
  }

  // 下载导入模板
  downloadTemplate = () => {
    return downloadProjectTemplate();
  };

  // 上传文件并导入
  importEntities = (info) => {
    return importProject(info.file);
  };

  openCompanyInfo = (row) => {
    this.setState({
      currentRowData: row,
      showCompanyInfo: true,
    });
  };

  openProjectDetail = (row) => {
    this.setState({
      currentRowData: row,
      showProjectDetail: true,
    });
  };

  openProjectInfo = (row) => {
    this.setState({
      currentRowData: row,
      showProjectInfo: true,
    });
  };

  openProjectStatusSetting = (row) => {
    this.setState({
      currentRowData: row,
      showProjectStatusSetting: true,
    });
  };

  handleProjectStatusSettingCancel = () => {
    this.setState({
      showProjectStatusSetting: false,
      currentRowData: null,
    });
  };

  openPermissionSetting = (row) => {
    this.setState({
      currentRowData: row,
      showPermissionSetting: true,
    });
  };

  handlePermissionSettingCancel = () => {
    this.setState({
      showPermissionSetting: false,
      currentRowData: null,
    });
  };

  openDeviceUsage = (row) => {
    this.setState({
      currentRowData: row,
      showDeviceUsage: true,
    });
  };

  handleCompanyInfoCancel = () => {
    this.setState({
      showCompanyInfo: false,
      currentRowData: null,
    });
  };

  handleProjectDetailCancel = () => {
    this.setState({
      showProjectDetail: false,
      currentRowData: null,
    });
  };

  handleProjectInfoCancel = () => {
    this.setState({
      showProjectInfo: false,
      currentRowData: null,
    });
  };

  handleDeviceUsageCancel = () => {
    this.setState({
      showDeviceUsage: false,
      currentRowData: null,
    });
  };

  handlePermissionSettingOk = (formData) => {
    
  };

  handleStatusSettingOk = (formData) => {
  };

  render() {
    const { entities } = this.state;
    const title = (
      <div className="flex title">
        <div>
          <Input
            style={inputLongStyle}
            placeholder="请输入关键字"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
          &nbsp;
          <Select
            style={{
              width: 250,
            }}
            placeholder="项目类型"
            allowClear
            mode="multiple"
            onChange={(value) => {
              this.handleListBodyChange("projectTypes", value);
            }}
          >
            {projectTypeMap.toOptions().map((item, index) => (
              <Option value={item.value} key={index}>
                {item.label}
              </Option>
            ))}
          </Select>
          &nbsp; &nbsp;
          <Select
            style={{
              width: 250,
            }}
            placeholder="委托方"
            allowClear
            mode="multiple"
            onChange={(value) => {
              this.handleListBodyChange("clientIds", value);
            }}
          >
            {this.state.clientOptions &&
              this.state.clientOptions.map((item, index) => (
                <Option value={item.value} key={item.value}>
                  {item.label}
                </Option>
              ))}
          </Select>
        </div>
        &nbsp; &nbsp;
        <div className="right">
          {this.renderImportButton()}
          &nbsp; &nbsp;
          {this.renderExportButton()}
          &nbsp; &nbsp;
          {this.renderAddButton("project:add")}
          &nbsp; &nbsp;
          {this.renderBatchDeleteButton("project:delete")}
        </div>
      </div>
    );
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            rowSelection={{
              type: "checkbox",
              selectedRowKeys: this.state.selectedRowKeys,
              onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                    clientOptions: toOptionsData(res.data.data)
                })
            }
        })
    }

    getEntityList(pageInfo, listBody) {
        return getProjectList(pageInfo, listBody)
    }

    editEntity(data, isEdit) {
        return editProject(data, isEdit)
    }

    deleteEntities(ids) {
        return deleteProject(ids)
    }

    async exportEntities(listBody) {
        return exportProject(listBody)
    }

    // 下载导入模板
    downloadTemplate = () => {
        return downloadProjectTemplate()
    }

    // 上传文件并导入
    importEntities = (info) => {
        return importProject(info.file)
    }

    openCompanyInfo = (row) => {
        this.setState({
            currentRowData: row,
            showCompanyInfo: true
        })
    }

    openProjectDetail = (row) => {
        this.setState({
            currentRowData: row,
            showProjectDetail: true
        })
    }

    openProjectInfo = (row) => {
        this.setState({
            currentRowData: row,
            showProjectInfo: true
        })
    }

    openDeviceUsage = (row) => {
        this.setState({
            currentRowData: row,
            showDeviceUsage: true
        })
    }

    handleCompanyInfoCancel = () => {
        this.setState({
            showCompanyInfo: false,
            currentRowData: null
        })
    }

    handleProjectDetailCancel = () => {
        this.setState({
            showProjectDetail: false,
            currentRowData: null
        })
    }

    handleProjectInfoCancel = () => {
        this.setState({
            showProjectInfo: false,
            currentRowData: null
        })
    }

    handleDeviceUsageCancel = () => {
        this.setState({
            showDeviceUsage: false,
            currentRowData: null
        })
    }

    render() {
        const { entities } = this.state
        const title = (
            <div className="title flex">
                <div>
                    <Input
                        style={inputLongStyle}
                        placeholder="请输入关键字"
                        onChange={
                            (e) => {
                                this.handleListBodyChange('keyword', e.target.value)
                            }}
                        prefix={<Icon style={{ marginLeft: '4px' }} type="search" />}
                        allowClear
                    />
                    &nbsp;
                    <Select
                        style={{
                            width: 250,
                        }}
                        placeholder="项目类型"
                        allowClear
                        mode="multiple"
                        onChange={
                            (value) => {
                                this.handleListBodyChange('projectTypes', value)
                            }}
                    >
                        {projectTypeMap.toOptions().map((item, index) => (
                            <Option value={item.value} key={index}>{item.label}</Option>
                        ))}
                    </Select>
                    &nbsp;
                    &nbsp;
                    <Select
                        style={{
                            width: 250,
                        }}
                        placeholder="委托方"
                        allowClear
                        mode="multiple"
                        onChange={
                            (value) => {
                                this.handleListBodyChange('clientIds', value)
                            }
                        }
                    >
                        {this.state.clientOptions && this.state.clientOptions.map((item, index) => (
                            <Option value={item.value} key={item.value}>{item.label}</Option>
                        ))}
                    </Select>
                  selectedEntities: selectedRows,
                  selectedRowKeys: selectedRowKeys,
                });
              },
            }}
            dataSource={entities}
            scroll={{ x: "100%" }}
            pagination={false}
          >
            <Column
              title="序号"
              dataIndex="id"
              key="id"
              align="center"
              ellipsis={true}
            />
            <Column
              title="项目名称"
              dataIndex="name"
              key="name"
              align="center"
              width={300}
              ellipsis={true}
            />
            <Column
              title="委托方"
              key="client.name"
              dataIndex="client.name"
              width={150}
              align="center"
              ellipsis={true}
            />
            <Column
              title="项目类型"
              key="type"
              align="center"
              ellipsis={true}
              render={(text, row) => <span>{projectTypeMap[row.type]}</span>}
            />
            <Column
              title="用途类型"
              key="usageType"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{projectUsageTypeMap[row.usageType]}</span>
              )}
            />
            <Column
              title="状态"
              key="status"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <span>{row.status === 1 ? "在建" : "完成"}</span>
              )}
            />
            <Column
              title="单位集合"
              key="companyInfo"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <div
                  className="link-btn"
                  onClick={this.openCompanyInfo.bind(null, row)}
                >
                  点击查看
                </div>
                &nbsp;
                &nbsp;
                <div className="right">
                    {this.renderImportButton()}
                    &nbsp;
                    &nbsp;
                    {this.renderExportButton()}
                    &nbsp;
                    &nbsp;
                    {this.renderAddButton("project:add")}
                    &nbsp;
                    &nbsp;
                    {this.renderBatchDeleteButton("project:delete")}
              )}
            />
            <Column
              title="信息集合"
              key="projectDetail"
              align="center"
              ellipsis={true}
              render={(text, row) => (
                <div
                  className="link-btn"
                  onClick={this.openProjectDetail.bind(null, row)}
                >
                  点击查看
                </div>
            </div>
        )
        return (
            <div className="app-container">
                <Card title={title}>
                    <Table
                        bordered
                        rowKey="id"
                        rowSelection={{
                            type: 'checkbox',
                            selectedRowKeys: this.state.selectedRowKeys,
                            onChange: (selectedRowKeys, selectedRows) => {
                                this.setState({
                                    selectedEntities: selectedRows,
                                    selectedRowKeys: selectedRowKeys
                                })
                            },
                        }}
                        dataSource={entities}
                        scroll={{ x: '100%' }}
                        pagination={false}>
                        <Column title="序号" dataIndex="id" key="id" align="center" ellipsis={true} />
                        <Column title="项目名称" dataIndex="name" key="name" align="center" width={300} ellipsis={true} />
                        <Column title="委托方" key="client.name" dataIndex="client.name" width={150} align="center" ellipsis={true} />
                        <Column title="项目类型" key="type" align="center" ellipsis={true} render={(text, row) => (
                            <span>{projectTypeMap[row.type]}</span>
                        )} />
                        <Column title="用途类型" key="usageType" align="center" ellipsis={true} render={(text, row) => (
                            <span>{projectUsageTypeMap[row.usageType]}</span>
                        )} />
                        <Column title="单位集合" key="companyInfo" align="center" ellipsis={true} render={(text, row) => (
                            <div className="link-btn" onClick={this.openCompanyInfo.bind(null, row)}>点击查看</div>
                        )} />
                        <Column title="信息集合" key="projectDetail" align="center" ellipsis={true} render={(text, row) => (
                            <div className="link-btn" onClick={this.openProjectDetail.bind(null, row)}>点击查看</div>
                        )} />
                        {/*<Column title="施工许可证号" key="constructionLicense" ellipsis={true} dataIndex="constructionLicense"*/}
                        {/*        align="center"/>*/}
                        {/*<Column title="工程造价(万元)" dataIndex="projectCost" key="projectCost" align="center" ellipsis={true}/>*/}
                        <Column title="最近一次检查时间" key="updateTime" align="center" ellipsis={true} />
                        <Column title="操作" key="action" width={420} align="center"
                            render={(text, row) => (
                                <span>
                                    {this.renderEditButton(row, "project:edit")}
                                    <Spacer />
                                    {this.renderDeleteButton(row, "project:delete")}
                                    <Spacer />
                                    <Button title="设备信息" onClick={this.openDeviceUsage.bind(null, row)} hidden={!includePermission("deviceUsage:*")} >设备信息</Button>
                                    <Spacer />
                                    <Button title="项目信息" onClick={this.openProjectInfo.bind(null, row)} hidden={!includePermission("projectInfo:*")}>项目信息</Button>
                                </span>
                            )} />
                    </Table>
                    <br />
                    {this.renderPagination()}
                </Card>
                <CompanyCollectionModal visible={this.state.showCompanyInfo}
                    currentRowData={this.state.currentRowData}
                    onCancel={this.handleCompanyInfoCancel} />
                <ProjectDetail visible={this.state.showProjectDetail}
                    currentRowData={this.state.currentRowData}
                    onCancel={this.handleProjectDetailCancel} />
              )}
            />
            {/*<Column title="施工许可证号" key="constructionLicense" ellipsis={true} dataIndex="constructionLicense"*/}
            {/*        align="center"/>*/}
            {/*<Column title="工程造价(万元)" dataIndex="projectCost" key="projectCost" align="center" ellipsis={true}/>*/}
            <Column
              title="最近一次检查时间"
              key="updateTime"
              align="center"
              ellipsis={true}
            />
            <Column
              title="操作"
              key="action"
              width={400}
              align="center"
              render={(text, row) => (
                <span>
                  {this.renderEditButton(row, "project:edit")}
                  <Spacer />
                  {this.renderDeleteButton(row, "project:delete")}
                  <Spacer />
                  <Button
                    title="设备信息"
                    onClick={this.openDeviceUsage.bind(null, row)}
                    hidden={!includePermission("deviceUsage:*")}
                  >
                    设备信息
                  </Button>
                  <Spacer />
                  <Button
                    title="项目信息"
                    onClick={this.openProjectInfo.bind(null, row)}
                    hidden={!includePermission("projectInfo:*")}
                  >
                    项目信息
                  </Button>
                  <Spacer />
                  <Button
                    title="权限设置"
                    style={{ marginTop: "10px" }}
                    onClick={this.openPermissionSetting.bind(null, row)}
                    hidden={!includePermission("projectInfo:*")}
                  >
                    权限设置
                  </Button>
                  <Spacer />
                  <Button
                    title="修改状态"
                    onClick={this.openProjectStatusSetting.bind(null, row)}
                    hidden={!includePermission("projectInfo:*")}
                  >
                    修改状态
                  </Button>
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <CompanyCollectionModal
          visible={this.state.showCompanyInfo}
          currentRowData={this.state.currentRowData}
          onCancel={this.handleCompanyInfoCancel}
        />
        <ProjectDetail
          visible={this.state.showProjectDetail}
          currentRowData={this.state.currentRowData}
          onCancel={this.handleProjectDetailCancel}
        />

                <ProjectInfo visible={this.state.showProjectInfo}
                    currentRowData={this.state.currentRowData}
                    onCancel={this.handleProjectInfoCancel} />
                <DeviceUsage visible={this.state.showDeviceUsage}
                    currentRowData={this.state.currentRowData}
                    onCancel={this.handleDeviceUsageCancel} />
                <EditProjectForm
                    currentRowData={this.state.currentRowData}
                    wrappedComponentRef={formRef => this.editFormRef = formRef}
                    visible={this.state.editModalVisible}
                    confirmLoading={this.state.editModalLoading}
                    onCancel={this.handleEditEntityCancel}
                    onOk={this.handleEditEntityOk}
                />
            </div>
        );
    }
        <ProjectInfo
          visible={this.state.showProjectInfo}
          currentRowData={this.state.currentRowData}
          onCancel={this.handleProjectInfoCancel}
        />
        <DeviceUsage
          visible={this.state.showDeviceUsage}
          currentRowData={this.state.currentRowData}
          onCancel={this.handleDeviceUsageCancel}
        />
        <EditProjectForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
          onOk={this.handleEditEntityOk}
        />
        <EditProjectPermissionForm
          currentRowData={this.state.currentRowData}
          visible={this.state.showPermissionSetting}
          onCancel={this.handlePermissionSettingCancel}
          onOk={this.handlePermissionSettingOk}
        />
        <EditProjectStatusForm
          currentRowData={this.state.currentRowData}
          visible={this.state.showProjectStatusSetting}
          onCancel={this.handleProjectStatusSettingCancel}
          onOk={this.handleStatusSettingOk}
        />
      </div>
    );
  }
}

export default Projects;

 estate-frontend-v2024/src/views/business/style/clientParams.less

New file
@@ -0,0 +1,29 @@
.container {
    padding-top: 24px;
    .item {
        display: flex;
        align-items: center;
        margin-bottom: 10px;
    }
    .label {
        width: 100px;
        text-align: right;
    }
    .value {
        .value-input {
            width: 160px;
            margin-left: 16px;
        }
    }
    .footerValue {
        display: flex;
        align-items: center;
        .value-input {
            width: 160px;
            margin-left: 16px;
        }
        >div:last-child {
            margin-left: 24px;
        }
    }
}

 estate-frontend-v2024/src/views/common/crud-view-base.jsx

@@ -20,6 +20,14 @@
        selectedEntities: [],
        selectedRowKeys: [],

        // 重置密码模态框
        resetPasswordModalVisible: false,
        resetPasswordModalLoading: false,

        // 参数设置模态框
        parameterSettingModalVisible: false,
        parameterSettingModalLoading: false,

        // 编辑模态框
        editModalVisible: false,
        editModalLoading: false,
@@ -37,6 +45,12 @@

    // 编辑表单的引用
    editFormRef = null;

    // 重置密码表单的引用
    resetPasswordFormRef = null;

    // 参数设置表单的引用
    parameterSettingFormRef = null;

    // 组件挂载
    componentDidMount() {
@@ -144,6 +158,41 @@
            this.reloadEntities()
        })
    }

    // 处理启用禁用实体
    handleEnableDisableEntity = (row) => {
        
    };

    // 处理参数设置实体
    handleParameterSettingEntity = (row) => {
        this.setState({
            currentRowData: JSON.parse(JSON.stringify(row)),
            parameterSettingModalVisible: true,
        });
    };

    // 处理参数设置实体取消
    handleParameterSettingEntityCancel = _ => {
        this.setState({
            parameterSettingModalVisible: false,
        });
    };

    // 处理重置密码按钮实体
    handleResetPasswordEntity = (row) => {
        this.setState({
            currentRowData: JSON.parse(JSON.stringify(row)),
            resetPasswordModalVisible: true,
        });
    };

    // 处理重置密码实体取消
    handleResetPasswordEntityCancel = _ => {
        this.setState({
            resetPasswordModalVisible: false,
        });
    };

    // 处理编辑实体
    handleEditEntity = (row) => {
@@ -268,7 +317,7 @@
            if (err) {
                return;
            }

            console.log(this.editFormRef.state)
            this.setState({ editModalLoading: true, });
            let formState = this.editFormRef.state
            let action = formState.isEdit ? '编辑' : '添加';
@@ -296,6 +345,53 @@
    onEditSuccess = () => {
    }

    // 处理参数设置实体确认
    handleParameterSettingEntityOk = _ => {
        const { form } = this.parameterSettingFormRef.props;
        form.validateFields((err) => {
            if (err) {
                return;
            }
            console.log(this.parameterSettingFormRef.state)
            this.setState({ parameterSettingModalLoading: true, });
            let formState = this.parameterSettingFormRef.state
        });
    };

    // 处理参数设置实体成功
    onParameterSettingSuccess = () => {
    }

    // 渲染禁用/启用按钮
    renderEnableDisableButton(row, permission = null, disable = false) {
        return (
            <Button title={row.state === 1 ? "禁用" : "启用"} onClick={this.handleEnableDisableEntity.bind(null, row)}
                disabled={disable} hidden={!includePermission(permission)}>
                {row.state === 1 ? "禁用" : "启用"}
            </Button>
        );
    }

    // 渲染重置密码按钮
    renderResetPasswordButton(row, permission = null, disable = false) {
        return (
            <Button title="重置密码" onClick={this.handleResetPasswordEntity.bind(null, row)}
                disabled={disable} hidden={!includePermission(permission)}>
                重置密码
            </Button>
        );
    }

      // 渲染参数设置按钮
    renderParameterSettingButton(row, permission = null, disable = false) {
        return (
            <Button title="参数设置" onClick={this.handleParameterSettingEntity.bind(null, row)}
                disabled={disable} hidden={!includePermission(permission)}>
                参数设置
            </Button>
        );
    }

    // 渲染编辑按钮
    renderEditButton(row, permission = null, disable = false) {
        return (

 estate-frontend-v2024/src/views/layout/Header/index.jsx

@@ -1,7 +1,17 @@
import React from "react";
import React, { useState } from "react";
import { connect } from "react-redux";
import { useHistory } from 'react-router-dom';
import { Icon, Menu, Dropdown, Modal, Layout, Avatar } from "antd";
import { useHistory } from "react-router-dom";
import {
  Icon,
  Menu,
  Dropdown,
  Modal,
  Layout,
  Avatar,
  Tabs,
  Radio,
  Input,
} from "antd";
import { Link } from "react-router-dom";
import { logout, getUserInfo } from "@/store/actions";
import FullScreen from "@/components/FullScreen";
@@ -10,6 +20,8 @@
import BreadCrumb from "@/components/BreadCrumb";
import "./index.less";
const { Header } = Layout;
const { TabPane } = Tabs;
const { Search } = Input;

const LayoutHeader = (props) => {
  const history = useHistory();
@@ -22,6 +34,7 @@
    showSettings,
    fixedHeader,
  } = props;
  const [visible, setVisible] = useState(false);
  // token && getUserInfo(token);
  const handleLogout = (token) => {
    Modal.confirm({
@@ -44,19 +57,15 @@
    }
  };
  const goToPersonal = () => {
    history.push('/personal')
  }
    history.push("/personal");
  };
  const menu = (
    <Menu onClick={onClick}>
      <Menu.Item key="dashboard">
        <Link to="/dashboard">智慧大屏</Link>
      </Menu.Item>
      <Menu.Item key="project">
        <a
          onClick={goToPersonal}
        >
          个人信息
        </a>
        <a onClick={goToPersonal}>个人信息</a>
      </Menu.Item>
      <Menu.Divider />
      <Menu.Item key="logout">注销</Menu.Item>
@@ -81,6 +90,20 @@
    }
    return styles;
  };

  const accountList = [
    {
      id: 1,
      name: "委托方1",
    },
    {
      id: 2,
      name: "委托方2",
    },
  ];

  const [selectedAccount, setSelectedAccount] = useState("");

  return (
    <>
      {/* 这里是仿照antd pro的做法,如果固定header，
@@ -93,6 +116,14 @@
        <Hamburger />
        <BreadCrumb />
        <div className="right-menu">
          <div className="platform-name" onClick={() => setVisible(true)}>
            <Icon
              type="fund"
              theme="filled"
              style={{ fontSize: 24, marginRight: 8 }}
            />
            智慧工程安全监管平台
          </div>
          <FullScreen />
          {showSettings ? <Settings /> : null}
          <div className="dropdown-wrap">
@@ -105,6 +136,54 @@
          </div>
        </div>
      </Header>
      <Modal
        title="选择登录端口"
        visible={visible}
        width={450}
        onCancel={() => setVisible(false)}
        onOk={() => setVisible(false)}
      >
        <Tabs defaultActiveKey="1">
          <TabPane tab="委托方" key="1">
            <div className="box">
              <Search
                placeholder="请输入委托方名称"
                enterButton="搜索"
                onSearch={(value) => console.log(value)}
              />
              {accountList.map((item) => (
                <div
                  key={item.id}
                  className="item"
                  onClick={() => setSelectedAccount(item.id)}
                >
                  <div className="name">{item.name}</div>
                  <Radio checked={selectedAccount === item.id} />
                </div>
              ))}
            </div>
          </TabPane>
          <TabPane tab="项目" key="2">
            <div className="box">
               <Search
                placeholder="请输入项目名称"
                enterButton="搜索"
                onSearch={(value) => console.log(value)}
              />
              {accountList.map((item) => (
                <div
                  key={item.id}
                  className="item"
                  onClick={() => setSelectedAccount(item.id)}
                >
                  <div className="name">{item.name}</div>
                  <Radio checked={selectedAccount === item.id} />
                </div>
              ))}
            </div>
          </TabPane>
        </Tabs>
      </Modal>
    </>
  );
};

 estate-frontend-v2024/src/views/layout/Header/index.less

@@ -7,6 +7,16 @@
  box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
  .right-menu {
    float: right;
    .platform-name {
      display: inline-flex;
      align-items: center;
      font-size: 16px;
      font-weight: 500;
      color: #303133;
      margin-right: 24px;
      vertical-align: middle;
      cursor: pointer;
    }
    .dropdown-wrap {
      cursor: pointer;
      display: inline-block;
@@ -28,3 +38,18 @@
  top: 0;
  right: 0;
}

.box {
  padding: 0 20px;
  .item {
    width: 100%;
    padding: 0 20px;
    margin-top: 16px;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 36px;
    cursor: pointer;
  }
}

 estate-frontend-v2024/src/views/screenSetting/accidentMessageSetting.jsx

New file
@@ -0,0 +1,215 @@
import React from "react";
import { Card, Divider, Icon, Input, Select, Table } from "antd";
import { deleteDevice, editDevice, getDevicesList } from "@/api/devices";
import EditAccountMessageForm from "./forms/edit-accidentMessage-form";
import "./style/index.less";
import CrudViewBase from "../common/crud-view-base";

const { Column } = Table;
const { Option } = Select;
const inputLongStyle = {
  padding: "1px 10px",
  width: "250px",
};

class AccidentMessageSetting extends CrudViewBase {
  state = {
    ...this.state,
    entities: [],
  };

  initListBody() {
    return {
      name: "",
      keyword: "",
      deviceType: "",
    };
  }

  // 重写处理listBody变化的方法，当deviceType变化时加载表单
  handleListBodyChange = (key, value) => {
    this.setState(
      (prevState) => {
        const newListBody = { ...prevState.listBody, [key]: value };

        return { listBody: newListBody };
      },
      () => {
        this.reloadEntities();
      }
    );
  };

  getEntityList(pageInfo, listBody) {
    return getDevicesList(pageInfo, listBody);
  }

  editEntity(data, isEdit) {
    return editDevice(data, isEdit);
  }

  deleteEntities(ids) {
    return deleteDevice(ids);
  }

  // 处理重置密码实体确认
  handleResetPasswordEntityOk = (_) => {
    const { form } = this.resetPasswordFormRef.props;
    form.validateFields((err) => {
      if (err) {
        return;
      }

      this.setState({ resetPasswordModalLoading: true });
      let formState = this.resetPasswordFormRef.state;
      console.log(formState.editableData);
      // this.editEntity(formState.editableData, formState.isEdit)
      //   .then((response) => {
      //     if (response.data.status === "OK") {
      //       form.resetFields();
      //       message.success(action + "成功!");
      //       this.setState({
      //         resetPasswordModalVisible: false,
      //         resetPasswordModalLoading: false,
      //       });
      //       this.onResetPasswordSuccess();
      //       this.reloadEntities();
      //     } else {
      //       this.setState({ resetPasswordModalLoading: false });
      //       message.success(response.data.errorMsg || action + "失败,请重试");
      //     }
      //   })
      //   .catch((e) => {
      //     message.success(action + "失败,请重试! " + e.message);
      //   });
    });
  };

  render() {
    const { entities } = this.state;
    const title = (
      <div className="flex title">
        <div>
          <Input
            style={inputLongStyle}
            placeholder="请输入姓名"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
          &nbsp;
          <Select
            style={{
              width: 250,
            }}
            placeholder="账号级别"
            onChange={(value) => {
              this.handleListBodyChange("deviceType", value);
            }}
          >
            <Option value={1}>委托方</Option>
            <Option value={2}>项目</Option>
          </Select>
          &nbsp; &nbsp;
        </div>
        &nbsp; &nbsp;
        <div className="right">{this.renderAddButton("device:add")}</div>
      </div>
    );
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            dataSource={entities}
            pagination={false}
            scroll={{ x: "max-content" }}
          >
            <Column
              title="序号"
              width={125}
              dataIndex="id"
              key="id"
              align="center"
            />
            <Column
              title="标题"
              width={125}
              dataIndex="name"
              key="name"
              align="center"
            />
            <Column
              title="事故类型"
              width={125}
              dataIndex="account"
              key="account"
              align="center"
            />
            <Column
              title="发生地点"
              width={125}
              dataIndex="accountType"
              key="accountType"
              align="center"
            />
            <Column
              title="伤亡情况"
              width={125}
              dataIndex="casualties"
              key="casualties"
              align="center"
            />
            <Column
              title="发生时间"
              dataIndex="date"
              key="date"
              align="center"
            />
            <Column
              title="状态"
              key="state"
              align="center"
              render={(text, row) => (
                <span style={{ color: row.state ? "yellow" : "inherit" }}>
                  {row.state ? "启用" : "禁用"}
                </span>
              )}
            />
            <Column
              title="操作"
              key="action"
              width={260}
              fixed="right"
              align="center"
              render={(text, row) => (
                <span>
                  {this.renderEnableDisableButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderEditButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderDeleteButton(row, "device:delete")}
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <EditAccountMessageForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
          onOk={this.handleEditEntityOk}
        />
      </div>
    );
  }
}

export default AccidentMessageSetting;

 estate-frontend-v2024/src/views/screenSetting/accidentTypeSetting.jsx

New file
@@ -0,0 +1,124 @@
import React from "react";
import { Card, Divider, Icon, Input, Table } from "antd";
import { deleteDevice, editDevice, getDevicesList } from "@/api/devices";
import EditAccidentTypeForm from "./forms/edit-accidentType-form";
import "./style/index.less";
import CrudViewBase from "../common/crud-view-base";

const { Column } = Table;
const inputLongStyle = {
  padding: "1px 10px",
  width: "250px",
};

class AccidentTypeSetting extends CrudViewBase {
  state = {
    ...this.state,
    entities: [],
  };

  initListBody() {
    return {
      keyword: "",
      deviceType: "",
    };
  }

  // 重写处理listBody变化的方法，当deviceType变化时加载表单
  handleListBodyChange = (key, value) => {
    this.setState(
      (prevState) => {
        const newListBody = { ...prevState.listBody, [key]: value };

        return { listBody: newListBody };
      },
      () => {
        this.reloadEntities();
      }
    );
  };

  getEntityList(pageInfo, listBody) {
    return getDevicesList(pageInfo, listBody);
  }

  editEntity(data, isEdit) {
    return editDevice(data, isEdit);
  }

  deleteEntities(ids) {
    return deleteDevice(ids);
  }

  render() {
    const { entities } = this.state;
    const title = (
      <div className="flex title">
        <div>
          <Input
            style={inputLongStyle}
            placeholder="请输入分类"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
        </div>
        &nbsp; &nbsp;
        <div className="right">{this.renderAddButton("device:add")}</div>
      </div>
    );
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            dataSource={entities}
            pagination={false}
            scroll={{ x: "max-content" }}
          >
            <Column
              title="序号"
              dataIndex="id"
              key="id"
              align="center"
            />
            <Column
              title="事故类型"
              dataIndex="name"
              key="name"
              align="center"
            />
            <Column
              title="操作"
              key="action"
              width={360}
              align="center"
              render={(text, row) => (
                <span>
                  {this.renderEditButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderDeleteButton(row, "device:delete")}
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <EditAccidentTypeForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
          onOk={this.handleEditEntityOk}
        />
      </div>
    );
  }
}

export default AccidentTypeSetting;

 estate-frontend-v2024/src/views/screenSetting/accountSetting.jsx

New file
@@ -0,0 +1,235 @@
import React from "react";
import { Card, Divider, Icon, Input, Select, Table } from "antd";
import {
  deleteDevice,
  editDevice,
  getDevicesList,
  loadDeviceForm,
} from "@/api/devices";
import EditAccountForm from "./forms/edit-account-form";
import ResetPasswordForm from "./forms/reset-password-form";

import "./style/index.less";
import CrudViewBase from "../common/crud-view-base";

const { Column } = Table;
const { Option } = Select;
const inputLongStyle = {
  padding: "1px 10px",
  width: "250px",
};

class AccountSetting extends CrudViewBase {
  state = {
    ...this.state,
    entities: [],
  };

  initListBody() {
    return {
      name: "",
      keyword: "",
      deviceType: "",
    };
  }

  // 重写处理listBody变化的方法，当deviceType变化时加载表单
  handleListBodyChange = (key, value) => {
    this.setState(
      (prevState) => {
        const newListBody = { ...prevState.listBody, [key]: value };

        return { listBody: newListBody };
      },
      () => {
        this.reloadEntities();
      }
    );
  };

  getEntityList(pageInfo, listBody) {
    return getDevicesList(pageInfo, listBody);
  }

  editEntity(data, isEdit) {
    return editDevice(data, isEdit);
  }

  deleteEntities(ids) {
    return deleteDevice(ids);
  }

  // 处理重置密码实体确认
  handleResetPasswordEntityOk = (_) => {
    const { form } = this.resetPasswordFormRef.props;
    form.validateFields((err) => {
      if (err) {
        return;
      }

      this.setState({ resetPasswordModalLoading: true });
      let formState = this.resetPasswordFormRef.state;
      console.log(formState.editableData);
      // this.editEntity(formState.editableData, formState.isEdit)
      //   .then((response) => {
      //     if (response.data.status === "OK") {
      //       form.resetFields();
      //       message.success(action + "成功!");
      //       this.setState({
      //         resetPasswordModalVisible: false,
      //         resetPasswordModalLoading: false,
      //       });
      //       this.onResetPasswordSuccess();
      //       this.reloadEntities();
      //     } else {
      //       this.setState({ resetPasswordModalLoading: false });
      //       message.success(response.data.errorMsg || action + "失败,请重试");
      //     }
      //   })
      //   .catch((e) => {
      //     message.success(action + "失败,请重试! " + e.message);
      //   });
    });
  };

  render() {
    const { entities } = this.state;
    const title = (
      <div className="flex title">
        <div>
          <Input
            style={inputLongStyle}
            placeholder="请输入姓名"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
          &nbsp;
          <Input
            style={inputLongStyle}
            placeholder="请输入委托方/项目名称"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
          &nbsp;
          <Select
            style={{
              width: 250,
            }}
            placeholder="账号级别"
            onChange={(value) => {
              this.handleListBodyChange("deviceType", value);
            }}
          >
            <Option value={1}>委托方</Option>
            <Option value={2}>项目</Option>
          </Select>
          &nbsp; &nbsp;
        </div>
        &nbsp; &nbsp;
        <div className="right">{this.renderAddButton("device:add")}</div>
      </div>
    );
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            dataSource={entities}
            pagination={false}
            scroll={{ x: "max-content" }}
          >
            <Column
              title="序号"
              width={125}
              dataIndex="id"
              key="id"
              align="center"
            />
            <Column
              title="姓名"
              width={125}
              dataIndex="name"
              key="name"
              align="center"
            />
            <Column
              title="账号"
              width={125}
              dataIndex="account"
              key="account"
              align="center"
            />
            <Column
              title="账号级别"
              width={125}
              dataIndex="accountType"
              key="accountType"
              align="center"
              render={(text, row) => (
                <span>{row.accountType === 1 ? "委托方" : "项目"}</span>
              )}
            />
            <Column title="关联委托方/项目" key="type" align="center" />
            <Column
              title="状态"
              key="state"
              align="center"
              render={(text, row) => (
                <span style={{ color: row.state ? "yellow" : "inherit" }}>
                  {row.state ? "启用" : "禁用"}
                </span>
              )}
            />
            <Column
              title="操作"
              key="action"
              width={400}
              fixed="right"
              align="center"
              render={(text, row) => (
                <span>
                  {this.renderEnableDisableButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderResetPasswordButton(row, "device:delete")}
                  <Divider type="vertical" />
                  {this.renderEditButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderDeleteButton(row, "device:delete")}
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <EditAccountForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
          onOk={this.handleEditEntityOk}
        />
        <ResetPasswordForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) =>
            (this.resetPasswordFormRef = formRef)
          }
          visible={this.state.resetPasswordModalVisible}
          confirmLoading={this.state.resetPasswordModalLoading}
          onCancel={this.handleResetPasswordEntityCancel}
          onOk={this.handleResetPasswordEntityOk}
        />
      </div>
    );
  }
}

export default AccountSetting;

 estate-frontend-v2024/src/views/screenSetting/forms/edit-accidentMessage-form.jsx

New file
@@ -0,0 +1,264 @@
import React from "react";
import {
  Form,
  Input,
  Modal,
  Select,
  DatePicker,
  Cascader,
  Switch,
  Upload,
  Icon,
} from "antd";
import "../style/index.less";
import moment from "moment/moment";
import { checkFileSize } from "../../common/common_func";
import EditFormBase from "../../common/edit-form-base";
import { inputLongStyle } from "../../common/constants";
import { EditorState, convertToRaw } from "draft-js";
import { Editor } from "react-draft-wysiwyg";
import draftToHtml from "draftjs-to-html";
import "react-draft-wysiwyg/dist/react-draft-wysiwyg.css";

const { Option } = Select;

function getBase64(file) {
  return new Promise((resolve, reject) => {
    const reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onload = () => resolve(reader.result);
    reader.onerror = error => reject(error);
  });
}

class EditAccountMessageForm extends EditFormBase {
  initEditableData() {
    return {
      title: "",
      type: 1,
      casualties: "",
      description: "",
      date: null,
      detail: "",
      status: 1,
      city: "",
      file: [],
      previewVisible: false,
      previewImage: "",
      editorState: EditorState.createEmpty(),
    };
  }

  onEditorStateChange = (editorState) => {
    this.setState({
      editableData: {
        ...this.state.editableData,
        editorState,
        detail: draftToHtml(convertToRaw(editorState.getCurrentContent())),
      },
    });
  };

  handleCancel = () =>
    this.setState({
      editableData: {
        ...this.state.editableData,
        previewVisible: false,
        previewImage: "",
      },
    });

  handlePreview = async (file) => {
    if (!file.url && !file.preview) {
      file.preview = await getBase64(file.originFileObj);
    }

    this.setState({
      editableData: {
        ...this.state.editableData,
        previewVisible: true,
        previewImage: file.url || file.preview,
      },
    });
  };

  render() {
    const { visible, onCancel, onOk, form } = this.props;
    const { getFieldDecorator } = form;
    const {
      title,
      type,
      casualties,
      description,
      date,
      detail,
      status,
      city,
      file,
      editorState,
      previewVisible,
      previewImage,
    } = this.state.editableData;

    const uploadButton = (
      <div>
        <Icon type="plus" />
      </div>
    );

    return (
      <Modal
        title={this.state.isEdit ? "编辑事故案例" : "添加事故案例"}
        visible={visible}
        onCancel={onCancel}
        width={1000}
        onOk={onOk}
        destroyOnClose
      >
        <Form
          labelCol={{ style: { width: "100%", height: "30px" } }}
          labelAlign="left"
        >
          <div className="grid grid-1-1-1">
            <Form.Item label="标题">
              {getFieldDecorator("title", {
                rules: [{ required: true, message: "请输入标题!" }],
                initialValue: title,
                onChange: this.handleFieldChange("title"),
              })(<Input style={inputLongStyle} placeholder="请输入标题" />)}
            </Form.Item>
            <Form.Item label="类别">
              {getFieldDecorator("type", {
                rules: [{ required: true, message: "请选择类别!" }],
                initialValue: type,
                onChange: this.handleFieldChange("type"),
              })(
                <Select style={inputLongStyle} placeholder="请选择关联委托方">
                  <Option value={1}>委托方1</Option>
                  <Option value={2}>委托方2</Option>
                </Select>,
              )}
            </Form.Item>
            <Form.Item label="发生城市">
              {getFieldDecorator("city", {
                initialValue: city,
                onChange: this.handleFieldChange("city"),
                rules: [{ required: true, message: "请选择发生城市！" }],
              })(
                <Cascader
                  style={{ width: "250px" }}
                  options={[
                    {
                      value: "1",
                      label: "北京",
                    },
                    {
                      value: "2",
                      label: "上海",
                    },
                  ]}
                  expandTrigger="hover"
                />,
              )}
            </Form.Item>
            <Form.Item label="造成伤亡情况">
              {getFieldDecorator("casualties", {
                rules: [{ required: true, message: "请选择启用状态!" }],
                initialValue: casualties,
                onChange: this.handleFieldChange("casualties"),
              })(
                <Input
                  style={inputLongStyle}
                  placeholder="请输入造成伤亡情况"
                />,
              )}
            </Form.Item>
            <Form.Item label="封面图">
              {getFieldDecorator("file", {
                valuePropName: "file",
                // getValueFromEvent: singleFile,
                initialValue: file,
                rules: [{ required: true, message: "请上传封面图" }],
              })(
                <div>
                  <Upload
                    disabled={this.uploading}
                    name={"file"}
                    maxCount={1}
                    listType="picture-card"
                    multiple={false}
                    customRequest={this.uploadAttachment.bind(null, "file")}
                    onRemove={() => {
                      this.setFieldValue("file", []);
                    }}
                    onPreview={this.handlePreview}
                    beforeUpload={checkFileSize}
                    accept="image/*"
                  >
                    {(!file || file.length === 0) ? uploadButton : null}
                  </Upload>
                  <Modal
                    visible={previewVisible}
                    footer={null}
                    onCancel={this.handleCancel}
                  >
                    <img
                      alt="example"
                      style={{ width: "100%" }}
                      src={previewImage}
                    />
                  </Modal>
                </div>,
              )}
            </Form.Item>
            <Form.Item label="情况简述">
              {getFieldDecorator("description", {
                rules: [{ required: true, message: "请输入情况简述!" }],
                initialValue: description,
                onChange: this.handleFieldChange("description"),
              })(<Input style={inputLongStyle} placeholder="请输入情况简述" />)}
            </Form.Item>
            <Form.Item label="发生时间">
              {getFieldDecorator("date", {
                rules: [{ required: true, message: "请输入日期" }],
                initialValue: date ? moment(date) : null,
                onChange: this.handleDateFieldChange("date"),
              })(
                <DatePicker style={{ width: "250px" }} format={"YYYY-MM-DD"} />,
              )}
            </Form.Item>
          </div>
          <Form.Item label="详情">
            {getFieldDecorator("detail", {
              rules: [{ required: true, message: "请输入详情" }],
              initialValue: detail,
              onChange: this.handleFieldChange("detail"),
            })(
              <div style={{ marginTop: 10 }}>
                <Editor
                  editorState={editorState}
                  onEditorStateChange={this.onEditorStateChange}
                  wrapperClassName="wrapper-class"
                  editorClassName="editor-class"
                  toolbarClassName="toolbar-class"
                  localization={{ locale: "zh" }}
                />
              </div>,
            )}
          </Form.Item>
          <Form.Item label="启用状态">
            {getFieldDecorator("status", {
              rules: [{ required: true, message: "请选择启用状态!" }],
              initialValue: status,
              onChange: this.handleFieldChange("status"),
            })(<Switch checked={status === 1} />)}
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditAccountMessageForm" })(
  EditAccountMessageForm,
);

 estate-frontend-v2024/src/views/screenSetting/forms/edit-accidentType-form.jsx

New file
@@ -0,0 +1,40 @@
import React from "react";
import { Form, Input, Modal } from "antd";
import "../style/index.less";
import EditFormBase from "../../common/edit-form-base";
import { inputLongStyle } from "../../common/constants";

class EditDeviceForm extends EditFormBase {
  initEditableData() {
    return {
      name: "",
    };
  }

  render() {
    const { visible, onCancel, onOk, form } = this.props;
    const { getFieldDecorator } = form;
    const { name } = this.state.editableData;
    return (
      <Modal
        title={this.state.isEdit ? "编辑分类" : "添加分类"}
        visible={visible}
        onCancel={onCancel}
        onOk={onOk}
        destroyOnClose
      >
        <Form {...this.formItemLayout}>
          <Form.Item label="分类名称">
            {getFieldDecorator("name", {
              rules: [{ required: true, message: "请输入分类名称!" }],
              initialValue: name,
              onChange: this.handleFieldChange("name"),
            })(<Input style={inputLongStyle} placeholder="请输入分类名称" />)}
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditDeviceForm" })(EditDeviceForm);

 estate-frontend-v2024/src/views/screenSetting/forms/edit-account-form.jsx

New file
@@ -0,0 +1,96 @@
import React from "react";
import { Form, Input, Modal, Select, Switch, Radio } from "antd";
import "../style/index.less";
import EditFormBase from "../../common/edit-form-base";
import {  inputLongStyle } from "../../common/constants";

const { Option } = Select;

class EditDeviceForm extends EditFormBase {
  initEditableData() {
    return {
      name: "",
      type: 1,
      status: 1,
      accountType: 1,
      account: "",
      password: "",
    };
  }

  render() {
    const { visible, onCancel, onOk, form } = this.props;
    const { getFieldDecorator } = form;
    const { name, status, account, password, type, accountType } = this.state.editableData;
    return (
      <Modal
        title={this.state.isEdit ? "编辑账号" : "添加账号"}
        visible={visible}
        onCancel={onCancel}
        onOk={onOk}
        destroyOnClose
      >
        <Form {...this.formItemLayout}>
          <Form.Item label="姓名">
            {getFieldDecorator("name", {
              rules: [{ required: true, message: "请输入姓名!" }],
              initialValue: name,
              onChange: this.handleFieldChange("name"),
            })(<Input style={inputLongStyle} placeholder="请输入姓名" />)}
          </Form.Item>
          <Form.Item label="级别">
            {getFieldDecorator("type", {
              rules: [{ required: true, message: "请选择级别!" }],
              initialValue: type,
              onChange: this.handleFieldChange("type"),
            })(
              <Radio.Group style={inputLongStyle}>
                <Radio value={1}>委托方</Radio>
                <Radio value={2}>项目</Radio>
              </Radio.Group>
            )}
          </Form.Item>
          <Form.Item label="关联委托方">
            {getFieldDecorator("accountType", {
              rules: [{ required: true, message: "请选择关联委托方!" }],
              initialValue: accountType,
              onChange: this.handleFieldChange("accountType"),
            })(
              <Select style={inputLongStyle} mode="multiple" placeholder="请选择关联委托方">
                <Option value={1}>委托方1</Option>
                <Option value={2}>委托方2</Option>
              </Select>
            )}
          </Form.Item>
          <Form.Item label="启用状态">
            {getFieldDecorator("status", {
              rules: [{ required: true, message: "请选择启用状态!" }],
              initialValue: status,
              onChange: this.handleFieldChange("status"),
            })(<Switch checked={status === 1} />)}
          </Form.Item>
          {!this.state.isEdit && (
            <Form.Item label="登录账号">
              {getFieldDecorator("account", {
                rules: [{ required: true, message: "请输入登录账号!" }],
                initialValue: account,
                onChange: this.handleFieldChange("account"),
              })(<Input style={inputLongStyle} placeholder="请输入登录账号" />)}
            </Form.Item>
          )}
          {!this.state.isEdit && (
            <Form.Item label="密码">
              {getFieldDecorator("password", {
                rules: [{ required: true, message: "请输入密码!" }],
                initialValue: password,
                onChange: this.handleFieldChange("password"),
              })(<Input style={inputLongStyle} placeholder="请输入密码" />)}
            </Form.Item>
          )}
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditDeviceForm" })(EditDeviceForm);

 estate-frontend-v2024/src/views/screenSetting/forms/reset-password-form.jsx

New file
@@ -0,0 +1,48 @@
import React from "react";
import { Form, Input, Modal,  } from "antd";
import BaseForm from "../../common/edit-form-base";

class ResetPasswordForm extends BaseForm {
  initEditableData() {
    return {
      password: "",
      confirmPassword: "",
    };
  }

  render() {
    const { visible, onCancel, onOk, form, confirmLoading } = this.props;

    const { getFieldDecorator } = form;
    const { password, confirmPassword } = this.state.editableData;

    return (
      <Modal
        title="重置密码"
        visible={visible}
        onCancel={onCancel}
        onOk={onOk}
        confirmLoading={confirmLoading}
      >
        <Form {...this.formItemLayout}>
          <Form.Item label="新密码:">
            {getFieldDecorator("password", {
              rules: [{ required: true, message: "请输入新密码!" }],
              initialValue: password,
              onChange: this.handleFieldChange("password"),
            })(<Input placeholder="请输入新密码" />)}
          </Form.Item>
          <Form.Item label="确认密码:">
            {getFieldDecorator("confirmPassword", {
              rules: [{ required: true, message: "请输入确认密码!" }],
              initialValue: confirmPassword,
              onChange: this.handleFieldChange("confirmPassword"),
            })(<Input placeholder="请输入确认密码" />)}
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "ResetPasswordForm" })(ResetPasswordForm);

 estate-frontend-v2024/src/views/screenSetting/style/index.less

New file
@@ -0,0 +1,19 @@
.title {
  display: flex;
  align-items: center;
}
.grid {
  display: grid;
}
.grid-1-1-1 {
  grid-template-columns: 1fr 1fr 1fr ;
}

.editor-class{
  min-height: 300px;
  max-height: 300px;
  border: 1px solid #F1F1F1;
  border-top: none;
  margin-top: -5px;
  padding: 0 10px;
}

 estate-frontend-v2024/src/views/standard/forms/edit-position-form.jsx

New file
@@ -0,0 +1,40 @@
import React from "react";
import { Form, Input, Modal } from "antd";
import "../style/standard.less";
import EditFormBase from "../../common/edit-form-base";
import { inputLongStyle } from "../../common/constants";

class EditDeviceForm extends EditFormBase {
  initEditableData() {
    return {
      name: "",
    };
  }

  render() {
    const { visible, onCancel, onOk, form } = this.props;
    const { getFieldDecorator } = form;
    const { name } = this.state.editableData;
    return (
      <Modal
        title={this.state.isEdit ? "编辑岗位" : "添加岗位"}
        visible={visible}
        onCancel={onCancel}
        onOk={onOk}
        destroyOnClose
      >
        <Form {...this.formItemLayout}>
          <Form.Item label="岗位名称">
            {getFieldDecorator("name", {
              rules: [{ required: true, message: "请输入岗位名称!" }],
              initialValue: name,
              onChange: this.handleFieldChange("name"),
            })(<Input style={inputLongStyle} placeholder="请输入岗位名称" />)}
          </Form.Item>
        </Form>
      </Modal>
    );
  }
}

export default Form.create({ name: "EditDeviceForm" })(EditDeviceForm);

 estate-frontend-v2024/src/views/standard/position.jsx

New file
@@ -0,0 +1,124 @@
import React from "react";
import { Card, Divider, Icon, Input, Table } from "antd";
import { deleteDevice, editDevice, getDevicesList } from "@/api/devices";
import EditPositionForm from "./forms/edit-position-form";
import "./style/standard.less";
import CrudViewBase from "../common/crud-view-base";

const { Column } = Table;
const inputLongStyle = {
  padding: "1px 10px",
  width: "250px",
};

class PositionSetting extends CrudViewBase {
  state = {
    ...this.state,
    entities: [],
  };

  initListBody() {
    return {
      keyword: "",
      deviceType: "",
    };
  }

  // 重写处理listBody变化的方法，当deviceType变化时加载表单
  handleListBodyChange = (key, value) => {
    this.setState(
      (prevState) => {
        const newListBody = { ...prevState.listBody, [key]: value };

        return { listBody: newListBody };
      },
      () => {
        this.reloadEntities();
      }
    );
  };

  getEntityList(pageInfo, listBody) {
    return getDevicesList(pageInfo, listBody);
  }

  editEntity(data, isEdit) {
    return editDevice(data, isEdit);
  }

  deleteEntities(ids) {
    return deleteDevice(ids);
  }

  render() {
    const { entities } = this.state;
    const title = (
      <div className="flex title">
        <div>
          <Input
            style={inputLongStyle}
            placeholder="请输入岗位"
            onChange={(e) => {
              this.handleListBodyChange("keyword", e.target.value);
            }}
            prefix={<Icon style={{ marginLeft: "4px" }} type="search" />}
            allowClear
          />
        </div>
        &nbsp; &nbsp;
        <div className="right">{this.renderAddButton("device:add")}</div>
      </div>
    );
    return (
      <div className="app-container">
        <Card title={title}>
          <Table
            bordered
            rowKey="id"
            dataSource={entities}
            pagination={false}
            scroll={{ x: "max-content" }}
          >
            <Column
              title="序号"
              dataIndex="id"
              key="id"
              align="center"
            />
            <Column
              title="岗位名称"
              dataIndex="name"
              key="name"
              align="center"
            />
            <Column
              title="操作"
              key="action"
              width={360}
              align="center"
              render={(text, row) => (
                <span>
                  {this.renderEditButton(row, "device:edit")}
                  <Divider type="vertical" />
                  {this.renderDeleteButton(row, "device:delete")}
                </span>
              )}
            />
          </Table>
          <br />
          {this.renderPagination()}
        </Card>
        <EditPositionForm
          currentRowData={this.state.currentRowData}
          wrappedComponentRef={(formRef) => (this.editFormRef = formRef)}
          visible={this.state.editModalVisible}
          confirmLoading={this.state.editModalLoading}
          onCancel={this.handleEditEntityCancel}
          onOk={this.handleEditEntityOk}
        />
      </div>
    );
  }
}

export default PositionSetting;

 screen/.gitignore

@@ -14,6 +14,7 @@

# misc
package-lock.json
yarn.lock

# Editor directories and files
.idea