diff --git a/build.bat b/build.bat new file mode 100644 index 0000000..10da9ff --- /dev/null +++ b/build.bat @@ -0,0 +1 @@ +npm run build \ No newline at end of file diff --git a/src/App.js b/src/App.js index 84591f4..9506f19 100644 --- a/src/App.js +++ b/src/App.js @@ -18,6 +18,9 @@ import ProtectedRoute from "./views/ProtectedRoute" import Customer_care_inchina from "./charts/Customer_care_inchina" import Customer_care_potential from "./charts/Customer_care_potential" import Customer_care_regular from "./charts/Customer_care_regular" +import Wechat_session from "./charts/Wechat_session" +import WhatsApp_session from "./charts/WhatsApp_session" +import Credit_card_bill from "./views/Credit_card_bill" import Logo from './logo.png' import {stores_Context} from "./config"; import {observer} from "mobx-react"; @@ -39,6 +42,8 @@ const App = () => { {key: 31, label: 潜力客户}, {key: 32, label: 老客户}, {key: 33, label: 在华客户}, + {key: 34, label: 微信会话存档}, + {key: 35, label: WhatsApp会话存档}, ] }, { @@ -46,8 +51,7 @@ const App = () => { label: '财务', icon: , children: [ - {key: 412, label: 损益表}, - {key: 41, label: 信用卡账单}, + {key: 41, label: 信用卡账单}, ] }, @@ -84,6 +88,11 @@ const App = () => { }/> }/> }/> + }/> + }/> + + }> + }/> diff --git a/src/charts/BillTypeSelect.js b/src/charts/BillTypeSelect.js new file mode 100644 index 0000000..1f249e9 --- /dev/null +++ b/src/charts/BillTypeSelect.js @@ -0,0 +1,33 @@ +import React, {Component} from 'react'; +import {Select} from 'antd'; +import {observer} from 'mobx-react'; + + +const BillTypeSelect = (props) => { + const {store} = props; + return ( + + + {props.show_all ? ALL 账单类型 : ''} + {Object.keys(store.data).length == 0 ? '' : store.data.map((item, index) => { + return ( + {item.cb_billtype} + ) + + }) + } + + + ); + +} + +export default observer(BillTypeSelect); + diff --git a/src/charts/Business_unit.js b/src/charts/Business_unit.js new file mode 100644 index 0000000..e7b9a98 --- /dev/null +++ b/src/charts/Business_unit.js @@ -0,0 +1,28 @@ +import React, {Component} from 'react'; +import {Select} from 'antd'; +import {observer} from "mobx-react"; + + +const Business_unit = (props) => { + const {store} = props; + return ( + + store.bu_handleChange(value)} + > + {props.show_all ? ALL 事业部 : ''} + 公共开支 + GH事业部 + 国际事业部 + 孵化学院 + + + ); +} + +export default observer(Business_unit); diff --git a/src/charts/GroupSelect.js b/src/charts/GroupSelect.js index 912aed8..de5ed42 100644 --- a/src/charts/GroupSelect.js +++ b/src/charts/GroupSelect.js @@ -9,7 +9,7 @@ class GroupSelect extends Component { } render() { - const store=this.props.store; + const store = this.props.store; return ( store.handleChange(value)} + onChange={(value) => store.group_handleChange(value)} > + {this.props.show_all ? ALL 小组 : ''} CH直销 CH大客户 AH diff --git a/src/charts/Wechat_session.js b/src/charts/Wechat_session.js new file mode 100644 index 0000000..aadccf5 --- /dev/null +++ b/src/charts/Wechat_session.js @@ -0,0 +1,66 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, List, Avatar, Table, Space, Radio, Tooltip} from 'antd'; +import { + ContainerOutlined, + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import {Line} from "@ant-design/charts"; +import {observer} from 'mobx-react'; +import DatePickerCharts from '../charts/DatePickerCharts' +import {NavLink, useParams} from "react-router-dom"; +import * as comm from "../utils/commons"; +import * as config from "../config"; +import SiteSelect from "../charts/SiteSelect"; +import GroupSelect from "../charts/GroupSelect"; +import {utils, writeFileXLSX} from "xlsx"; + +const Wechat_session = () => { + + const {orders_store, date_picker_store, customer_store} = useContext(stores_Context); + const inchina_data = customer_store.inchina_data; + + useEffect(() => { + + }, []) + const data = [ + { + title: 'Ant Design Title 1', + }, + { + title: 'Ant Design Title 2', + }, + { + title: 'Ant Design Title 3', + }, + { + title: 'Ant Design Title 4', + }, + ]; + + return ( + + + + ( + + } + title={{item.title}} + description="" + /> + + )} + /> + + + + + ); + +} +export default observer(Wechat_session); + diff --git a/src/charts/WhatsApp_session.js b/src/charts/WhatsApp_session.js new file mode 100644 index 0000000..205c19f --- /dev/null +++ b/src/charts/WhatsApp_session.js @@ -0,0 +1,40 @@ +import React, {useContext, useEffect} from 'react'; +import {Row, Col, Button, Divider, Table, Space, Radio, Tooltip} from 'antd'; +import { + ContainerOutlined, + SearchOutlined, +} from '@ant-design/icons'; +import {stores_Context} from '../config' +import {Line} from "@ant-design/charts"; +import {observer} from 'mobx-react'; +import DatePickerCharts from '../charts/DatePickerCharts' +import {NavLink, useParams} from "react-router-dom"; +import * as comm from "../utils/commons"; +import * as config from "../config"; +import SiteSelect from "../charts/SiteSelect"; +import GroupSelect from "../charts/GroupSelect"; +import {utils, writeFileXLSX} from "xlsx"; + +const WhatsApp_session = () => { + + const {orders_store, date_picker_store, customer_store} = useContext(stores_Context); + const inchina_data = customer_store.inchina_data; + + useEffect(() => { + + }, []) + + + return ( + + + + WhatsAPP会话 + + + + ); + +} +export default observer(WhatsApp_session); + diff --git a/src/config.js b/src/config.js index a07dcf8..5d3c28c 100644 --- a/src/config.js +++ b/src/config.js @@ -2,5 +2,5 @@ import React from "react"; export const stores_Context = React.createContext(); export const DATE_FORMAT = 'YYYY-MM-DD'; -export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; -//export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file +//export const HT_HOST = 'https://p9axztuwd7x8a7.mycht.cn'; +export const HT_HOST = 'http://202.103.68.100:890';//889正式库 \ No newline at end of file diff --git a/src/stores/AuthStore.js b/src/stores/AuthStore.js index 1d9c6cc..9c093ad 100644 --- a/src/stores/AuthStore.js +++ b/src/stores/AuthStore.js @@ -9,11 +9,11 @@ class AuthStore { constructor(rootStore) { this.rootStore = rootStore; makeAutoObservable(this); - this.get_auth(); + //this.get_auth(); } - auth = []; - user = {}; + auth = ['admin']; + user = {name:'ycc',userid:'12345678'}; has_permission(requireds) { if (Object.keys(requireds).length == 0) { diff --git a/src/stores/ChatSessionStore.js b/src/stores/ChatSessionStore.js new file mode 100644 index 0000000..47abd6f --- /dev/null +++ b/src/stores/ChatSessionStore.js @@ -0,0 +1,52 @@ +import {makeAutoObservable, runInAction} from "mobx"; +import * as dd from 'dingtalk-jsapi'; +import * as config from "../config"; + + +//会话管理 +class ChatSessionStore { + + constructor(rootStore) { + this.rootStore = rootStore; + makeAutoObservable(this); + } + + wechat_data = { + counselors: [],//顾问列表 + customers: [],//客户列表 + } + + + //请求权限 + get_auth() { + let _this = this; + const CORPID = 'ding48bce8fd3957c96b';//企业的id + dd.runtime.permission.requestAuthCode({ + corpId: CORPID, + onSuccess: function (res) { + console.log(res); + let code = res.code; + let url = '/dingtalk/dingtalkwork/Getusers_auth?code=' + code; + //请求获取HT接口获取用户权限和用户信息 + fetch(config.HT_HOST + url) + .then((response) => response.json()) + .then((json) => { + runInAction(() => { + _this.user = json.result; + _this.auth = json.result.authlist; + }) + }) + .catch((error) => { + console.log('fetch data failed', error); + }); + }, + onFail: function (err) { + console.log(err) + } + }); + } +} + + +export default ChatSessionStore; + diff --git a/src/stores/CustomerStore.js b/src/stores/CustomerStore.js index 3d4bfed..7f97e75 100644 --- a/src/stores/CustomerStore.js +++ b/src/stores/CustomerStore.js @@ -71,7 +71,7 @@ class CustomerStore { group_select_mode: 'multiple',//是否多选分组 groups: ['1', '2', '7'], date_type: 'applyDate', - handleChange: this.handleChange_group_select.bind(this), + group_handleChange: this.handleChange_group_select.bind(this), onChange_datetype: this.onChange_datetype.bind(this), potential_customer_order: this.potential_customer_order.bind(this), onChange_show_detail_table: this.onChange_show_detail_table.bind(this), @@ -141,7 +141,7 @@ class CustomerStore { group_select_mode: 'multiple',//是否多选分组 groups: ['1', '2', '28', '7'], date_type: 'applyDate', - handleChange: this.handleChange_group_select_regular.bind(this), + group_handleChange: this.handleChange_group_select_regular.bind(this), onChange_datetype: this.onChange_datetype_regular.bind(this), regular_customer_order: this.regular_customer_order.bind(this), onChange_show_detail_table: this.onChange_show_detail_table_regular.bind(this), @@ -211,7 +211,7 @@ class CustomerStore { group_select_mode: 'multiple',//是否多选分组 groups: ['1', '2', '28', '7'], date_type: 'applyDate', - handleChange: this.handleChange_group_select_inchina.bind(this), + group_handleChange: this.handleChange_group_select_inchina.bind(this), onChange_datetype: this.onChange_datetype_inchina.bind(this), inchina_customer_order: this.inchina_customer_order.bind(this), onChange_show_detail_table: this.onChange_show_detail_table_inchina.bind(this), diff --git a/src/stores/DashboardStore.js b/src/stores/DashboardStore.js index ee1d125..d554e0a 100644 --- a/src/stores/DashboardStore.js +++ b/src/stores/DashboardStore.js @@ -182,7 +182,7 @@ class DashboardStore { }, ], date_type: 'applyDate', - handleChange: this.handleChange_group_select.bind(this), + group_handleChange: this.handleChange_group_select.bind(this), onChange_datetype: this.onChange_datetype.bind(this), asyncFetch: this.get_CountYDOrder.bind(this), } diff --git a/src/stores/FinancialStore.js b/src/stores/FinancialStore.js new file mode 100644 index 0000000..1d6f320 --- /dev/null +++ b/src/stores/FinancialStore.js @@ -0,0 +1,84 @@ +import {makeAutoObservable, runInAction} from "mobx"; +import * as dd from 'dingtalk-jsapi'; +import * as config from "../config"; + + +//财务管理 +class FinancialStore { + + constructor(rootStore) { + this.rootStore = rootStore; + makeAutoObservable(this); + this.get_bill_types(); + } + + bill_type_data = { + data: [], + bill_type_mode: false, + bill_types: ['ALL'], + bt_handleChange: this.bt_handleChange.bind(this), + } + + bt_handleChange(value) { + this.bill_type_data.bill_types = value; + }; + + get_bill_types() { + const date_picker_store = this.rootStore.date_picker_store; + let url = '/service-web/QueryData/GetCreditCardBillType'; + fetch(config.HT_HOST + url) + .then((response) => response.json()) + .then((json) => { + runInAction(() => { + this.bill_type_data.data = json.billtype; + }) + }) + .catch((error) => { + console.log('fetch data failed', error); + }); + } + + credit_card_data = { + data: [], + loading:false, + bu_select_mode: false, + business_units: ['ALL'], + group_select_mode: false, + groups: ['ALL'], + bu_handleChange: this.bu_handleChange.bind(this), + group_handleChange: this.group_handleChange.bind(this), + }; + + bu_handleChange(value) { + this.credit_card_data.business_units = value; + }; + + group_handleChange(value) { + this.credit_card_data.groups = value; + }; + + //请求信用卡账单 + get_credit_card_bills() { + const date_picker_store = this.rootStore.date_picker_store; + let url = '/service-web/QueryData/GetCreditCardBills'; + url += `?business_unit=${this.credit_card_data.business_units.toString()}&groups=${this.credit_card_data.groups.toString()}&billtype=${this.bill_type_data.bill_types.toString()}`; + url += '&billdate1=' + date_picker_store.start_date.format(config.DATE_FORMAT) + '&billdate2=' + date_picker_store.end_date.format(config.DATE_FORMAT) + '%2023:59:59'; + if (date_picker_store.start_date_cp && date_picker_store.end_date_cp) { + url += '&billdateOld1=' + date_picker_store.start_date_cp.format(config.DATE_FORMAT) + '&billdateOld2=' + date_picker_store.end_date_cp.format(config.DATE_FORMAT) + '%2023:59:59'; + } + fetch(config.HT_HOST + url) + .then((response) => response.json()) + .then((json) => { + runInAction(() => { + this.credit_card_data.data = json; + }) + }) + .catch((error) => { + console.log('fetch data failed', error); + }); + } +} + + +export default FinancialStore; + diff --git a/src/stores/Index.js b/src/stores/Index.js index 18a75b3..be0d252 100644 --- a/src/stores/Index.js +++ b/src/stores/Index.js @@ -4,6 +4,8 @@ import DashboardStore from "./DashboardStore"; import DatePickerStore from "./DatePickerStore"; import CustomerStore from "./CustomerStore"; import AuthStore from "./AuthStore"; +import ChatSessionStore from "./ChatSessionStore"; +import FinancialStore from "./FinancialStore"; class Index { @@ -13,6 +15,8 @@ class Index { this.date_picker_store = new DatePickerStore(this); this.customer_store = new CustomerStore(this); this.auth_store = new AuthStore(this); + this.chat_session_store = new ChatSessionStore(this); + this.financial_store = new FinancialStore(this); makeAutoObservable(this); } diff --git a/src/views/Credit_card_bill.js b/src/views/Credit_card_bill.js new file mode 100644 index 0000000..7ce23d6 --- /dev/null +++ b/src/views/Credit_card_bill.js @@ -0,0 +1,93 @@ +import React, {Component, useContext} from 'react'; +import {observer} from 'mobx-react'; +import {Row, Col, Button, Tabs, Table} from 'antd'; +import {stores_Context} from '../config' +import {useNavigate} from "react-router-dom"; +import { + SlackOutlined, + SketchOutlined, + AntCloudOutlined, + SearchOutlined, + GithubOutlined +} from '@ant-design/icons'; +import BillTypeSelect from '../charts/BillTypeSelect' +import GroupSelect from '../charts/GroupSelect' +import Business_unit from '../charts/Business_unit' +import DatePickerCharts from '../charts/DatePickerCharts' +import {Line} from "@ant-design/charts"; +import * as com from '../utils/commons' + +const Credit_card_bill = () => { + + const {financial_store} = useContext(stores_Context); + const {bill_type_data, credit_card_data} = financial_store; + const data_source = !com.empty(credit_card_data.data) ? credit_card_data.data.billdate1 : []; + const line_config = { + data: data_source, + padding: 'auto', + xField: 'cb_datetime', + yField: 'cb_usd', + seriesField: 'groups', + xAxis: { + type: 'timeCat', + }, + point: { + size: 4, + shape: 'cicle', + }, + label: {},//显示标签 + legend: { + itemValue: { + formatter: (text, item) => { + const items = data_source.filter((d) => d.groups === item.value);//按站点筛选 + return items.length ? Math.round(items.reduce((a, b) => a + b.cb_usd, 0)) : '';//计算总数 + }, + }, + }, + // tooltip: { + // customContent: (title, items) => { + // const data = items[0]?.data || {}; + // return `${title}${data.seriesField} ${data.yField}`; + // } + // }, + smooth: true, + }; + + return ( + + + + 信用卡账单 + + + + + + + + + + + + + + + + } size='large' loading={credit_card_data.loading} + onClick={() => { + financial_store.get_credit_card_bills(); + }}>统计 + + + + + + + + + + ); + +} + +export default observer(Credit_card_bill); diff --git a/src/views/Orders.js b/src/views/Orders.js index 725443d..9bb1946 100644 --- a/src/views/Orders.js +++ b/src/views/Orders.js @@ -214,7 +214,7 @@ class Orders extends Component { - +