Merge branch 'build' of http://git.sinoecare.com/sinoecare/digital_village_v2/dvcp_v2_webapp into build

packages/core/AppQyWxConfig/list.vue

@@ -36,13 +36,14 @@
                          active-color="#5088FF" inactive-color="#D0D4DC"></el-switch>
             </template>
           </el-table-column>
-          <el-table-column slot="options" align="center" label="操作" width="400">
+          <el-table-column slot="options" align="center" label="操作" width="500">
             <el-row type="flex" justify="center" align="middle" slot-scope="{row}">
               <el-button type="text" @click="detail(row)">详情</el-button>
               <el-button type="text" @click="del(row)">删除</el-button>
               <el-button type="text" @click="handleSystemInfo(row.id)">系统信息</el-button>
               <el-button type="text" @click="handlePush(row.id)">推送随手拍样式</el-button>
               <el-button type="text" @click="handleTheme(row.id)">主题样式</el-button>
+              <el-button type="text" @click="handleSession(row)">会话存档</el-button>
             </el-row>
           </el-table-column>
         </ai-table>
@@ -194,6 +195,13 @@
         </el-form-item>
       </el-form>
     </ai-dialog>
+    <ai-dialog title="会话存档设置" :visible.sync="sessionDialog" width="500px" @onConfirm="submitSessionInfo">
+      <el-radio-group v-model="sessionInfo.status">
+        <el-radio label="0">全部</el-radio>
+        <el-radio label="1">内部</el-radio>
+        <el-radio label="2">外部</el-radio>
+      </el-radio-group>
+    </ai-dialog>
   </section>
 </template>
 
@@ -274,7 +282,9 @@ export default {
         name: ""
       },
       sysInfo: {},
-      sysInfoDialog: false
+      sysInfoDialog: false,
+      sessionDialog: false,
+      sessionInfo: {status: '', corpId: ''}
     }
   },
   methods: {
@@ -446,6 +456,20 @@ export default {
     },
     handleTheme(id) {
       this.$router.push({hash: "#theme", query: {id}})
+    },
+    handleSession(row) {
+      this.sessionInfo.corpId = row.corpId
+      this.sessionInfo.status = row.saveConfig || '0'
+      this.sessionDialog = true
+    },
+    submitSessionInfo() {
+      this.instance.post(`/app/appsessionarchiveconfig/updateSessionArchiveConfig?corpId=${this.sessionInfo.corpId}&status=${this.sessionInfo.status}`).then(res => {
+        if (res?.code == 0) {
+          this.getTableData();
+          this.$message.success("提交成功!")
+          this.sessionDialog = false
+        }
+      })
     }
   },
   created() {

project/fengdu/app/AppResidentInfo/components/List.vue

@@ -48,10 +48,17 @@
               <el-button type="text" @click="toDetail(row.id)">详情</el-button>
               <el-button type="text" @click="toAdd(row.id)">编辑</el-button>
               <el-button type="text" @click="remove(row.id)">删除</el-button>
+              <el-button type="text" @click="qrCode(row)">生成二维码</el-button>
             </div>
           </template>
         </el-table-column>
       </ai-table>
+      <ai-dialog :visible.sync="dialogCode" title="二维码" width="500px" customFooter>
+        <div class="code-div">
+          <img :src="codeImgUrl" alt="" class="code-img">
+        </div>
+        <el-button slot="footer" @click="dialogCode=false" type="primary">关闭</el-button>
+      </ai-dialog>
     </template>
   </ai-list>
 </template>
@@ -72,7 +79,9 @@
           name: '',
           areaId: ''
         },
-        tableData: []
+        tableData: [],
+        dialogCode: false,
+        codeImgUrl: ''
       }
     },
 
@@ -144,6 +153,15 @@
             }
           })
         })
+      },
+
+      qrCode(row) {
+        this.instance.post(`/app/appresidentapplet/generateQrCode?id=${row.id}`).then(res=>{
+          if(res.code == 0) {
+            this.dialogCode = true
+            this.codeImgUrl = res.data
+          }
+        })
       }
     }
   }
@@ -152,5 +170,12 @@
 <style lang="scss" scoped>
   .activitiesList {
     height: 100%;
+    .code-div {
+      text-align: center;
+    }
+    .code-img {
+      width: 300px;
+      height: 300px;
+    }
   }
 </style>

project/pidu/app/AppSensitive/components/Detail.vue

