From d29d6b1b82859fc67db01cdb94caaf169a28d324 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=AE=87=E8=88=AA?= <740464440@qq.com> Date: Mon, 15 Jan 2024 13:45:08 +0800 Subject: [PATCH] =?UTF-8?q?feat():=20=E6=96=B0=E5=A2=9E=E8=B7=AF=E5=A4=96?= =?UTF-8?q?=E4=BA=BA=E5=91=98=E7=AE=A1=E7=90=86--=E6=94=B6=E8=B4=B9?= =?UTF-8?q?=E5=91=98=E7=AE=A1=E7=90=86=E9=A1=B5=E9=9D=A2=E7=AD=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/assets/css/common.scss | 22 +- src/assets/css/mixin.scss | 8 +- .../ExceptionDeal/StartExceptionDeal/index.scss | 21 - src/pages/MerchantMgm/MerchantInfo/loadable.jsx | 19 +- .../OutPersonMgm/TollCollector/index.jsx | 689 +++++++++++++++++++++ .../OutPersonMgm/TollCollector/index.scss | 153 +++++ .../OutPersonMgm/TransitionReport/index.jsx | 22 + .../OutPersonMgm/TransitionReport/index.scss | 0 src/pages/OutRoadMgm/OutPersonMgm/index.jsx | 7 + src/pages/OutRoadMgm/index.jsx | 4 +- src/router/router.config.js | 13 + src/services/OutRoadMgm/OutPersonMgm.js | 57 ++ src/services/OutRoadMgm/index.js | 2 + 13 files changed, 982 insertions(+), 35 deletions(-) create mode 100644 src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.jsx create mode 100644 src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.scss create mode 100644 src/pages/OutRoadMgm/OutPersonMgm/TransitionReport/index.jsx create mode 100644 src/pages/OutRoadMgm/OutPersonMgm/TransitionReport/index.scss create mode 100644 src/pages/OutRoadMgm/OutPersonMgm/index.jsx create mode 100644 src/services/OutRoadMgm/OutPersonMgm.js diff --git a/src/assets/css/common.scss b/src/assets/css/common.scss index 3f480a6..6f2702f 100644 --- a/src/assets/css/common.scss +++ b/src/assets/css/common.scss @@ -141,4 +141,24 @@ // .ant-modal-wrap{ // padding-top: 100px; // padding-bottom: 50px; -// } \ No newline at end of file +// } +.start-exception-deal-operate { + .ant-popover-inner-content { + padding: 5px 5px; + width: 100%; + .hover, + .disabled { + padding: 5px 12px; + text-align: center; + } + .hover { + &:hover { + background-color: #414960; + } + } + .disabled { + cursor: no-drop; + color: rgba(255, 255, 255, .3); + } + } +} \ No newline at end of file diff --git a/src/assets/css/mixin.scss b/src/assets/css/mixin.scss index d379109..c1be862 100644 --- a/src/assets/css/mixin.scss +++ b/src/assets/css/mixin.scss @@ -11,15 +11,15 @@ &::-webkit-scrollbar-track-piece, &::-webkit-scrollbar-corner, &::-webkit-scrollbar-track { - background: #000; + background: transparent; } &::-webkit-scrollbar { - width: 4px; - height: 4px; + width: 12px; + height: 12px; } &::-webkit-scrollbar-thumb { background: #9da2ab; - border-radius: 2px; + border-radius: 4px; } } @mixin hiddenScrollBar() { diff --git a/src/pages/FinancialMgm/ExceptionDeal/StartExceptionDeal/index.scss b/src/pages/FinancialMgm/ExceptionDeal/StartExceptionDeal/index.scss index b633579..2c0e47c 100644 --- a/src/pages/FinancialMgm/ExceptionDeal/StartExceptionDeal/index.scss +++ b/src/pages/FinancialMgm/ExceptionDeal/StartExceptionDeal/index.scss @@ -206,24 +206,3 @@ $color-primary: var(--color-primary); background-color: var(--color-tag-bg) !important; } } - -.start-exception-deal-operate { - .ant-popover-inner-content { - padding: 5px 5px; - width: 100%; - .hover, - .disabled { - padding: 5px 12px; - text-align: center; - } - .hover { - &:hover { - background-color: #414960; - } - } - .disabled { - cursor: no-drop; - color: rgba(255, 255, 255, .3); - } - } -} diff --git a/src/pages/MerchantMgm/MerchantInfo/loadable.jsx b/src/pages/MerchantMgm/MerchantInfo/loadable.jsx index 0c3aeee..95fdd64 100644 --- a/src/pages/MerchantMgm/MerchantInfo/loadable.jsx +++ b/src/pages/MerchantMgm/MerchantInfo/loadable.jsx @@ -114,6 +114,7 @@ const MerchantInfo = (props) => { const [companyAddress, setCompanyAddress] = useState([]); // 获取公司地址 const [clearAccount, setClearAccount] = useState({}); // 清结算模块 const [clearAccountOpen, setClearAccountOpen] = useState({modalOpen: false, data: {}}); // 清结算模块查看modal + const [addEdit,setAddEdit] = useState("待配置") // 清结算模块新增编辑 按钮待配置和编辑 //表头 const columns = [ { @@ -456,6 +457,7 @@ const MerchantInfo = (props) => { //创建商户 const createData = () => { setCreateVisible(true) + setAddEdit("待配置") setClearAccount({}) systemForm.setFieldsValue( { @@ -715,6 +717,7 @@ const MerchantInfo = (props) => { //编辑 function updateBtn(record) { setUpdateVisible(true) + setAddEdit("编辑") setEditId(record?.id || "") ajax.checkTenant({ id: record.id }).then( res => { @@ -1713,13 +1716,13 @@ const MerchantInfo = (props) => { singleVisible ?
App(微信支付)
-
+
APP (支付宝支付)
-
+
微信公众号及小程序
-
+
支付宝生活号及小程序
-
+
: '' } @@ -1727,13 +1730,13 @@ const MerchantInfo = (props) => { specialVisible ?
App(微信支付)
-
+
APP (支付宝支付)
-
+
微信公众号及小程序
-
+
支付宝生活号及小程序
-
+
: '' } diff --git a/src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.jsx b/src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.jsx new file mode 100644 index 0000000..0429cd1 --- /dev/null +++ b/src/pages/OutRoadMgm/OutPersonMgm/TollCollector/index.jsx @@ -0,0 +1,689 @@ + +import React, { useState, useRef, useEffect } from "react"; +import { message, Pagination, Table, Select, Input, Button, Popover, Modal, Radio, DatePicker, Transfer } from "antd"; +import { dictionary, utils } from "@/config/common"; +import { useSessionStorageState } from "ahooks"; +import moment from "moment"; +import ajax from "@/services"; +import "./index.scss"; +import { use } from "echarts"; +import { set } from "js-cookie"; + +function TollCollector() { + // 默认数据 + const defaultData = { + operator: "0", // 商户名称 + account_number: "", // 账号 + user_name: "", // 姓名 + user_role: 0, // 角色 + administer_parking: "", // 管辖车场 + pn: 1, + page_size: dictionary?.pageSizeOptions1[0] + }; + const defaultEdit = { + user_name: "", // 姓名 + sex: "1", // 性别 1: 男 2: 女 + birth_year: "", // 出生年份 + person_number: "", // 员工编号 + account_number: "", // 账号 + tel: "", // 手机号 + user_role: "", // 角色 + depart_id: "", // 所属部门 + operator: "", // 商户名称 + park_ids: [], // 停车场Id + }; + + const [formData, setFormData] = useState(defaultData); // 表单数据 + const [editData, setEditData] = useState(defaultEdit); // 编辑数据回显 + const [sessionData, setSessionData] = useSessionStorageState("tollCollector", { value: {} }); // session缓存 + const [loading, setLoading] = useState(false); // 检索按钮加载状态 + const [operatorList, setOperatorList] = useState([{ value: "0", label: "全部" }]); // 商户名称查询数据 + const [operatorEdit, setOperatorEdit] = useState([]); // 商户名称查询数据 + const [addEditChange, setAddEditChange] = useState(true); // 新增编辑控制开关 + const [departData, setDepartData] = useState([]); // 所属部门数据 + const [parkAllData, setParkAllData] = useState([]); // 停车场数据 + const [parkSelectedKeys, setParkSelectedKeys] = useState([]); // 停车场设置哪些项应该被选中 + const [editLoad, setEditLoad] = useState(false); // 新增编辑提交加载 + + // 在职状态编辑模态框 + const [jobStatusEditOpen, setJobStatusEditOpen] = useState({ + open: false, + data: {}, + }); + + // 表格返回数据 + const [resultData, setResultData] = useState({ + total: 0, + list: [], + }); + + //列表 + const tableColumns = [ + { + title: "序号", + width: 60, + align: "center", + fixed: 'left', + render: (text, record, index) => index + 1, + }, + { + title: "商户名称", + dataIndex: "operator_name", + key: "operator_name", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "所属部门", + dataIndex: "depart_name", + key: "depart_name", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "姓名", + dataIndex: "user_name", + key: "user_name", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "手机号", + dataIndex: "tel", + key: "tel", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "账号", + dataIndex: "account_number", + key: "account_number", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "角色", + dataIndex: "role_name", + key: "role_name", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "管辖车场", + dataIndex: "administer_parking", + key: "administer_parking", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "添加时间", + dataIndex: "create_time", + key: "create_time", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: "在职状态", + dataIndex: "job_status_name", + key: "job_status_name", + align: "center", + render: (text, record, index) => text || "--", + }, + { + title: '操作', + key: 'operation', + dataIndex: 'operation', + align: "center", + fixed: 'right', + width: 100, + render: (text, record, index) => { + return <> + +
$editPersonMeg(record)}>编辑
+
setJobStatusEditOpen({ open: true, data: record })} + > + {record?.job_status == 2 ? "在职" : record?.job_status == 1 ? "离职" : "--"} +
+ + } + > + + + + }, + }, + ]; + + + // 分页 + const $changePn = (pn, page_size) => { + let temFormData = {}; + if (formData.page_size == page_size) { + temFormData = { + ...formData, + pn + }; + } else { + temFormData = { + ...formData, + pn: 1, + page_size, + }; + }; + setFormData(temFormData); + $getTableList(temFormData); + }; + + // 获取商户名称 + const $getAllOperator = () => { + ajax.ElectInvoice.getSelectOperator().then((res) => { + if (res.status === 20000) { + let newArr = []; + if (res?.data?.length) { + newArr = res?.data?.slice(1) + setOperatorList(res.data); + }; + setOperatorEdit(newArr); + } else { + message.error(res.message); + } + }).catch((error) => { + message.error(error.message); + }); + }; + + // 获取停车场数据 + const $parkAllList = (operator) => { + ajax.getParkAllData({operator}).then((res) => { + if (res.status === 20000) { + let newArr = []; + if (res?.data?.length) { + res?.data?.map((item) => { + newArr.push({ + key: item?.value || "--", + title: item?.label || "--" + }) + }) + setParkAllData(newArr); + return; + }; + setParkAllData([]); + } else { + setParkAllData([]); + message.error(res.message); + } + }).catch((error) => { + setParkAllData([]); + message.error(error.message); + }); + }; + + // 编辑在职状态 + const $jobStatusEdit = (value) => { + let _data = {}; + if (!value?.id || !value?.job_status) return message.error("未获取到数据id及在职状态id，请联系管理员！"); + _data = { + id: value.id, + job_status: value.job_status == 1 ? 2 : value.job_status == 2 ? 1 : "" + }; + ajax.getJobStatusEdit(_data).then((res) => { + if (res.status === 20000) { + message.success(res.message || "在职状态修改成功！"); + $getTableList(); + setJobStatusEditOpen({ open: false, data: {} }); + } else { + message.error(res.message); + } + }).catch((error) => { + message.error(error.message); + }); + }; + + // 新增编辑状态下角色数据 + const $userRoleData = () => { + let arr = []; + if (sysConfig?.BPM_ROLE?.length) { + arr = sysConfig?.BPM_ROLE.slice(1); + } + return arr; + }; + // 获取编辑的数据 + const $editPersonMeg = (value) => { + setAddEditChange(false); + if (!value?.id) return message.error("未获取到编辑数据id，请重新获取！"); + ajax.getTollCollectorEdit({ id: value.id }).then((res) => { + if (res.status === 20000) { + setEditData({ + id: value.id, + user_name: res?.data?.user_name || "", // 姓名 + sex: res?.data?.sex || "1", // 性别 1: 男 2: 女 + birth_year: res?.data?.birth_year || "", // 出生年份 + person_number: res?.data?.person_number || "", // 员工编号 + account_number: res?.data?.account_number || "", // 账号 + tel: res?.data?.tel || "", // 手机号 + user_role: res?.data?.user_role || "", // 角色 + operator: res?.data?.operator || "", // 商户名称 + depart_id: res?.data?.depart_id || "", // 所属部门 + park_ids: res?.data?.park_ids || [], // 停车场Id + }); + setDepartData([{value: res?.data?.operator, label: res?.data?.operator_name}]) + } else { + message.error(res.message); + } + }).catch((error) => { + message.error(error.message); + }); + }; + + // 新增编辑提交 + const $addEditSubmit = (value) => { + // 姓名 + if(!value?.user_name) { + return message.error("请输入姓名！"); + } else { + let reg = /^[\u4E00-\u9FA5]*$/.test(value?.user_name); + if(!reg) return message.error("您输入的姓名不合法，必须为汉字！") + }; + + // 出生年份 + if(!value?.birth_year) return message.error("请选择出生年份！"); + + // 员工编号 + if(!value?.person_number) { + return message.error("请输入员工编号！"); + } else { + let reg = /[`~!@#$%^&*()_\-+=<>?:"{}|,./;'\\[\]·~！@#￥%……&*（）——\-+={}|《》？：“”【】、；‘'，。、]/g.test(value?.person_number); + if(reg) return message.error("您输入的员工编号不合法！"); + }; + + // 账号 + if(!value?.account_number) { + return message.error("请输入账号！"); + } else { + let reg = /^(?![0-9]+$)/g.test(value?.account_number); + console.log(reg); + if(!reg) return message.error("您输入的账号不合法，不能为纯数字！"); + }; + + // 手机号 + if(!value?.tel) { + return message.error("请输入手机号！"); + }else { + let reg = /^1[3456789]\d{9}$/.test(value.tel); + if(!reg) return message.error("您输入的手机号不合法！"); + }; + + // 角色 + if(!value?.user_role) return message.error("请选择角色！"); + + // 商户名称 + if(!value?.operator) return message.error("请选择商户名称！"); + + // 所属部门 + if(!value?.depart_id) return message.error("请选择所属部门！"); + + // 停车场 + if(!value?.park_ids?.length) return message.error("请选择停车场！"); + setEditLoad(true); + ajax.getAddTollCollector(value).then((res) => { + setEditLoad(false); + if (res.status === 20000) { + setEditData(defaultEdit); + message.success(res?.message || value?.id ? "编辑成功" : "新增成功！"); + setAddEditChange(true); + if(value?.id) { + $getTableList(); + } else { + let _data = { + ...formData, + pn: 1, + page_size: dictionary?.pageSizeOptions1[0], + }; + setFormData(_data); + $getTableList(_data); + }; + } else { + message.error(res.message); + } + }).catch((error) => { + setLoading(false); + message.error(error.message); + }); + }; + + // 获取表格数据 + const $getTableList = (value = {}) => { + let _data = { + ...formData, + ...value + }; + setLoading(true); + setResultData({ list: [], total: 0 }); + ajax.getAllTollCollectorData(_data).then((res) => { + setLoading(false); + if (res.status === 20000) { + setResultData(res?.data || {}); + } else { + message.error(res.message); + } + }).catch((error) => { + setLoading(false); + message.error(error.message); + }); + }; + useEffect(() => { + let _data = {}; + if (sessionData && Object.values(sessionData).length > 0) { + _data = { + operator: sessionData?.operator || "0", // 商户名称 + account_number: sessionData?.account_number || "", // 账号 + user_name: sessionData?.user_name || "", // 姓名 + user_role: sessionData?.user_role || 0, // 角色 + administer_parking: sessionData?.administer_parking || "", // 管辖车场 + pn: 1, + page_size: dictionary?.pageSizeOptions1[0], + }; + setFormData({ ..._data }); + }; + $getAllOperator() + $getTableList(_data); + }, []); + + useEffect(() => { + setSessionData(formData); + }, [formData]); + + useEffect(() => { + if (!editData.operator) { + setParkAllData([]); + return; + }; + $parkAllList(editData.operator); + }, [editData.operator]); + + return ( +
+ {addEditChange ? + <> +
+
查询条件
+
+
+ + + setFormData({ ...formData, account_number: e.target.value || "" }) + } + /> +
+
+ + + setFormData({ ...formData, user_name: e.target.value || "" }) + } + /> +
+
+ + + setFormData({ ...formData, administer_parking: e.target.value || "" }) + } + /> +
+
+ + +
+
+
+
+
+
+ 共查询到 {resultData.total || 0} 条结果 + +
+
+ row.id} + className="table yisa-table-scroll" + dataSource={resultData?.list || []} + columns={tableColumns} + pagination={false} + loading={loading} + scroll={{ y: "calc(100% - 50px)" }} + /> + `共 ${resultData.total || 0} 条`} + total={resultData.total} + current={formData.pn} + pageSize={formData.page_size} + pageSizeOptions={dictionary?.pageSizeOptions1} + onChange={$changePn} + /> + + + + + : +
+
+
+ + { + // let reg = /^[\u4E00-\u9FA5]*$/.test(e.target.value); + setEditData({ ...editData, user_name: e.target.value || "" }) + }} + /> +
+
+ + + setEditData({ ...editData, sex: e.target.value || "1" }) + } + > + 男 + 女 + +
+
+ + { setEditData({ ...editData, birth_year: e ? e.format('YYYY') : "" }) }} + disabledDate={(current) => current && current > moment().endOf('year')} + /> +
+
+ + + setEditData({ ...editData, person_number: e.target.value || "" }) + } + /> +
+
+ + + setEditData({ ...editData, account_number: e.target.value || "" }) + } + /> +
+
+ + + setEditData({ ...editData, tel: e.target.value || "" }) + } + /> +
+
+ + node.parentElement} + options={operatorEdit} + value={editData?.operator || null} + onChange={(v, option) => { + setEditData({ ...editData, operator: v || "", depart_id: "" }); + setDepartData(option ? [option] : []); + }} + /> +
+
+ +