二维码

2 years ago · ec2f907588
8 changed files with 235 additions and 108 deletions
--- a/api/app/lib/controllers/projectRegime/projectSituation.js
+++ b/api/app/lib/controllers/projectRegime/projectSituation.js
@ -211,6 +211,36 @@ async function delPosition (ctx, next) {
 }


+async function qrCodeShow (ctx, next) {
+   try {
+      const models = ctx.fs.dc.models;
+      let userInfo = ctx.fs.api.userInfo;
+      const { projectId, name } = ctx.query;
+
+      let options = {
+         where: {
+            qrCode: { $ne: null }
+         },
+      }
+      if (projectId) {
+         options.where.projectId = projectId
+      }
+      if (name) {
+         options.where.name = { $like: `%${name}%` }
+      }
+
+      let res = await models.Point.findAndCountAll(options)
+      ctx.status = 200;
+      ctx.body = res
+   } catch (error) {
+      ctx.fs.logger.error(`path: ${ctx.path}, error: ${error}`);
+      ctx.status = 400;
+      ctx.body = {
+         "message": "获取二维码列表失败"
+      }
+   }
+}
+

 module.exports = {
   projectList,
@ -219,4 +249,5 @@ module.exports = {
   addPosition,
   position,
   delPosition,
+   qrCodeShow
 }
--- a/api/app/lib/routes/projectRegime/index.js
+++ b/api/app/lib/routes/projectRegime/index.js
@ -22,4 +22,7 @@ module.exports = function (app, router, opts) {
    app.fs.api.logAttr['DEL/delPosition/:id'] = { content: '删除点位', visible: false };
    router.del('/delPosition/:id', projectSituation.delPosition);

+    app.fs.api.logAttr['GET/qrCodeShow'] = { content: '获取二维码列表', visible: false };
+    router.get('/qrCodeShow', projectSituation.qrCodeShow);
+
 }
--- a/api/log/development.log
+++ b/api/log/development.log
@ -3849,3 +3849,6 @@ notNull Violation: project.describe cannot be null
 2023-01-16 20:45:57.174 - debug: [FS-LOGGER] Init.
 2023-01-16 20:45:57.417 - info: [FS-ATTACHMENT] Inject attachment mw into router.
 2023-01-16 20:45:57.418 - info: [FS-AUTH] Inject auth and api mv into router.
+2023-01-17 09:24:14.329 - debug: [FS-LOGGER] Init.
+2023-01-17 09:24:15.116 - info: [FS-ATTACHMENT] Inject attachment mw into router.
+2023-01-17 09:24:15.117 - info: [FS-AUTH] Inject auth and api mv into router.
--- a/web/client/src/sections/projectRegime/actions/projectSituation.js
+++ b/web/client/src/sections/projectRegime/actions/projectSituation.js
@ -76,3 +76,15 @@ export function delPosition (id) {
   });
 }