@@ -55,95 +55,106 @@
                        :disabled="msgList.length == 0">
             <el-button icon="iconfont iconExported" :disabled="msgList.length == 0">导出</el-button>
           </ai-download> -->
+          <el-button
+            icon="iconfont iconExported"
+            :disabled="msgList.length == 0"
+            style="margin-left: 8px"
+            @click="handleExport"
+            >导出</el-button
+          >
         </div>
       </div>
       <div class="content-right-info" @scroll='msgScroll'>
-        <div v-for="(item, index) in msgList" :key="index">
-          <div class="item" :class="item.userId == id ? 'item-right' : 'item-left'">
-            <!-- <p class="time" v-if="index == 0">{{item.msgSendTime}}</p> -->
-            <p class="user-name">{{item.userName}}<span>{{item.msgSendTime}}</span></p>
-            <div class="item-content-flex">
-              <i class="el-icon-warning" v-if="item.userId == id && item.isKeyword == 1"></i>
-              <img :src="item.userAvatar" alt="" class="user-img" v-if="item.userId != id">
-              <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userId != id && !item.userAvatar">
+        <div ref="pdf">
+          <div v-for="(item, index) in msgList" :key="index">
+            <div class="item" :class="item.userId == id ? 'item-right' : 'item-left'">
+              <!-- <p class="time" v-if="index == 0">{{item.msgSendTime}}</p> -->
+              <p class="user-name">{{item.userName}}<span>{{item.msgSendTime}}</span></p>
+              <div class="item-content-flex">
+                <i class="el-icon-warning" v-if="item.userId == id && item.isKeyword == 1"></i>
+                <img :src="item.userAvatar" alt="" class="user-img" v-if="item.userId != id">
+                <img src="./img/user-img.png" alt="" class="user-img" v-if="item.userId != id && !item.userAvatar">
 
-              <div class="content" v-if="item.msgType == 'text'">
-                <span></span>
-                <p>{{item.content}}</p>
-              </div>
-
-              <div class="img-list" v-if="item.msgType == 'image'">
-                <img :src="item.sdkFileUrl" alt="" v-viewer>
-              </div>
-
-              <div class="voice-info" v-if="item.msgType == 'voice'">
-                <ai-audio :src="item.sdkFileUrl" skin="flat" />
-              </div>
-
-              <video style="width: 300px; object-fit: fill;" controls :src="item.sdkFileUrl" v-if="item.msgType == 'video'"></video>
-
-              <ai-file-list v-if="item.msgType == 'file'" 
-                :fileList="item.files"
-                :fileOps="{ name: 'name', size: 'fileSizeStr' }"
-              ></ai-file-list>
-
-              <div class="revoke-text" v-if="item.msgType == 'revoke'">{{item.userName}}{{item.msgSendTime.substring(0, 16)}}撤回了一条消息</div>
-
-              <div class="revoke-text" v-if="item.msgType == 'disagree'">对方不同意会话存档内容，你将无法继续提供服务</div>
-
-              <div class="revoke-text" v-if="item.msgType == 'agree'">对方同意会话存档内容，你可以继续提供服务</div>
-
-              <div class="card-info" v-if="item.msgType == 'card'">
-                <div class="top">
-                  <div class="card-left">
-                    <h3>{{item.cardCorpName}}</h3>
-                    <p>{{item.cardUserName}}</p>
-                    <!-- <div>{{item.cardUserId}}</div> -->
-                  </div>
-                  <div class="card-right">
-                    <img :src="item.cardUserAvatar" alt="" v-if="item.cardUserAvatar">
-                    <img src="./img/user-img.png" alt="" v-else>
-                  </div>
+                <div class="content" v-if="item.msgType == 'text'">
+                  <span></span>
+                  <p>{{item.content}}</p>
                 </div>
-                <div class="bottom">个人名片</div>
-              </div>
 
-              <img :src="item.sdkFileUrl" alt="" v-if="item.msgType == 'emotion'" :style="[{width: item.width/2+'px'}, {height: item.height/2+'px'}]">
-
-              <div class="map-info" v-if="item.msgType == 'location'">
-                <div :id="`map${index}`" class="map-content"></div>
-                <div class="address-text">
-                  <p>{{item.title}}</p>
-                  <p>{{item.address}}</p>
+                <div class="img-list" v-if="item.msgType == 'image'">
+                  <img :src="item.src" alt="" v-viewer>
                 </div>
-              </div>
 
