fix: 工作台预览修改为方案名称

src/pages/bsmanager/patrolMaintenance/maintenance/components/QRCodeDesign/index.js

 import React, { useState, useImperativeHandle, forwardRef, useMemo, useEffect } from 'react'
-import { Modal, Form, Input, Table, Button, Switch, Upload, Radio, Checkbox, message } from 'antd'
+import { Modal, Form, Input, Table, Button, Switch, Upload, Radio, Checkbox, message, Tag } from 'antd'
 import { UploadOutlined, FileOutline, ArrowDownOutlined } from '@ant-design/icons'
 import styles from './index.less'
 import QRCode from 'qrcode.react'
@@ -24,6 +24,7 @@ const QRCodeDesign = (props, ref) => {
   const [showList, setShowList] = useState([])
   const [values, setValues] = useState({})
   const [currentRow, setCurrentRow] = useState({})
+  const [minVisible, setMinVisible] = useState(false)
   const [form] = Form.useForm()
 
   const columns = useMemo(() => {
@@ -47,6 +48,7 @@ const QRCodeDesign = (props, ref) => {
         dataIndex: 'DeviceCodeAlias',
         key: 'DeviceCodeAlias',
         align: 'center',
+        render: (value) => <Tag color="processing">{value}</Tag>
       },
       {
         title: '设备类型',
@@ -61,12 +63,19 @@ const QRCodeDesign = (props, ref) => {
         align: 'center',
         render: (_, row) => {
           return (
+            <div
+              className={styles.qrCodeCell}
+              onClick={() => {
+                setMinVisible(true)
+                setCurrentRow(row)
+              }}
+            >
               <QRCodeView
                 id={row.DeviceCode}
                 values={{
                   CorporateName: row.CorporateName || '熊猫水务',
                   Title: row.Title || '设备二维码',
-                IsSystemLogo: Boolean(row.IsSystemLogo) ? '自动使用系统LOGO' : '自定义LOGO',
+                  IsSystemLogo: Boolean(row.IsSystemLogo) ? '系统LOGO' : '自定义LOGO',
                   IsPandaLogo: Boolean(row.IsPandaLogo),
                   LabelLogoUrl: row.LabelLogoUrl,
                   DeviceName: row.DeviceName,
@@ -74,8 +83,9 @@ const QRCodeDesign = (props, ref) => {
                   AccountName: row.AccountName,
                 }}
                 isBatch={false}
-              style={{ width: '310px', height: '490px', zoom: 0.2, margin: '0 auto' }}
+                style={{ width: '310px', height: '490px', zoom: 0.15, margin: '0 auto' }}
               />
+            </div>
           )
         }
       },
@@ -88,7 +98,7 @@ const QRCodeDesign = (props, ref) => {
         render: (_, row) => {
           return (
             <div>
-              <Button type='link' onClick={() => downFile(row)}>下载</Button>
+              <Button type='link' icon={<span className={styles.downIcon}></span>} onClick={() => downFile(row)}>下载</Button>
               {/* <Button type='link' onClick={() => editStyle(row)}>样式编辑</Button> */}
             </div>
           )
@@ -148,8 +158,8 @@ const QRCodeDesign = (props, ref) => {
         setShowList([])
       }
       if (file.status === 'done') {
-        console.log('fileList', fileList)
         setValues({ ...values, LabelLogoUrl: fileList.map(v => v.sourcePath).join(',') })
+        form.setFieldsValue({ LabelLogoUrl: fileList.map(v => v.sourcePath).join(',') })
       }
     },
     // onPreview: async (file) => {
@@ -181,7 +191,7 @@ const QRCodeDesign = (props, ref) => {
     let values = {
       CorporateName: row.CorporateName || '熊猫水务',
       Title: row.Title || '设备二维码',
-      IsSystemLogo: Boolean(row.IsSystemLogo) ? '自动使用系统LOGO' : '自定义LOGO',
+      IsSystemLogo: Boolean(row.IsSystemLogo) ? '系统LOGO' : '自定义LOGO',
       IsPandaLogo: Boolean(row.IsPandaLogo),
       LabelLogoUrl: row.LabelLogoUrl,
       DeviceName: row.DeviceName,
@@ -230,7 +240,7 @@ const QRCodeDesign = (props, ref) => {
       let values = {
         CorporateName: CorporateName || '熊猫水务',
         Title: Title || '设备二维码',
-        IsSystemLogo: Boolean(IsSystemLogo) ? '自动使用系统LOGO' : '自定义LOGO',
+        IsSystemLogo: Boolean(IsSystemLogo) ? '系统LOGO' : '自定义LOGO',
         IsPandaLogo: Boolean(IsPandaLogo),
         LabelLogoUrl: LabelLogoUrl
       }
@@ -274,7 +284,7 @@ const QRCodeDesign = (props, ref) => {
       corporateName: values.CorporateName,
       title: values.Title,
       labelLogoUrl: values.LabelLogoUrl,
-      isSystemLogo: values.IsSystemLogo === '自动使用系统LOGO' ? 1 : 0,
+      isSystemLogo: values.IsSystemLogo === '系统LOGO' ? 1 : 0,
       isPandaLogo: values.IsPandaLogo ? 1 : 0,
     }
     const { code, data } = await EditOrAddDeviceQRCodeConfig(params)
@@ -308,7 +318,7 @@ const QRCodeDesign = (props, ref) => {
           />
           <div className={styles.QRLogo}>
             {
-              values.IsSystemLogo === '自动使用系统LOGO' ? (
+              values.IsSystemLogo === '系统LOGO' ? (
                 // <div className={styles.systemLogo}></div>
                 <img style={{ width: '100%', height: '100%' }} src={`${window.origin}/civweb4/assets/images/icon/%E7%86%8A%E7%8C%AB-%E8%93%9D%E8%89%B2.png`} />
               ) : (
@@ -353,7 +363,7 @@ const QRCodeDesign = (props, ref) => {
       wrapClassName={styles.QRCodeModal}
       visible={visible}
       onCancel={() => setVisible(false)}
-      title={<div className={styles.QRCodeTitle}>{isBatch ? '设备列表' : '设备清单-样式编辑器'}</div>}
+      title={<div className={styles.QRCodeTitle}>{!show ? '设备列表' : '样式编辑器'}</div>}
       width={'65%'}
       bodyStyle={{ width: '100%', height: '650px', padding: '10px', background: show ? '#F6F9FC' : 'white' }}
       footer={footer}
@@ -405,7 +415,7 @@ const QRCodeDesign = (props, ref) => {
                 <Form.Item label="LOGO" name="IsSystemLogo">
                   <Radio.Group>
                     <Radio value="自定义LOGO">自定义LOGO</Radio>
-                    <Radio value="自动使用系统LOGO">自动使用系统LOGO</Radio>
+                    <Radio value="系统LOGO">系统LOGO</Radio>
                   </Radio.Group>
                 </Form.Item>
                 <Upload.Dragger
@@ -413,7 +423,7 @@ const QRCodeDesign = (props, ref) => {
                   className="upload-list-inline"
                   fileList={showList}
                   accept={['.bmp', '.gif', '.jpeg', '.tiff', '.png', '.svg', '.jpg', '.webp']}
-                  disabled={values.IsSystemLogo === '自动使用系统LOGO'}
+                  disabled={values.IsSystemLogo === '系统LOGO'}
                 >
                   <div>
                     <div className={styles.uploadIcon}></div>
@@ -427,7 +437,7 @@ const QRCodeDesign = (props, ref) => {
                     }
                   </div>
                 </Upload.Dragger>
-                <Form.Item label="熊猫LOGO" name="IsPandaLogo" valuePropName="checked">
+                <Form.Item label="熊猫LOGO" name="IsPandaLogo" valuePropName="checked" style={{ marginTop: '10px' }}>
                   <Switch checkedChildren="启用" unCheckedChildren="禁用" />
                 </Form.Item>
               </div>
@@ -440,6 +450,28 @@ const QRCodeDesign = (props, ref) => {
           </div>
         </div>
       </div>
+      <Modal
+        onCancel={() => setMinVisible(false)}
+        visible={minVisible}
+        footer={null}
+        width={310}
+        bodyStyle={{ width: '100%', height: '491px', padding: '10px' }}
+      >
+        <QRCodeView
+          id={currentRow.DeviceCode}
+          values={{
+            CorporateName: currentRow.CorporateName || '熊猫水务',
+            Title: currentRow.Title || '设备二维码',
+            IsSystemLogo: Boolean(currentRow.IsSystemLogo) ? '系统LOGO' : '自定义LOGO',
+            IsPandaLogo: Boolean(currentRow.IsPandaLogo),
+            LabelLogoUrl: currentRow.LabelLogoUrl,
+            DeviceName: currentRow.DeviceName,
+            DeviceCode: currentRow.DeviceCode,
+            AccountName: currentRow.AccountName,
+          }}
+          isBatch={false}
+        />
+      </Modal>
     </Modal>
   )
 }

src/pages/bsmanager/patrolMaintenance/maintenance/components/QRCodeDesign/index.less

@@ -11,6 +11,11 @@
     width: 50px;
     height: 50px;
   }
+  .qrCodeCell {
+    &:hover {
+      cursor: pointer;
+    }
+  }
   .QRCodeTitle {
     width: 100%;
     height: 57px;
@@ -19,7 +24,8 @@
     font-weight: bold;
     background: url('@{imgSrc}/标题.png');
     background-size: 100% 100%;
-    padding-left: 15px;
+    padding-left: 20px;
+    font-size: 20px;
   }
   .QRCodeList {
     width: 100%;
@@ -74,6 +80,7 @@
       border: 1px solid #BCDEFF;
       overflow: hidden;
       .header {
+        position: relative;
         width: 100%;
         height: 42px;
         display: flex;
@@ -98,6 +105,8 @@
           background-size: 100% 100%;
         }
         .h-bgArrow {
+          position: absolute;
+          right: 5%;
           width: 53px;
           height: 18px;
           background: url('@{imgSrc}/右键图标.png');
@@ -155,7 +164,19 @@
       }
     }
   }
-  .QRCode {
+  .downIcon {
+    width: 15px;
+    height: 15px;
+    margin-right: 2px;
+    display: inline-block;
+    background: url('@{imgSrc}/下载图标.png');
+    background-size: 100% 100%;
+    position: relative;
+    top: 2px;
+  }
+}
+
+.QRCode {
   width: 100%;
   height: 100%;
   background: url('@{imgSrc}/二维码背景.png');
@@ -190,7 +211,7 @@
       transform: translate(-50%, -50%);
       width: 30%;
       height: 30%;
-        .systemLogo{
+      .systemLogo {
         width: 100%;
         height: 100%;
         background: url('@{imgSrc}/熊猫-蓝色.png');
@@ -239,5 +260,4 @@
       font-weight: bold;
     }
   }
-  }
 }
\ No newline at end of file

src/pages/productCenter/mobileConfig/menuconfig/WorkDesign/components/Designer/index.js

@@ -115,7 +115,7 @@ const Designer = (props) => {
                 trigger="click"
                 content={
                   <div>
-                    <QRcode value={`${window.origin}/civ_mobile/product/water/monitor/workbench?env=dev&id=${currentCard.ID}&station=${currentSite}`} />
+                    <QRcode value={`${window.origin}/civ_mobile/product/water/monitor/workbench?env=dev&schemeName=${currentCard['名称']}&station=${currentSite}`} />
                   </div>
                 }
               >