+
+export function qrCodeShow (query) {
+   return (dispatch) => basicAction({
+      type: 'get',
+      query,
+      dispatch,
+      actionType: 'GET_QR_CODE',
+      url: ApiTable.qrCodeShow,
+      msg: { error: '获取二维码列表失败', },
+   });
+}
+
--- a/web/client/src/sections/projectRegime/components/pointModel.js
+++ b/web/client/src/sections/projectRegime/components/pointModel.js
@ -0,0 +1,91 @@
+import React, { useState } from 'react';
+import { Button, Form, Input, Modal, Select, DatePicker } from 'antd';
+const { TextArea } = Input;
+import { connect } from 'react-redux';
+import Uploads from '$components/Uploads';
+import { useEffect } from 'react';
+import moment from 'moment';
+
+const ProjectAddModel = ({ dispatch, actions, user, modelData, close, success, qrCodeId }) => {
+
+   const { projectRegime } = actions
+   const [form] = Form.useForm();
+
+   useEffect(() => {
+      // console.log(modelData);
+
+   }, [])
+
+
+   return (
+      <Modal
+         title={modelData.id ? '编辑点位' : '新增点位'}
+         width={570}
+         open={true}
+         onOk={() => {
+            form.validateFields().then(r => {
+               dispatch(projectRegime.addPosition({
+                  ...r,
+                  id: modelData?.id,
+                  projectId: qrCodeId
+               })).then(res => {
+                  if (res.success) {
+                     success()
+                  }
+               })
+            })
+         }}
+         onCancel={() => {
+            close()
+         }}
+      >
+         <Form
+            style={{}}
+            form={form}
+            labelAlign='right'
+            labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}
+            onFinish={r => {
+
+            }}
+         >
+            <Form.Item label='点位名称' name="name" style={{}}
+               initialValue={modelData?.name}
+               rules={[{ required: true, message: '请输入点位名称' },]}
+            >
+               <Input placeholder="请输入点位名称" allowClear />
+            </Form.Item>
+            <div style={{}}>
+               {/* /^\d+$|^\d*\.\d+$/g */}
+               <Form.Item label="所在地区:" labelCol={{ span: 11 }} labelAlign='right' name="longitude" initialValue={modelData?.longitude} style={{ display: 'inline-block', width: 'calc(60% - 30px)', }}
+                  rules={[{ required: true, message: '请输入横坐标', },]}
+               >
+                  <Input placeholder="经度支持数字" />
+               </Form.Item>
+               ~
+               <Form.Item name="latitude" initialValue={modelData?.latitude} style={{ display: 'inline-block', width: 'calc(40% + 15px)', }}
+                  rules={[{ required: true, message: '请输入纵坐标', },]}
+               >
+                  <Input placeholder="维度支持数字" />
+               </Form.Item>
+            </div>
+            <Form.Item name='describe' label="描述"
+               initialValue={modelData?.describe}
+               rules={[{ required: true, message: '请输入描述内容', },]}>
+               <TextArea />
+            </Form.Item>
+         </Form>
+      </Modal>
+
+   );
+};
+
+
+function mapStateToProps (state) {
+   const { auth, global } = state;
+   return {
+      user: auth.user,
+      actions: global.actions,
+   };
+}
+
+export default connect(mapStateToProps)(ProjectAddModel); 
--- a/web/client/src/sections/projectRegime/containers/point.js
+++ b/web/client/src/sections/projectRegime/containers/point.js
@ -5,7 +5,7 @@ const { TextArea } = Input;
 import moment from "moment";
 import '../style.less';
 import { push } from 'react-router-redux';
-import ProjectAddModel from '../components/projectAddModel'
+import PointModel from '../components/pointModel'
 import { Model } from 'echarts';


