From 7ea4e250ff96dd480be2c872e4f127acea0e3113 Mon Sep 17 00:00:00 2001 From: guoxin Date: Thu, 30 Nov 2023 23:09:30 +0800 Subject: [PATCH] =?UTF-8?q?fix():=E4=BF=AE=E5=A4=8D=E8=B7=AF=E5=86=85bug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../InRoadMgm/PersonMgm/MesNotification/demon.jsx | 0 .../InRoadMgm/PersonMgm/MesNotification/demon.scss | 0 .../InRoadMgm/PersonMgm/MesNotification/index.scss | 216 ++++--- .../PersonMgm/MesNotification/loadable.jsx | 627 +++++++++------------ src/services/search.js | 10 + 5 files changed, 410 insertions(+), 443 deletions(-) create mode 100644 src/pages/InRoadMgm/PersonMgm/MesNotification/demon.jsx create mode 100644 src/pages/InRoadMgm/PersonMgm/MesNotification/demon.scss diff --git a/src/pages/InRoadMgm/PersonMgm/MesNotification/demon.jsx b/src/pages/InRoadMgm/PersonMgm/MesNotification/demon.jsx new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/InRoadMgm/PersonMgm/MesNotification/demon.scss b/src/pages/InRoadMgm/PersonMgm/MesNotification/demon.scss new file mode 100644 index 0000000..e69de29 diff --git a/src/pages/InRoadMgm/PersonMgm/MesNotification/index.scss b/src/pages/InRoadMgm/PersonMgm/MesNotification/index.scss index fecf1de..51c1bac 100644 --- a/src/pages/InRoadMgm/PersonMgm/MesNotification/index.scss +++ b/src/pages/InRoadMgm/PersonMgm/MesNotification/index.scss @@ -4,24 +4,7 @@ $color-user-list-bg : var(--color-user-list-bg); $color-text : var(--color-text); $color-primary : var(--color-primary); -.push-box { - width: calc(100% - 375px); - padding: 20px; - background: var(--color-user-list-bg); - border-top-left-radius: 20px; - box-shadow: 0px 3px 8px 0px rgb(0 0 0 / 8%); - margin-top: 10px; - .push-item { - display: flex; - margin: 14px 0; - .title { - width: 100px; - } - .ant-input-textarea { - width: 400px; - } - } -} + .colorBtn { width: 90px; height: 36px; @@ -54,70 +37,161 @@ $color-primary : var(--color-primary); border-radius: 4px; } } -.search-box { - width: 100%; - padding: 20px; - height: calc(100% - 10px); - background: var(--color-user-list-bg); - border-top-left-radius: 20px; - box-shadow: 0px 3px 8px 0px rgb(0 0 0 / 8%); - margin-top: 10px; - .time { - display: inline-block; +.paid-MesNotification{ + display: flex; + padding: 15px; + width: 100%; + .paid-search{ + .search{ + font-size: 16px; + font-family: Microsoft YaHei, Microsoft YaHei-Bold; + font-weight: 700; + text-align: left; + color: #eeeff1; } - .btn-box { - display: inline-block; - .search-btn { - margin: 0 10px ; - } + label{ + margin:0 10px; } -} -.result-box { - width: 100%; - height: 600px; - .table-wrap { - height: calc(100% - 32px - 65px); - } - .ant-tabs { - margin-bottom: 16px; - .ant-tabs-nav { - margin-bottom: 0 !important; - &::before { - border-bottom: 1px solid var(--color-card-line) !important; - } + .yisa-search{ + margin-top: 10px; + display: flex; + label{ + line-height: 31px; } - .ant-tabs-nav-wrap { - width: 100%; - box-sizing: content-box; - .ant-tabs-nav-list { - width: 340px; - .ant-tabs-ink-bar { - height: 3px; - background-color: #00ccff; + } + .ant-select:not(.ant-select-customize-input) .ant-select-selector{ + background-color: #50586c !important; + } + .ant-select-arrow .anticon{ + background-color: #50586c !important; + } + .ant-input:placeholder-shown{ + background-color: #50586c !important; + } + .timePicker{ + width: 350px; + margin-top: 22px; + .btnBox{ + display:flex ; + margin-top: 20px; + .yisa-btn{ + margin-left: 20px; + width: 130px; } - .ant-tabs-tab { - flex: 1; - width: 100%; + .root_gfkk{ + margin-left: 20px; + .export-content{ + width: 130px; + height: 33px; display: flex; + align-items: center; justify-content: center; - padding-bottom: 10px; - text-align: center; + background: #3b97ff; + border-radius: 3px; cursor: pointer; - font-size: 14px !important; - font-family: MicrosoftYaHei; - text-align: center; - letter-spacing: 0.7px; + color: #fff; + margin-right: 10px; } - .ant-tabs-tab-active { - div { - color: #00ccff; - } } + } + } + } + .paid-result{ + width: 100%; + height: 800px; + background: #505a6f; + border-radius: 20px; + margin-left: 17px; + .result{ + padding: 25px; + .font{ + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + text-align: left; + color: #eeeff1; + margin-bottom: 10px; + display: inline-block; + + em{ + color: #3aa8fe; + margin: 0 5px; + } + } + .yisa-table .ant-table-thead .ant-table-cell{ + background-color: #616b83 !important; + color: #ffffff !important; + font-size: 14px; + font-family: Microsoft YaHei, Microsoft YaHei-Bold; + font-weight: 700; + text-align: center; + border-right: none !important; + border-top-color: #888f9d !important; + border-color: #888f9d !important; + } + .ant-table.ant-table-bordered>.ant-table-container>.ant-table-content>table, .ant-table.ant-table-bordered>.ant-table-container>.ant-table-header>table{ + border-top: none !important; + border-left: none !important; + } + .ant-table-tbody .ant-table-row .ant-table-cell{ + background-color: #3e4557 !important; + color: #ffffff !important; + text-align: center; + font-size: 14px; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + font-weight: 400; + border-right: none !important; + border-left: none !important; + border-bottom-color: #626b7e !important; } } - .pop-card { + + } + +} +.revenue{ + .tab-title{ + text-align: center; + font-size: 18px; + font-weight: 400; + font-family: Microsoft YaHei, Microsoft YaHei-Regular; + } + width: 700px !important; + .tab-index{ + .tab-top{ display: flex; - flex-direction: row; + margin-top: 10px; + height: 30px; + line-height: 30px; + white-space: nowrap; + overflow: hidden; + border-bottom: 1px solid #e4e7ed; + .tab-li{ + margin-left: 20px; + cursor: pointer; + } + .active{ + color:#409eff ; + cursor: pointer; + margin-left: 20px; + border-bottom: 1px solid #409eff !important; + margin-bottom: -1px !important; + } } -} \ No newline at end of file + .tab-bottom{ + .yisa-tab{ + .ant-table-cell{ + background-color: #616b83 !important; + color: #ffffff !important; + font-size: 14px; + font-family: Microsoft YaHei, Microsoft YaHei-Bold; + font-weight: 700; + text-align: center; + border-right: none !important; + border-left: none !important; + border-bottom-color: #868d9d !important; + } + } + } + } +} diff --git a/src/pages/InRoadMgm/PersonMgm/MesNotification/loadable.jsx b/src/pages/InRoadMgm/PersonMgm/MesNotification/loadable.jsx index 54c0c3a..745900d 100644 --- a/src/pages/InRoadMgm/PersonMgm/MesNotification/loadable.jsx +++ b/src/pages/InRoadMgm/PersonMgm/MesNotification/loadable.jsx @@ -1,389 +1,272 @@ import React, { useState, useRef, useEffect } from "react"; +import { ResultFlowResult } from "@/components" +import { Select, Button, Table, message, Pagination } from 'antd' import { - message, - Pagination, - Table, - Form, - Space, - Modal, - DatePicker, - Input, - Button, - Select, - Tabs, - Descriptions, - Transfer -} from "antd"; -const { RangePicker } = DatePicker; -import moment from "moment"; -const { TextArea } = Input; -import ajax from '@/config/ajax.js' -import { TableModule, ResultFlow, } from "@/components"; -import { dictionary, utils } from "@/config/common"; + pageSizeOptions +} from '@/config/character.config.js' import "./index.scss"; +import { SearchOutlined, DeleteOutlined } from '@ant-design/icons'; +import ajax from '@/services' +import { useSessionStorageState } from "ahooks" +function MesNotification(props) { + const [ajaxLoading, setAjaxLoading] = useState(false) + const [resultData, setResultData] = useState({ + data: [], + total_records: 0, + export_url: '', + process_url: "" + }) + const parameter={ + operatorid: '', + brand_id: '', + model_id: '', + pn: 1, + page_size: Number(pageSizeOptions[0]), // 每页条数 + } + const [formData, setFormData] = useState(parameter) + const [lastFormData, setLastFormData] = useState(formData) + //物品型号 + const handleJobStatus = (value) => { + setFormData({ ...formData, model_id: value }) + } + //物品类型 + const [getBrandId, setGetBrandId] = useState({}) + const handleOperator = (v) => { + setGetBrandId(v) + setFormData({ ...formData, brand_id: v }) + } + //商户名称 + const handleDeployType = (value) => { + setFormData({ ...formData, operatorid: value }) + } + //列表 + const handleColumns = (tab) => { + let result = [...deployListColumns]; + switch (tab) { + case '1': + result.splice(5, 1) + break; -function loadable() { - const columns = [ - { - title: "序号", - dataIndex: "index", - key: "index", - align: "center", - fixed: "left", - render: (text, record, index) => index + 1, - width: 100, - }, - { - title: "接收人类型", - dataIndex: "receiver_type", - key: "receiver_type", - width: 100, - align: "center", - }, - { - title: "接收人", - dataIndex: "receiver", - key: "receiver", - width: 100, - align: "center", - }, - { - title: "发送内容", - dataIndex: "content", - key: "content", - width: 100, - align: "center", - }, - { - title: "发送人", - dataIndex: "sender", - key: "sender", - width: 100, - align: "center", - }, - { - title: "发送时间", - dataIndex: "send_time", - key: "send_time", - width: 100, - align: "center", - }, - ]; - const [loading, setLoading] = useState(false); - const [tag, setTag] = useState('1'); - const [sfyVisible, setSfyVisible] = useState(false); - const [pageData, setPageData] = useState({ - // 分页参数 - pn: 1, - page_size: 15, - }); - const [resultData, setResultData] = useState([]) - const [sendData, setSendData] = useState({ - receiver_type: 1,//1,全平台；2,PDA账号；3，运营商 - receiver: '',//接收人名称 - receiver_id: '',//接收人对应id - content: '',//内容 - }) - function onShowSizeChange(pn, page_size) { - setPageData({ - pn, - page_size, - }); - } - const handleChange = (value) => { - console.log(`selected ${value}`); - setSendData({ ...sendData, receiver_type: value }) - }; - const inputParams = { - maxLength: 50, - showCount: true, - }; - const [total, setTotal] = useState([]); - const [mockData, setMockData] = useState([]); - const [formData, setFormData] = useState({ - //start: moment().subtract(1, "month").format("YYYY-MM-DD HH:mm:ss"), - //end: moment().format("YYYY-MM-DD HH:mm:ss"), - start: '', - end: '', - }); - const [targetKeys, setTargetKeys] = useState([]); - const [selectedKeys, setSelectedKeys] = useState([]); - const onChange = (nextTargetKeys, direction, moveKeys) => { - console.log('targetKeys:', nextTargetKeys); - console.log('direction:', direction); - console.log('moveKeys:', moveKeys); - setTargetKeys(nextTargetKeys); - //setSendData({ ...sendData, receiver_id: nextTargetKeys }) - }; - const onChangeText = (e) => { - setSendData({ ...sendData, content: e.target.value }) - }; - const onSelectChange = (sourceSelectedKeys, targetSelectedKeys) => { - // console.log('sourceSelectedKeys:', sourceSelectedKeys); - //console.log('targetSelectedKeys:', targetSelectedKeys); - setSendData({ ...sendData, receiver_id: targetSelectedKeys }) - setSelectedKeys([...sourceSelectedKeys, ...targetSelectedKeys]); - }; - const onScroll = (direction, e) => { - console.log('direction:', direction); - console.log('target:', e.target); - }; - const handleSearch = (dir, value) => { - console.log('search:', dir, value); - }; - function onChangeTime(value, dateString) { - console.log('Selected Time: ', value); - console.log('Formatted Selected Time: ', dateString); - setFormData({ start: dateString[0], end: dateString[1] }) - }; - //退费记录检索条件 - const formSearch = [ - {//13 - name: "timePeriod", - type: "RangePicker", - label: "时间段", - defaultValue: [moment().startOf("day"), moment()], - defaultTitle: ['发送时间', '至'] - }, - ]; - function send() { - var arr = [] - mockData.map((e) => { - if (sendData.receiver_id) { - sendData.receiver_id?.map((d) => { - if (d == e.key) { - arr.push(e.title) - } + } + return result; + } + //重置数据 + const getResetData = () => { + setFormData({ + ...parameter }) - } - }) - if ((sendData.receiver_type > 1) && sendData.receiver_id.length == 0) { - message.error("请勾选接收人") - return + getData({ ...parameter }) } - //console.log(arr) - ajax({ - url: "/api/bpm/message/send", - type: "post", - data: { ...sendData, receiver: arr }, - }).then((res) => { - console.log(res) - let { status, data } = res - if (status == 20000) { - // console.log(data.list) - message.success(res.message) - setTag('1'); - } else { - message.error(res.message) - } - }) - } - function getpad() { - ajax({ - url: sendData.receiver_type == 2 ? "/api/bpm/operator/get_all_worker" : "/api/bpm/operator/get_all_operator", - type: "get", - data: { type: "message" } - }).then((res) => { - let { status, data } = res - if (status == 20000) { - let arr = [] - data.map((e) => { - let obj = { - key: e.value, - title: e.label + //列表 + const deployListColumns = [ + { + title: '序号', + render: (_, record, index) => { + return index + 1 } - arr.push(obj) + }, + { + title: '接收人类型', + dataIndex: 'receiver_type', + key: 'receiver_type', + }, + { + title: '接收人', + dataIndex: 'receiver', + key: 'receiver', + }, + { + title: '发送内容', + dataIndex: 'content', + key: 'content', + }, + { + title: '发送人', + dataIndex: 'sender', + key: 'sender', + }, + { + title: '发送时间', + dataIndex: 'send_time', + key: 'send_time', + }] + + // 获取列表数据 + const getData = (data = formData) => { + setAjaxLoading(true) + ajax.MesNotificationData(data).then(res => { + setAjaxLoading(false) + if (res.status === 20000) { + let resDataArr = res.data.list.map((item) => { + item.key = item.id + return item + }) + setResultData({ + ...resultData, + data: resDataArr, + total_records: res.data.total_records + }) + } else { + setResultData({ + data: [], + total_records: 0, + export_url: '', + process_url: "" + }) + message.error(res.message) + } + }, err => { + console.log(err) }) - setMockData(arr) - } else { - message.error(res.message) - } - }) - } - function search(e) { - console.log(e) - ajax({ - url: "/api/bpm/message/list", - type: "post", - data: { ...e }, - }).then((res) => { - let { status, data } = res - if (status == 20000) { - setResultData(data.list) - setTotal(data.total) - } else { - message.error(res.message) - } + } + //切换分页 + const changePn = (pn, length) => { + if (formData.page_size === length) { + setFormData(Object.assign({}, formData, { pn: pn, page_size: length })) + setLastFormData(Object.assign({}, lastFormData, { pn: pn, page_size: length })) + getData(Object.assign({}, formData, { pn: pn, page_size: length })) + } + } + //切换每页条数 + const changeLength = (pn, length) => { + setFormData(Object.assign({}, formData, { pn: 1, page_size: length })) + setLastFormData(Object.assign({}, lastFormData, { pn: 1, page_size: length })) + getData(Object.assign({}, formData, { pn: 1, page_size: length })) + } + //检索数据 + const getSearchData = (data = formData) => { + getData(data) + } + + const [getOperationName, setGetOperationName] = useState([]) + const operationName = () => { + ajax.assetsType().then(res => { + setGetOperationName(res.data) + }) + } + const [getMerchantDataName, setGetMerchantDataName] = useState([]) + const merchantDataName = () => { + ajax.getOperator().then(res => { + setGetMerchantDataName(res.data) + }) + } + const [getAssetsModel, setGetAssetsModel] = useState([]) + const assetsModelName = () => { + let data = { + brand_id: getBrandId + } + ajax.assetsModel(data).then(res => { + setGetAssetsModel(res.data) + }) + } + useEffect(() => { + assetsModelName() + }, [getBrandId]) + + + const [sessionTabList, setSessionTabList] = useSessionStorageState('MesNotification', { + value: { + } }) - } - // useEffect(() => { - // search() - // }, [pageData]); - useEffect(() => { - getpad() - }, [sendData.receiver_type]) - return ( - <> - { - tag == 2 ? -
-
{ setTag('1') }}>〈返回
-
-
接收人类型
- +
+
+ + +
+
+
+ + +
- } - -
-
发送内容
-