Merge branch 'master' of http://git.ycjcjy.com/civilized_city/pc-admin

package.json

@@ -17,6 +17,7 @@
     "antd": "^5.0.5",
     "axios": "^1.2.0",
     "classnames": "^2.3.2",
+    "dayjs": "^1.11.7",
     "echarts": "^5.4.0",
     "md5": "^2.3.0",
     "react": "18.1.0",

src/components/Wangeditor/index.jsx

@@ -12,11 +12,11 @@ const defaultStyle = {
 }
 
 function MyEditor(props) {
-
   const style = React.useMemo(() => ({ ...defaultStyle, ...(props.style || {}) }), [props.style])
 
   const {
-    value = "",
+    value = '',
+    height = '500px',
     onChange = (e) => {
       setHtml(e);
     },
@@ -76,7 +76,7 @@ function MyEditor(props) {
         onCreated={setEditor}
         onChange={handleChange}
         mode="default"
-        style={{ height: "500px" }}
+        style={{ height }}
       />
     </div>
   ) : (

src/main.jsx

@@ -1,11 +1,16 @@
 import React from 'react'
 import ReactDOM from 'react-dom/client'
+import 'dayjs/locale/zh-cn';
+import locale from 'antd/locale/zh_CN';
+import { ConfigProvider } from 'antd';
 import Router from './routes/Router'
 import './index.less'
 import { Provider } from './store'
 
 ReactDOM.createRoot(document.getElementById('root')).render(
   <Provider>
-    <Router />
+    <ConfigProvider locale={locale}>
+      <Router />
+    </ConfigProvider>
   </Provider>
 )

src/pages/check/Edit.jsx

@@ -0,0 +1,40 @@
+import React from 'react';
+import { Row, Col, Card, Button } from 'antd';
+import { PlusOutlined } from '@ant-design/icons';
+import Page from '@/components/Page';
+import CheckForm from './components/CheckForm';
+import { useSearchParams } from 'react-router-dom';
+import { getTaCheckById } from '@/service/tacheck';
+import LocForm from './components/LocForm';
+
+export default (props) => {
+  const [searchParams] = useSearchParams();
+
+  const [checkInfo, setCheckInfo] = React.useState();
+  const locRef = React.useRef();
+
+  const id = searchParams.get('id');
+
+  React.useEffect(() => {
+    if (id) {
+      getTaCheckById(id).then(setCheckInfo);
+    }
+  }, [id]);
+
+  return (
+    <Page>
+      <CheckForm checkInfo={checkInfo} onChange={setCheckInfo} />
+      <Row gutter={24} style={{marginTop: '24px'}}>
+        <Col span={12}>
+          <Card title="实例调查" extra={<Button icon={<PlusOutlined />} onClick={() => locRef.current.newQu()}>问题</Button>}>
+            <LocForm ref={locRef} checkId={id} />
+          </Card>
+        </Col>
+        <Col span={12}>
+          <Card title="问卷调查">
+          </Card>
+        </Col>
+      </Row>
+    </Page>
+  )
+}

src/pages/check/components/CheckForm.jsx

@@ -0,0 +1,68 @@
+import React from 'react';
+import dayjs from 'dayjs';
+import { Row, Col, Button, Form, Input, DatePicker } from 'antd';
+import { ModalForm } from '@ant-design/pro-components';
+import { postTaCheck, putTaCheck } from '@/service/tacheck';
+
+export default (props) => {
+  const { checkInfo, onChange } = props;
+
+  const [open, setOpen] = React.useState(false);
+  const [form] = Form.useForm();
+
+  const title = checkInfo ? checkInfo.title : '点击编辑创建';
+  const dateStr = checkInfo ? `${checkInfo.startDate} ~ ${checkInfo.endDate}` : '';
+
+  const onFinish = async (values) => {
+    const data = {
+      ...values,
+      startDate: dayjs(values.startDate).format('YYYY-MM-DD'),
+      endDate: dayjs(values.endDate).format('YYYY-MM-DD'),
+    }
+
+    if (!checkInfo) {
+      const res = await postTaCheck(data);
+      onChange(res);
+    } else {
+      const res = await putTaCheck(checkInfo.checkId, data);
+      onChange(res);
+    }
+
+    return true;
+  }
+
+  React.useEffect(() => {
+    if (checkInfo) {
+      form.setFieldsValue({
+        ...checkInfo,
+        startDate: dayjs(checkInfo.startDate),
+        endDate: dayjs(checkInfo.endDate),
+      });
+    }
+  }, [checkInfo]);
+
+  return (
+    <Row gutter={48}>
+      <Col span={18}>
+        <h2 style={{ textAlign: 'center' }} >{title}</h2>
+        <Row>
+          <Col span={8} offset={16}>{dateStr}</Col>
+        </Row>
+      </Col>
+      <Col span={4}>
+        <Button onClick={() => setOpen(true)}>编辑</Button>
+      </Col>
+      <ModalForm title="测评维护" open={open} width={480} form={form} onFinish={onFinish} onOpenChange={setOpen}>
+          <Form.Item name="title" label="测评名称" required>
+            <Input placeholder="请输入测评名称" />
+          </Form.Item>
+          <Form.Item name="startDate" label="开始时间" required>
+            <DatePicker placeholder="请选择" style={{ width: '100%' }} />
+          </Form.Item>
+          <Form.Item name="endDate" label="结束时间" required>
+            <DatePicker placeholder="请选择" style={{ width: '100%' }} />
+          </Form.Item>
+      </ModalForm>
+    </Row>
+  )
+}

src/pages/check/components/LocForm.jsx

@@ -0,0 +1,123 @@
+import React from 'react';
+import { Button, Tabs, Form, Row, Col, InputNumber, message } from 'antd';
+import useBool from '@/utils/hooks/useBool';
+import { getTdLocType } from '@/service/tdloctype';
+import { getByCheckId, postTaCheckItem } from '@/service/tacheckitem';
+import QuManage from './QuManage';
+
+const ItemForm = (props) => {
+  const {checkId, typeId, onChange} = props;
+
+  const [form] = Form.useForm();
+  const [loading, startLoading, stopLoading] = useBool();
+
+  const onFinish = (values) => {
+    const data = {...values, checkId, typeId, itemType: 'loc'}
+
+    startLoading();
+    postTaCheckItem(data).then(res => {
+      onChange(res);
+      form.setFieldsValue(res);
+      stopLoading();
+    }).catch(() => {
+      stopLoading();
+    });
+  }
+
+  const reset = () => {
+    form.resetFields();
+    form.setFieldsValue({ num: 1 });
+    onChange();
+  }
+
+  React.useEffect(() => {
+    if (checkId && typeId) {
+      startLoading();
+      getByCheckId(checkId, typeId).then(res => {
+        if (res) {
+          onChange(res);
+          form.setFieldsValue(res);
+        } else {
+          reset();
+        }
+        stopLoading();
+      }).catch(() => {
+        stopLoading();
+        reset();
+      });
+    } else {
+      reset();
+    }
+  }, [checkId, typeId]);
+
+  return (
+    <Form layout="inline" form={form} onFinish={onFinish}>
+      <Form.Item label="数量" name="num">
+        <InputNumber min={1} />
+      </Form.Item>
+      <Form.Item label="总分" name="fullScore">
+        <InputNumber min={0.00} precision={2} />
+      </Form.Item>
+      <Form.Item>
+        <Button disabled={!checkId || !typeId} loading={loading} type="primary" htmlType="submit">
+          确定
+        </Button>
+      </Form.Item>
+    </Form>
+  )
+}
+
+export default React.forwardRef((props, ref) => {
+  const {checkId} = props;
+  const [locList, setLocList] = React.useState([]);
+  const quRef = React.useRef();
+  const [checkItem, setCheckItem] = React.useState();
+  const [typeId, setTypeId] = React.useState();
+
+  const tabItems = React.useMemo(() => {
+    return locList.map(x => ({
+      label: x.name,
+      key: x.typeId,
+    }));
+  }, [locList]);
+
+  React.useEffect(() => {
+    getTdLocType({ pageSize: 500 }).then(res => {
+      const list = res.records;
+      setLocList(list);
+      // 默认第一个
+      setTypeId(list[0]?.typeId);
+    });
+  }, []);
+
+  
+  React.useImperativeHandle(ref, () => ({
+    newQu: () => {
+      if (!checkItem) {
+        message.warning('请先设置数量, 总分等');
+        return;
+      }
+      quRef.current.add();
+    },
+  }), [checkItem]);
+
+  return (
+    <div style={{display: 'flex'}}>
+      <div style={{flex: 'none'}}>
+        <Tabs
+          tabPosition="left"
+          activeKey={typeId}
+          items={tabItems}
+          onChange={(activeKey) => {
+            setTypeId(activeKey)
+            setCheckItem()
+          }}
+        />
+      </div>
+      <div style={{flex: 1}}>
+        <ItemForm checkId={checkId} typeId={typeId} onChange={setCheckItem} />
+        <QuManage ref={quRef} itemId={checkItem?.itemId} />
+      </div>
+    </div>
+  )
+})

src/pages/check/components/QuManage.jsx

@@ -0,0 +1,193 @@
+import React from 'react';
+import { Button, Form, Row, Col, Input, Modal, List } from 'antd';
+import {
+  DrawerForm,
+  ProFormGroup,
+  ProFormText,
+  ProFormSelect,
+  ProFormDigit,
+  ProFormList
+} from '@ant-design/pro-components';
+import WangEditor from '@/components/Wangeditor';
+import { postTaCheckItemQu, getTaCheckItemQu } from '@/service/tdlocquestion';
+
+export default React.forwardRef((props, ref) => {
+
+  const { itemId, onChange } = props;
+  
+  const [open, setOpen] = React.useState(false);
+  const [quInfo, setQuInfo] = React.useState(false);
+  const [list, setList] = React.useState([]);
+  const [form] = Form.useForm();
+
+  const onFinish = async (values) => {
+    const data = { ...(quInfo || {}), ...values, itemId }
+    const res = await postTaCheckItemQu(data);
+    onChange(res);
+
+    return true;
+  }
+
+  React.useEffect(() => {
+    if (quInfo) {
+      form.setFieldsValue(quInfo);
+    }
+  }, [quInfo]);
+
+  React.useEffect(() => {
+    if (itemId) {
+      getTaCheckItemQu({pageSize: 500, itemId}).then((res) => {
+        setList(res.records);
+      });
+    }
+  }, [itemId]);
+
+  React.useImperativeHandle(ref, () => ({
+    add: () => setOpen(true),
+  }), []);
+
+  return (
+    <div>
+      <DrawerForm title="问题维护" open={open} width={800} form={form} onFinish={onFinish} onOpenChange={setOpen}>
+        <ProFormText
+          name="title"
+          label="题干描述"
+          placeholder="请填写"
+          rules={[
+            {
+              required: true,
+              message: '请填写题干',
+            },
+          ]}
+        />
+        <Row gutter={24}>
+          <Col span={12}>
+            <ProFormSelect
+              name="quType"
+              label="问题类型"
+              fieldProps={{
+                style: { width: '100%' }
+              }}
+              valueEnum={{
+                radio: '单选',
+                fill: '填空'
+              }}
+              rules={[
+                {
+                  required: true,
+                  message: '请选择问题类型',
+                },
+              ]}
+            />
+          </Col>
+          <Col span={12}>
+            <ProFormSelect
+              name="computeType"
+              label="计分方式"
+              fieldProps={{
+                style: { width: '100%' }
+              }}
+              valueEnum={{
+                '+': '得分',
+                '-': '扣分'
+              }}
+              rules={[
+                {
+                  required: true,
+                  message: '请选择计分方式',
+                },
+              ]}
+            />
+          </Col>
+        </Row>
+        <Row gutter={24}>
+          <Col span={12}>
+            <ProFormDigit
+              name="maxScore"
+              label="最 高 分"
+              min={0}
+              fieldProps={{ precision: 2 }}
+              rules={[
+                {
+                  required: true,
+                  message: '请设置最高分',
+                },
+              ]}
+            />
+          </Col>
+          <Col span={12}>
+            <ProFormDigit
+              name="anScore"
+              label="单项计分"
+              min={0}
+              fieldProps={{ precision: 2 }}
+              rules={[
+                {
+                  required: true,
+                  message: '请设置单项计分',
+                },
+              ]}
+            />
+          </Col>
+        </Row>
+        <Form.Item name="stand" label="评分标准">
+          <WangEditor
+            height="200px"
+            toolbarConfig={{
+              toolbarKeys: [
+                'headerSelect',
+                'blockquote',
+                '|',
+                'bold',
+                'underline',
+                'italic',
+                'color',
+                'fontSize',
+                '|',
+                'bulletedList',
+                'numberedList',
+              ]
+            }}
+          />
+        </Form.Item>
+        <ProFormList
+          name="answerList"
+          label="选项列表"
+          copyIconProps={false}
+        >
+          <Row gutter={24} style={{width: '730px'}}>
+            <Col span={6}>
+              <ProFormText
+                name="answerCode"
+                label="选项"
+                help="类似 A, B, C, D"
+              />
+            </Col>
+            <Col span={6}>
+              <ProFormDigit
+                name="score"
+                label="计分"
+                min={0}
+                fieldProps={{ precision: 2 }}
+              />
+            </Col>
+            <Col span={12}>
+              <ProFormText
+                name="answer"
+                label="答案"
+                placeholder="具体选项内容"
+              />
+            </Col>
+          </Row>
+        </ProFormList>
+      </DrawerForm>
+      <List
+        itemLayout="horizontal"
+        dataSource={list}
+        renderItem={(item) => (
+          item.title
+        )}
+      />
+    </div>
+  )
+});

src/pages/check/index.jsx

@@ -0,0 +1,107 @@
+import React from 'react';
+import Page from '@/components/Page';
+import { useNavigate } from 'react-router-dom';
+import { queryTable } from "@/utils/request";
+import { ProTable } from "@ant-design/pro-components";
+import { Button, message, Popconfirm } from "antd";
+import { getTaCheck } from '@/service/tacheck';
+
+const queryList = queryTable(getTaCheck);
+
+export default (props) => {
+
+  const navigate = useNavigate();
+  const actionRef = React.useRef();
+
+  const columns = [
+    {
+      title: "测评名称",
+      dataIndex: "title",
+    },
+    {
+      title: "开始日期",
+      dataIndex: "startDate",
+    },
+    {
+      title: "结束日期",
+      dataIndex: "endDate",
+    },
+    {
+      title: "状态",
+      dataIndex: "status",
+      search: false,
+      valueEnum: {
+        1: {
+          text: "正常",
+          status: "Processing",
+        },
+        0: {
+          text: "禁用",
+          status: "Error",
+        },
+      },
+    },
+    {
+      title: "操作",
+      valueType: "option",
+      width: 200,
+      render: (_, record) => [
+        <Button
+          key={1}
+          style={{ padding: 0 }}
+          type="link"
+          onClick={() => {
+            updateStatus(record);
+          }}
+        >
+          {record.status === 1 ? "禁用" : "启用"}
+        </Button>,
+        <Button
+          key={2}
+          style={{ padding: 0 }}
+          type="link"
+          onClick={() => {
+            console.log(record, "]]");
+            navigate(`/check/edit?id=${record.checkId}`);
+          }}
+        >
+          编辑
+        </Button>,
+        <Popconfirm
+          key={3}
+          title="您是否确认删除 ?"
+          onConfirm={() => handleDelete(record.checkId)}
+          okText="确定"
+          cancelText="取消"
+        >
+          {/* manualPush */}
+          <Button style={{ padding: 0 }} type="link">
+            删除
+          </Button>
+        </Popconfirm>,
+      ],
+    },
+  ]
+
+  return (
+    <Page>
+      <ProTable
+        actionRef={actionRef}
+        rowKey="checkId"
+        toolBarRender={() => [
+          <Button
+            key="1"
+            type="primary"
+            onClick={() => {
+              navigate("/check/edit");
+            }}
+          >
+            新增
+          </Button>,
+        ]}
+        request={queryList}
+        columns={columns}
+      />
+    </Page>
+  )
+}

src/routes/routes.jsx

@@ -5,7 +5,7 @@ import {
   MailOutlined,
   MenuFoldOutlined,
   MenuUnfoldOutlined,
-  PieChartOutlined,
+  ProjectOutlined,
   SettingOutlined,
 } from '@ant-design/icons';
 import { Outlet } from 'react-router-dom';
@@ -15,7 +15,8 @@ import Page404 from '@/pages/404';
 import Role from '@/pages/role/index';
 import User from '@/pages/user/index';
 import UserEdit from '@/pages/user/Edit';
-
+import CheckList from '@/pages/check';
+import CheckEdit from '@/pages/check/Edit';
 
 import Index from '@/pages/index';
 import Home from "@/pages/sample/home";
@@ -145,6 +146,35 @@ export const authRoutes = [
       },
     ]
   },
+  {
+    path: "check",
+    element: <Outlet />,
+    meta: {
+      title: '模拟测评',
+      icon: <ProjectOutlined />,
+      // permission: 'form',
+    },
+    children: [
+      {
+        index: true,
+        element: <CheckList />,
+      },
+      {
+        path: "list",
+        element: <CheckList />,
+        meta: {
+          title: '测评列表',
+        }
+      },
+      {
+        path: "edit",
+        element: <CheckEdit />,
+        meta: {
+          title: '测评维护',
+        }
+      }
+    ]
+  }
 
   // {
   //   path: "form",

src/service/tacheck.js

@@ -3,24 +3,24 @@ import request from '@/utils/request';
 /*
  * 分页查询
  */
-export const getTaMockCheck = (params) => request('/api/taMockCheck', { params });
+export const getTaCheck = (params) => request('/api/taCheck', { params });
 
 /*
  * 新增数据
  */
-export const postTaMockCheck = (data) => request('/api/taMockCheck', { data, method: 'post' });
+export const postTaCheck = (data) => request('/api/taCheck', { data, method: 'post' });
 
 /*
  * 通过ID查询单条数据
  */
-export const getTaMockCheckById = (id) => request(`/api/taMockCheck/${id}`);
+export const getTaCheckById = (id) => request(`/api/taCheck/${id}`);
 
 /*
  * 更新数据
  */
-export const putTaMockCheck = (id, data) => request(`/api/taMockCheck/${id}`, { data, method: 'put' });
+export const putTaCheck = (id, data) => request(`/api/taCheck/${id}`, { data, method: 'put' });
 
 /*
  * 通过主键删除数据
  */
-export const deleteTaMockCheck = (id) => request(`/api/taMockCheck/${id}`, { method: 'delete' });
+export const deleteTaCheck = (id) => request(`/api/taCheck/${id}`, { method: 'delete' });

src/service/tacheckitem.js

@@ -24,3 +24,12 @@ export const putTaCheckItem = (id, data) => request(`/api/taCheckItem/${id}`, {
  * 通过主键删除数据
  */
 export const deleteTaCheckItem = (id) => request(`/api/taCheckItem/${id}`, { method: 'delete' });
+
+
+/**
+ * 通过测评ID,点位ID查询详情
+ * @param {*} checkId 
+ * @param {*} typeId 
+ * @returns 
+ */
+export const getByCheckId = (checkId, typeId) => request(`/api/taCheck/${checkId}/item/${typeId}`)

src/utils/form.js

@@ -0,0 +1,23 @@
+
+export const formItemLayout = {
+  labelCol: {
+    xs: { span: 24 },
+    sm: { span: 8 },
+  },
+  wrapperCol: {
+    xs: { span: 24 },
+    sm: { span: 16 },
+  },
+};
+export const tailFormItemLayout = {
+  wrapperCol: {
+    xs: {
+      span: 24,
+      offset: 0,
+    },
+    sm: {
+      span: 16,
+      offset: 8,
+    },
+  },
+};