-              <div class="card-info" v-if="item.msgType == 'weapp'">
-                <div class="top">
-                  <div class="card-left">
-                    <h3>{{item.description}}</h3>
+                <div class="voice-info" v-if="item.msgType == 'voice'">
+                  <ai-audio :src="item.sdkFileUrl" skin="flat" />
+                </div>
+
+                <video style="width: 300px; object-fit: fill;" controls :src="item.sdkFileUrl" v-if="item.msgType == 'video'"></video>
+
+                <ai-file-list v-if="item.msgType == 'file'" 
+                  :fileList="item.files"
+                  :fileOps="{ name: 'name', size: 'fileSizeStr' }"
+                ></ai-file-list>
+
+                <div class="revoke-text" v-if="item.msgType == 'revoke'">{{item.userName}}撤回了一条消息</div>
+
+                <div class="revoke-text" v-if="item.msgType == 'disagree'">对方不同意会话存档内容，你将无法继续提供服务</div>
+
+                <div class="revoke-text" v-if="item.msgType == 'agree'">对方同意会话存档内容，你可以继续提供服务</div>
+
+                <div class="card-info" v-if="item.msgType == 'card'">
+                  <div class="top">
+                    <div class="card-left">
+                      <h3>{{item.cardCorpName}}</h3>
+                      <p>{{item.cardUserName}}</p>
+                      <!-- <div>{{item.cardUserId}}</div> -->
+                    </div>
+                    <div class="card-right">
+                      <img :src="item.cardUserAvatar" alt="" v-if="item.cardUserAvatar">
+                      <img src="./img/user-img.png" alt="" v-else>
+                    </div>
+                  </div>
+                  <div class="bottom">个人名片</div>
+                </div>
+
+                <img :src="item.sdkFileUrl" alt="" v-if="item.msgType == 'emotion'" :style="[{width: item.width/2+'px'}, {height: item.height/2+'px'}]">
+
+                <div class="map-info" v-if="item.msgType == 'location'">
+                  <div :id="`map${index}`" class="map-content"></div>
+                  <div class="address-text">
                     <p>{{item.title}}</p>
-                    <div>{{item.username}}{{item.displayname}}</div>
+                    <p>{{item.address}}</p>
                   </div>
                 </div>
-                <div class="bottom">小程序</div>
-              </div>
 
-              <div class="card-info pointer" v-if="item.msgType == 'link'" @click="openLink(item)">
-                <div class="top">
-                  <div class="card-left">
-                    <p>{{item.title}}</p>
-                    <div>{{item.username}}</div>
-                  </div>
-                  <div class="card-right" v-if="item.imageUrl">
-                    <img :src="item.imageUrl" alt="" >
+                <div class="card-info" v-if="item.msgType == 'weapp'">
+                  <div class="top">
+                    <div class="card-left">
+                      <h3>{{item.displayName}}</h3>
+                      <p>{{item.title}}</p>
+                    </div>
+                    <div class="card-right">
+                      <img src="./img/app-icon.png" alt="" >
+                    </div>
                   </div>
+                  <div class="bottom"><img src="./img/app-mini-icon.png" alt="" >小程序</div>
                 </div>
-                <div class="bottom">分享链接</div>
-              </div>
 
-              <img :src="item.userAvatar" alt="" class="user-img" v-if="item.userId == id">
-              <i class="el-icon-warning" v-if="item.userId != id && item.isKeyword == 1"></i>
+                <div class="card-info pointer" v-if="item.msgType == 'link'" @click="openLink(item)">
+                  <div class="top">
+                    <div class="card-left">
+                      <p>{{item.title}}</p>
+                      <div>{{item.username}}</div>
+                    </div>
+                    <div class="card-right" v-if="item.imageUrl">
+                      <img :src="item.imageUrl" alt="" >
+                    </div>
+                  </div>
+                  <div class="bottom">分享链接</div>
+                </div>
+
+                <img :src="item.userAvatar" alt="" class="user-img" v-if="item.userId == id">
+                <i class="el-icon-warning" v-if="item.userId != id && item.isKeyword == 1"></i>
+              </div>
             </div>
           </div>
         </div>
@@ -163,7 +174,157 @@
   import AMapLoader from '@amap/amap-jsapi-loader'
   import Vue from 'vue'
   Vue.use(Viewer);
+
+  import html2canvas from "html2canvas";
+  import jsPDF from "jspdf";
+
+  import { Loading } from "element-ui";
   