@ -28,7 +28,7 @@ const Information = (props) => {

   var QRCode = require('qrcode')

-
+   const qrCodeId = props?.match?.params?.id

   useEffect(() => {
      console.log(props?.match?.params?.id);
@ -37,7 +37,7 @@ const Information = (props) => {

   const projectList = (obj) => {
      const { limit, page } = obj
-      dispatch(projectRegime.positionList({ limit, page, projectId: props?.match?.params?.id })).then(res => {
+      dispatch(projectRegime.positionList({ limit, page, projectId: qrCodeId })).then(res => {
         // console.log(res)
         if (res.success) {
            let data = []
@ -194,82 +194,22 @@ const Information = (props) => {
            }}
         />
         {
-            <Modal
-               title={modelData.id ? '编辑点位' : '新增点位'}
-               width={570}
-               open={addModel}
-               onOk={() => {
-                  form.validateFields().then(r => {
-                     dispatch(projectRegime.addPosition({
-                        ...r,
-                        id: modelData?.id,
-                        projectId: props?.match?.params?.id
-                     })).then(res => {
-                        if (res.success) {
-                           setAddModel(false)
-                           setModelData({})
-                           setQuery({ limit: 10, page: 0 });
-                           projectList({ limit: 10, page: 0 })
-                        }
-                     })
-                  })
-               }}
-               onCancel={() => {
-                  setAddModel(false)
-                  setModelData({})
-               }}
-            >
-               <Form
-                  style={{}}
-                  form={form}
-                  labelAlign='right'
-                  labelCol={{ span: 6 }} wrapperCol={{ span: 18 }}
-                  onFinish={r => {
-
-                  }}
-               >
-                  <Form.Item label='点位名称' name="name" style={{}}
-                     initialValue={modelData?.name}
-                     rules={[{ required: true, message: '请输入点位名称' },]}
-                  >
-                     <Input placeholder="请输入点位名称" allowClear />
-                  </Form.Item>
-                  <div style={{}}>
-                     {/* /^\d+$|^\d*\.\d+$/g */}
-                     <Form.Item label="所在地区:" labelCol={{ span: 11 }} labelAlign='right' name="longitude" initialValue={modelData?.longitude} style={{ display: 'inline-block', width: 'calc(60% - 30px)', }}
-                        rules={[{ required: true, message: '请输入横坐标', },]}
-                     >
-                        <Input placeholder="经度支持数字" />
-                     </Form.Item>
-                     ~
-                     <Form.Item name="latitude" initialValue={modelData?.latitude} style={{ display: 'inline-block', width: 'calc(40% + 15px)', }}
-                        rules={[{ required: true, message: '请输入纵坐标', },]}
-                     >
-                        <Input placeholder="维度支持数字" />
-                     </Form.Item>
-                  </div>
-                  <Form.Item name='describe' label="描述"
-                     initialValue={modelData?.describe}
-                     rules={[{ required: true, message: '请输入描述内容', },]}>
-                     <TextArea />
-                  </Form.Item>
-               </Form>
-            </Modal>
-         }
-         {/* {
            addModel ?
-               <ProjectAddModel
-                  firmList={firmList}
+               <PointModel
                  modelData={modelData}
+                  qrCodeId={qrCodeId}
                  close={() => {
                     setAddModel(false)
                     setModelData({})
                  }}
                  success={() => {
-                     
+                     setAddModel(false)
+                     setModelData({})
+                     setQuery({ limit: 10, page: 0 });
+                     projectList({ limit: 10, page: 0 })
                  }}
               /> : ""
-         } */}
+         }
      </>
   )
 }
--- a/web/client/src/sections/projectRegime/containers/qrCode.js
+++ b/web/client/src/sections/projectRegime/containers/qrCode.js
@ -5,6 +5,7 @@ import moment from "moment";
 import '../style.less';
 import ProjectAddModel from '../components/projectAddModel'
 import { Model } from 'echarts';
+import { login } from '../../auth/actions/auth';

 const QrCode = (props) => {
   const { dispatch, actions, user, loading } = props
@ -28,55 +29,100 @@ const QrCode = (props) => {
            setFirmList(res.payload.data?.rows?.map(v => ({ value: v.id, label: v.name })))
         }
      })
+      projectList({})
   }, [])

   const projectList = (obj) => {
-      const { limit, page, companyId, name, type } = obj
-      dispatch(projectRegime.getProjectList({ limit, page, companyId, name, type })).then(res => {
-         // console.log(res)
+      const { projectId, name } = obj
+      dispatch(projectRegime.qrCodeShow({ projectId, name })).then(res => {
         if (res.success) {
-            settableList(res.payload.data?.rows?.map(v => ({ ...v, key: v.id })))
-            setLimits(res.payload.data?.count)
+            settableList(res.payload.data?.rows)
         }
      })
   }
-
+   console.log(firmList);

   return (
      <>
-         <div style={{ display: 'flex', justifyContent: 'space-between', padding: '0 10px' }}>
-            <Form
-               style={{ display: 'flex', }}
-               onFinish={r => {
-                  projectList(r)
-                  setSearch(r)
-               }}
+         <Form
+            style={{ display: 'flex', }}
+            onFinish={r => {
+               projectList(r)
+            }}
+         >
+            <Form.Item
+               label='结构物名称'
+               name="projectId"
+               style={{ marginRight: 16, width: 240 }}
+            // initialValue={firmList[0]?.name}
+            >
+               <Select allowClear placeholder="请选择结构物名称" options={firmList} />
+            </Form.Item>
+            <Form.Item
+               label='点位名称'
+               name="name"
+               style={{ marginRight: 16, width: 260 }}
            >
-               <Form.Item
-                  label='所属公司'
-                  name="companyId"
-                  style={{ marginRight: 16, minWidth: 180 }}
-                  initialValue={firmList[0]?.name}
-               >
-                  <Select allowClear placeholder="全部" options={firmList} />
-               </Form.Item>
-               <Form.Item
-                  label='项目名称'
-                  name="name"
-                  style={{ marginRight: 16, minWidth: 180 }}
-               >
-                  <Input placeholder="请输入项目名称" allowClear />
-               </Form.Item>
-               <Form.Item wrapperCol={{}}>
-                  <Button type="primary" htmlType="submit">
-                     搜索
-                  </Button>
-               </Form.Item>
-            </Form>
-            <Button onClick={() => {
-               console.log(45513);
-               setAddModel(true)
-            }}>新建项目</Button>
+               <Input placeholder="请输入点位名称" allowClear />
+            </Form.Item>
+            <Form.Item wrapperCol={{}}>
+               <Button type="primary" htmlType="submit">
+                  搜索
+               </Button>
+            </Form.Item>
+         </Form>
+         <div >
+            {
+               tableList?.map(v => {
+                  return <div key={v.name + v.id}
+                     style={{ display: 'inline-block', margin: '0 10px 10px 0', border: '1px solid #3c383824' }} >
+                     <div style={{
+                        display: 'flex', flexDirection: 'column', padding: '6px 0',
+                        marginLeft: 20, width: 220, borderBottom: '1px solid #3c383824'
+                     }}>
+                        <span>结构物名称：{firmList?.filter(u => u.value == v.projectId)[0]?.label}</span>
+                        <span>结构物名称：{v.name}</span>
+                     </div>
+                     <img src={v.qrCode} style={{ display: 'inline-block', width: 260 }} />
+                     <div style={{
+                        width: 260, height: 60, background: '#e1d4d42e', display: 'flex',
+                        justifyContent: 'center', alignItems: 'center', borderTop: '1px solid #3c383824'
+                     }}>
+                        {/* <a href={`${v.qrCode + '?filename=' + encodeURIComponent(v.name)}.png`}> */}
+                           <Button type="primary" onClick={() => {
+                              const aa = (v) => {
+                                 const img = new Image(),
+                                    canvas = $('.canas'),
+                                    ctx = canvas[0].getContext('2d')
+                                 img.crossOrigin = 'anonymous'
+                                 img.onload = function () {
+                                    const w = 460, h = 490
+                                    canvas.attr({ width: w, height: h })
+                                    ctx.drawImage(img, 0, 0)
+                                    ctx.beginPath()
+                                    ctx.font = 'dcscsdcsd'
+                                    ctx.fillStyle = '#000'
+                                    ctx.fillText('5315', w, h)
+                                    ctx.closePath()
+                                    const save_link = document.createElement('a')
+                                    save_link.href = canvas[0].toDataURl('image/png')
+                                    save_link.download = 'dcscds.png'
+                                    document.body.appendChild(save_link)
+                                    save_link.click()
+                                    save_link.remove()
+                                 }
+                                 img.src = v
+                              }
+                              aa(v.qrCode)
+
+                           }}>下载二维码</Button>
+                        {/* </a> */}
+
+                     </div>
+                  </div>
+               }
+               )
+            }
         </div>

      </>
--- a/web/client/src/utils/webapi.js
+++ b/web/client/src/utils/webapi.js
@ -97,6 +97,7 @@ export const ApiTable = {
   //点位
   position: 'position',
   delPosition: 'delPosition/{id}',
+   qrCodeShow: 'qrCodeShow',

   //视频接入配置
   siteList: 'siteList',