+  const PdfLoader = (ele, pdfFileName) => {
+    let loadingInstance = Loading.service({ fullscreen: true, text: '正在导出（请勿刷新/关闭页面）' });
+    ele.style.fontFamily = "宋体";
+    ele.style.fontSize = "16px";
+    ele.style.padding = "0 20px";
+    // 预留一定的时间给dom页面渲染完成 （如果你能保证dom已经渲染完成了包括图片 才去进行下面转化操作那就可以不用这个延迟器）
+    setTimeout(() => {
+      html2canvas(ele, {
+        // dpi: 300, // 清晰度
+        scale: 1, // 将Canvas放大倍数 可以获得更具清晰的图片内容
+        // ！！！注意如果你生成的元素内容非常多是一个非常长列表 建议scale不要写太高或者删除这个属性 ，因为html2canvas会吧内容转成
+        // base64 会有一定的内容上限 最终返回没有base64编码（目前我尝试过生成55页的PDF，估计上限在70-100页）
+        useCORS: true, //是否允许跨域
+        allowTaint: false,
+        height: ele.offsetHeight,
+        width: ele.offsetWidth,
+        windowWidth: document.body.scrollWidth,
+        windowHeight: document.body.scrollHeight,
+      }).then((canvas) => {
+        //未生成pdf的html页面高度
+        var leftHeight = canvas.height;
+        var a4Width = 595.28;
+        var a4Height = 841.89;
+        //一页pdf显示html页面生成的canvas高度;
+        var a4HeightRef = Math.floor((canvas.width / a4Width) * a4Height);
+        //pdf页面偏移
+        var position = 0;
+        var pageData = canvas.toDataURL("image/jpeg", 1.0); // 生成的base64 如果你只是要图片 到这里就可以拿到base64图片编码（可以查一下base64转二进制 使用new FormData对象传给后端到服务器）
+
+        var pdf = new jsPDF("x", "pt", "a4"); //生成A4内容大小的pdf每页 更多参数配置可以看看下面的网站
+        // https://blog.csdn.net/weixin_42333548/article/details/107630706
+        var index = 1,
+          canvas1 = document.createElement("canvas"),
+          height;
+        pdf.setDisplayMode("fullwidth", "continuous", "FullScreen");
+        // 处理 pdf 上一页 与 下一页内容之间交叉不好看的断点样式
+        // 并且把内容转成二进制 生成pdf文件
+        function createImpl(canvas) {
+          if (leftHeight > 0) {
+            index++;
+            var checkCount = 0;
+            if (leftHeight > a4HeightRef) {
+              var i = position + a4HeightRef;
+              for (i = position + a4HeightRef; i >= position; i--) {
+                var isWrite = true;
+                for (var j = 0; j < canvas.width; j++) {
+                  var c = canvas.getContext("2d").getImageData(j, i, 1, 1).data;
+                  if (c[0] != 0xff || c[1] != 0xff || c[2] != 0xff) {
+                    isWrite = false;
+                    break;
+                  }
+                }
+                if (isWrite) {
+                  checkCount++;
+                  if (checkCount >= 10) {
+                    break;
+                  }
+                } else {
+                  checkCount = 0;
+                }
+              }
+              height =
+                Math.round(i - position) || Math.min(leftHeight, a4HeightRef);
+              if (height <= 0) {
+                height = a4HeightRef;
+              }
+            } else {
+              height = leftHeight;
+            }
+
+            canvas1.width = canvas.width;
+            canvas1.height = height;
+            var ctx = canvas1.getContext("2d");
+            ctx.drawImage(
+              canvas,
+              0,
+              position,
+              canvas.width,
+              height,
+              0,
+              0,
+              canvas.width,
+              height
+            );
+
+            if (position != 0) {
+              pdf.addPage();
+            }
+            pdf.addImage(
+              canvas1.toDataURL("image/jpeg", 1.0),
+              "JPEG",
+              0,
+              0,
+              a4Width,
+              (a4Width / canvas1.width) * height
+            );
+            leftHeight -= height;
+            position += height;
+            if (leftHeight > 0) {
+              //给pdf文件 添加全屏水印
+              // const base64 = '';  // 吧你要添加的水印内容搞成一张小图片 然后手动去转成base64编码 放在这里就可以了
+              // for (let i = 0; i < 6; i++) {
+              //     for (let j = 0; j < 5; j++) {
+              //         const left = (j * 120) + 20;
+              //         pdf.addImage(base64, 'JPEG', left, i * 150, 20, 30);
+              //     };
+              // };
+              pdf.addImage(pageData, "JPEG", 0, i * 150, 20, 30);
+              setTimeout(createImpl, 500, canvas);
+            } else {
+              pdfSave();
+            }
+          }
+        }
+
+        //当内容未超过pdf一页显示的范围，无需分页
+        if (leftHeight < a4HeightRef) {
+          pdf.addImage(
+            pageData,
+            "JPEG",
+            0,
+            0,
+            a4Width,
+            (a4Width / canvas.width) * leftHeight
+          );
+
+          pdfSave();
+        } else {
+          try {
+            pdf.deletePage(0);
+            setTimeout(createImpl, 500, canvas);
+          } catch (err) {
+            console.log(err);
+          }
+        }
+
+        function pdfSave() {
+          // pdf文件生成完毕 自动下载到客户本地
+          pdf.save(pdfFileName + ".pdf");
+          loadingInstance.close();
+        }
+      });
+    }, 500);
+  };
+
   export default {
     name: 'Detail',
     props: {
@@ -293,7 +454,7 @@
             size: 8,
             current: this.msgCurrent == 0 ? '' : this.msgCurrent,
             msgType: this.msgTypeList[this.msgType].value,
-            // msgType: 'file',
+            // msgType: 'webapp',
             toUserId: this.list[this.leftActiveIndex].type == 1 ? '' : this.list[this.leftActiveIndex].toUserId,
             roomId: this.list[this.leftActiveIndex].type == 1 ? this.list[this.leftActiveIndex].roomId : '',
             content: this.searchMsg,
@@ -347,6 +508,14 @@
               if(item.msgType == 'location') {
                 this.initMap(item.lng, item.lat, item.zoom, index)
               }
+              if (item.msgType == "image") {
+                var image = new Image();
+                image.crossOrigin = '';
+                image.src = item.sdkFileUrl
+                image.onload = ()=>{
+                  this.$set(this.msgList[index], 'src', this.getBase64Image(image))
+                }
+              }
             })
             this.msgList = this.msgCurrent > 1 ? [ ...res.data.records, ...this.msgList]: res.data.records
             this.msgPages = res.data.pages || 2
@@ -359,12 +528,24 @@
               }
               
             })
+            
           }
           this.isLoading = false
         }).catch(() => {
           this.isLoading = false
         })
       },
+      getBase64Image(img) {
+        var canvas = document.createElement("canvas");
+        canvas.width = img.width;
+        canvas.height = img.height;
+
+        var ctx = canvas.getContext("2d");
+        ctx.drawImage(img, 0, 0, img.width, img.height);
+        var ext = img.src.substring(img.src.lastIndexOf(".")+1).toLowerCase();
+        var dataURL = canvas.toDataURL("image/"+ext);
+        return dataURL;
+      },
       getMsgListPre() { //下拉加载上一页
         this.instance.post(`/app/appsessionarchiveinfo/list`, null, {
           params: {
@@ -456,7 +637,14 @@
           type: 'List',
           isRefresh: true
         })
-      }
+      },
+      handleExport() {
+        var fileName =
+          this.tabIndex == 1
+            ? this.list[this.leftActiveIndex].roomName
+            : this.list[this.leftActiveIndex].toUserName;
+        PdfLoader(this.$refs.pdf, fileName);
+      },
     }
   }
 </script>
@@ -721,15 +909,14 @@
                 width: calc(100% - 60px);
                 h3 {
                   line-height: 60px;
-                  font-size: 24px;
-                  font-weight: 500;
+                  font-size: 22px;
                   color: #333;
                   margin-bottom: 10px;
                 }
                 p {
                   color: #000;
                   line-height: 24px;
-                  font-size: 18px;
+                  font-size: 16px;
                 }
                 div {
                   color: #666;
@@ -751,6 +938,11 @@
               font-size: 16px;
               color: #666;
               border-top: 1px solid #eee;
+              img {
+                width: 16px;
+                height: 16px;
+                margin-right: 8px;
+              }
             }
           }
           .pointer {

ui/package.json

@@ -16,6 +16,8 @@
     "@jiaminghi/data-view": "^2.10.0",
     "crypto-js": "^4.1.1",
     "dayjs": "^1.8.35",
+    "html2canvas": "^1.4.1",
+    "jspdf": "^2.5.1",
     "echarts": "^5.1.2",
     "v-viewer": "^1.5.1",
     "vue-cropper": "^0.5.5",