ydb-components-material 0.1.119 → 0.1.121

package/es/components/guide-pc/components/materialsList.scss

@@ -0,0 +1,139 @@
+.materialsList-content {
+  padding-top: 20px;
+
+  .table-con {
+    margin-top: 20px;
+    overflow-x: auto;
+  }
+
+  .material-table {
+    width: 100%;
+    border-collapse: collapse;
+    border: 1px solid #e8e8e8;
+    font-size: 14px;
+    color: #222222;
+
+    thead {
+      th {
+        background: #f7f8fa;
+        padding: 12px 16px;
+        text-align: left;
+        font-weight: 500;
+        color: #333333;
+        border-bottom: 1px solid #e8e8e8;
+        border-right: 1px solid #e8e8e8;
+        white-space: nowrap;
+
+        &:last-child {
+          border-right: none;
+        }
+      }
+    }
+
+    tbody {
+      td {
+        padding: 12px 16px;
+        border-bottom: 1px solid #e8e8e8;
+        border-right: 1px solid #e8e8e8;
+        vertical-align: middle;
+
+        &:last-child {
+          border-right: none;
+        }
+      }
+    }
+
+    .col-name { width: 110px; }
+    .col-type { width: 100px; text-align: center; }
+    .col-need { width: 100px; text-align: center; }
+    .col-sample { width: 120px; text-align: center; }
+    .col-form { width: 120px; text-align: center; }
+    .col-check { width: 100px; text-align: center; }
+
+    .center {
+      text-align: center;
+    }
+
+    .data-row {
+      &:nth-child(even) {
+        background: #f7f8fa;
+      }
+
+      &.sub-row {
+        td {
+          padding-left: 16px;
+          background: #fafbfc;
+        }
+      }
+    }
+
+    .material-name-cell {
+      display: flex;
+      align-items: center;
+      gap: 8px;
+
+      &.sub-name {
+        .sub-indent {
+          display: inline-block;
+          width: 20px;
+          flex-shrink: 0;
+          &::before {
+            content: '└─';
+            color: #ccc;
+          }
+        }
+      }
+    }
+
+    .type-btns {
+      display: flex;
+      justify-content: center;
+      gap: 4px;
+    }
+
+    .type-tag {
+      display: inline-flex;
+      width: 20px;
+      height: 18px;
+      border-radius: 4px;
+      font-size: 12px;
+      justify-content: center;
+      align-items: center;
+      color: #ffffff;
+      cursor: pointer;
+
+      &-zhi { background: #1678FF; }
+      &-zi { background: #9570F7; }
+      &-xiang { background: #15BC83; }
+    }
+
+    .link-list {
+      display: flex;
+      flex-direction: column;
+      gap: 4px;
+    }
+
+    .link {
+      color: #1678FF;
+      cursor: pointer;
+      text-decoration: none;
+
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+
+  .preview-dialog {
+    .preview-inner {
+      height: 800px;
+      width: 100%;
+
+      .loading-con {
+        text-align: center;
+        padding: 40px;
+        color: #999;
+      }
+    }
+  }
+}

package/es/components/guide-pc/components/materialsList.vue

@@ -0,0 +1,403 @@
+<template>
+  <view class="materialsList-content">
+
+    <!-- 表格 -->
+
+    <view class="table-con">
+      <el-table
+        :data="list"
+        stripe
+        row-key="id"
+        border
+        :tree-props="{children: 'subMaterials'}"
+        default-expand-all
+      >
+        <el-table-column
+          prop="materialName"
+          label="材料名称"
+        />
+        <el-table-column
+          prop="materialExample"
+          label="材料分类"
+          align="center"
+          width="100"
+        >
+          <view slot-scope="{ row }" class="type-content" style="text-align: center;">
+            <template v-if="!row.subMaterials">
+              <view v-if="getFileType(row) == '智'" class="type type-zhi" @click="showTip('智')" />
+              <view v-if="getFileType(row) == '享'" class="type type-xiang" @click="showTip('享')" />
+              <view v-if="getFileType(row) == '自'" class="type type-zi" @click="showTip('自')" />
+            </template>
+          </view>
+        </el-table-column>
+        <el-table-column
+          prop="materialExample"
+          label="材料必要性"
+          align="center"
+        >
+          <view slot-scope="{ row }">
+            {{ row.isNeed == '1' ? '必要' : '非必要' }}
+          </view>
+        </el-table-column>
+        <el-table-column
+          prop="materialExample"
+          label="样表"
+          align="center"
+        >
+          <view class="link" slot-scope="{ row }">
+						<view v-for="item in initMaterialExample(row)" class="item" @click="previewFile(item)">
+							{{ item.name }}
+						</view>
+          </view>
+        </el-table-column>
+
+        <el-table-column
+          prop="formGuid"
+          label="空白表格"
+          align="center"
+        >
+          <view class="link" slot-scope="{ row }">
+						<view v-for="item in initFormGuid(row)" class="item" @click="goDownLoad(item)">
+							{{ item.name }}
+						</view>
+          </view>
+        </el-table-column>
+
+
+        <el-table-column
+          label="审查要点"
+          align="center"
+        >
+          <view v-if="row.keyPoint" class="link" slot-scope="{ row }" @click="checkPoint(row)">
+            查看
+          </view>
+        </el-table-column>
+        
+      </el-table>
+    </view>
+
+
+    <!-- 预览的展示区域 -->
+    <u-popup
+      :show="previewShow"
+      closeable
+      round="10"
+      mode="center"
+      bgColor="transparent"
+      @close="previewShow = false"
+    >
+      <view class="preview-inner">
+        <view class="loading-con" v-if="previewLoading">
+          <u-loading-icon text="加载中..." textSize="18" />
+        </view>
+        <!-- v-if="!previewLoading" -->
+        <iframe
+          id="previewIframe"
+          frameborder="0"
+          height="100%"
+          width="100%"
+        />
+      </view>
+		</u-popup>
+
+  </view>
+</template>
+
+<script>
+import { getFileUrlApi, previewFileApi } from '@/api/business.js'
+import { hasShareFile } from '@/utils/testShareFile.js'
+export default {
+  data() {
+    return {
+      list: [],
+
+      previewShow: false,
+      previewLoading: false,
+    }
+  },
+  mounted() {
+    // this.initData()
+    this.initDataNew()
+  },
+
+  methods: {
+    // 初始化材料列表
+    initDataNew() {
+      const finalMaterials = uni.getStorageSync('finalMaterials')
+      const { taskGeneralMaterials } = uni.getStorageSync('eventInfo')
+      this.list = finalMaterials || taskGeneralMaterials
+      console.log(this.list, 'this.list');
+    },
+    // 展示材料类型的提示信息
+    showTip(type) {
+      const obj = {
+        '智': '本材料为智能生成材料，系统将根据您填写的信息自动生成申报材料。',
+        '享': '本材料为共享材料，数据由大数据共享获取，无需用户自行准备。',
+        '自': '需要用户自行准备申报材料'
+      }
+      uni.$u.toast(obj[type], 3000)
+    },
+    // 查询材料的类型
+    getFileType(file) {
+      let finalType = ''
+      if(file.formConvertMaterial) { // 智能制作材料
+        finalType = '智'
+      } else if(file.noNeedSubmit) { // 共享材料(免于提交)
+        finalType = '享'
+      }else{ // 自备材料
+        finalType = '自'
+      }
+      return finalType
+    },
+
+    // 审查要点 [按钮]
+    checkPoint(item) {
+      const keyPoint = item.keyPoint
+      if(!keyPoint.fileUrl) {
+        uni.$u.toast('该审查要点暂时无法查看')
+        return
+      }
+      uni.setStorageSync('keyPoint', keyPoint)
+      uni.navigateTo({
+        url: `/pagesDeclarePc/keyPoints`
+      })
+    },
+
+
+    // ============空表下载开始============
+    // 去下载页面[方法]
+    async goDownLoad(fileObj) {
+      console.log('下载文件', fileObj);
+      const fileId = fileObj.id || fileObj.url
+      const fileUrl = await this.getFileUrlFun(fileId)
+      const nameArr = fileObj.name.split('.')
+      const format = nameArr[nameArr.length - 1]
+
+      const url = fileUrl.split('?')[0]
+      const params = JSON.stringify(this.parseURLParams(fileUrl))
+      
+      // uni.webView.navigateTo({
+        // url: `/pages/common/downLoad?params=${params}&format=${format}&fileUrl=${url}`
+      // })
+      // jWeixin.miniProgram.navigateTo({
+      //   url: `/pages/common/downLoad?params=${params}&format=${format}&fileUrl=${url}`
+      // })
+      console.log(this.$getEnv(), '当前环境====');
+      
+      if(this.$getEnv().wx) { // 微信小程序
+        jWeixin.miniProgram.navigateTo({
+          url: `/pages/common/downLoad?params=${params}&format=${format}&fileUrl=${url}`
+        })
+      }else if(this.$getEnv().my) { // 支付宝小程序
+        my.navigateTo({
+          url: `/pages/common/downLoad?params=${params}&format=${format}&fileUrl=${url}`
+        })
+      }else{
+        window.open(fileUrl)
+      }
+    },
+    // ============空表下载结束============
+
+    // ============ 样表预览开始 ============
+    // 样表预览 [按钮]
+    async previewFile({ url }) {
+			const fileUrl = await this.getFileUrlFun(url)
+			this.preview(fileUrl)
+    },
+
+    // 预览材料 [方法]
+    async preview(fileUrl) {
+      this.previewShow = true
+      this.previewLoading = true
+      const pageUrl = await this.previewFileFun(fileUrl)
+      this.previewUrl = pageUrl
+      console.log('预览地址', pageUrl);
+      // this.previewShow = true
+      setTimeout(() => {
+        document.getElementById('previewIframe').src = pageUrl
+      }, 500);
+    },
+    
+    // 通过文件地址 获取预览地址
+    previewFileFun(fileUrl) {
+      const params = { url: fileUrl }
+      return new Promise((resolve, reject) => {
+        previewFileApi(params).then((res) => {
+          const { url } = res
+          resolve(url)
+          this.previewLoading = false
+        }).catch(err => {
+          console.log(err)
+          reject(err)
+          this.previewLoading = false
+        })
+
+      })
+    },
+
+    // ============ 样表预览结束 ============
+
+
+    // 将url的参数进行解构 [方法]
+    parseURLParams(url) {
+      let queryParams = {}
+      // 正则匹配规则
+      let reg = /([^?=&]+)=([^?=&]+)/g
+      // 利用replace替换
+      url.replace(reg, function() {
+          // 用伪数组进行键值对拼接
+          queryParams[arguments[1]] = arguments[2]
+      })
+      // 返回参数键值对
+      return queryParams
+    },
+
+    // =============== API ===============
+    // 通过文件id获取文件地址
+    getFileUrlFun(id) {
+      const params = {
+        effectiveTime: '3600',
+        id
+      }
+      return new Promise((resole) => {
+        getFileUrlApi(params).then((res) => {
+          if(res && res.presignedUrlList && res.presignedUrlList.length > 0) {
+            resole(res.presignedUrlList[2])
+          }else{
+            uni.$u.toast('暂无相关材料')
+          }
+        }).catch(err => {
+          console.log(err)
+          uni.$u.toast('暂无相关材料')
+        })
+      })
+    },
+
+
+    // 展示空表
+    initFormGuid(row) {
+      if(!row.formGuid || row.formGuid == '[]') {
+         return ''
+      } else {
+        const formGuidJson = JSON.parse(row.formGuid)
+				return formGuidJson
+      }
+    },
+    // 展示样表
+    initMaterialExample(row) {
+      if(!row.materialExample || row.materialExample == '[]') {
+         return ''
+      } else {
+        const formGuidJson = JSON.parse(row.materialExample)
+				return formGuidJson
+      }
+    }
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  /deep/ .el-table{
+    color: #222222;
+  }
+  /deep/ .el-table thead{
+    color: #222222;
+  }
+  /deep/ .el-table th.el-table__cell{
+    background: #f7f8fa !important;
+  }
+  /deep/ .el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell{
+    background: #f7f8fa !important;
+  }
+  .materialsList-content{
+    padding-top: 20px;
+
+    .list{
+      .item{
+        background: #ffffff;
+        margin-bottom: 12px;
+        padding: 16px;
+        border-radius: 8px;
+        .title-con{
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          .type{
+            width: 20px;
+            height: 17px;
+            border-radius: 4px;
+            // box-sizing: border-box;
+            border: 1px solid #1678FF;
+            color: #1678FF;
+            font-size: 12px;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            margin-right: 8px;
+          }
+          .type1{
+            border: 1px solid #369EB7;
+            color: #369EB7;
+          }
+          .type2{
+            border: 1px solid #8358F6;
+            color: #8358F6;
+          }
+          .title{
+            font-size: 15px;
+            font-weight: 500;
+            color: #333333;
+          }
+        }
+        .table-con{
+          margin-top: 30px;
+        }
+      }
+    }
+
+    .preview-inner{
+      height: 900px;
+      width: 800px;
+    }
+    .link{
+      color: #1678FF;
+      cursor: pointer;
+    }
+
+    .type-content{
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+    .type{
+      width: 20px;
+      height: 18px;
+      border-radius: 4px;
+      font-size: 12px;
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      color: #ffffff;
+      padding-bottom: 2px;
+    }
+    .type-zhi{
+      background: #1678FF;
+      &::after{
+        content: '智';
+      }
+    }
+    .type-zi{
+      background: #9570F7;
+      &::after{
+        content: '自';
+      }
+    }
+    .type-xiang{
+      background: #15BC83;
+      &::after{
+        content: '享';
+      }
+    }
+  }
+</style>

package/es/components/guide-pc/components/places.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import './places.scss';
+export interface PlacesProps {
+    eventInfo?: any;
+}
+declare const Places: React.FC<PlacesProps>;
+export default Places;

package/es/components/guide-pc/components/places.js

@@ -0,0 +1,110 @@
+import * as React from 'react';
+import GuideTitle from "./guideTitle";
+import { Map, Marker } from 'react-amap';
+import emptyImg from "../../guide/imgs/empty.png";
+import "./places.scss";
+var Places = function Places(_ref) {
+  var eventInfoProp = _ref.eventInfo;
+  var _React$useState = React.useState({
+      longitude: 112.52,
+      latitude: 37.81
+    }),
+    local = _React$useState[0],
+    setLocal = _React$useState[1];
+  var _React$useState2 = React.useState([]),
+    list = _React$useState2[0],
+    setList = _React$useState2[1];
+  React.useEffect(function () {
+    var eventInfo = eventInfoProp;
+    var hallList = (eventInfo === null || eventInfo === void 0 ? void 0 : eventInfo.hallList) || [];
+    setList(hallList);
+    if (hallList.length > 0) {
+      clickDotHandle(hallList[0]);
+    }
+  }, [eventInfoProp]);
+  var setCenter = function setCenter(latitude, longitude) {
+    setLocal({
+      latitude: latitude,
+      longitude: longitude
+    });
+  };
+  var clickDotHandle = function clickDotHandle(point) {
+    var latitude = point.latitude,
+      longitude = point.longitude;
+    if (latitude && longitude) {
+      setCenter(latitude, longitude);
+    } else {
+      setCenter(37.81, 112.52);
+    }
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "places-content"
+  }, /*#__PURE__*/React.createElement(GuideTitle, {
+    title: "\u529E\u4E8B\u5927\u5385"
+  }), list.length > 0 ? /*#__PURE__*/React.createElement("div", {
+    className: "inner-content"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "map-con"
+  }, /*#__PURE__*/React.createElement("div", {
+    style: {
+      height: '400px',
+      width: '100%'
+    }
+  }, /*#__PURE__*/React.createElement(Map, {
+    amapkey: "fced30d9f04276a2a2071081f960170d",
+    center: [local.longitude, local.latitude],
+    zoom: 16
+  }, list.map(function (item, index) {
+    return item.longitude && item.latitude && /*#__PURE__*/React.createElement(Marker, {
+      key: item.hallName || index,
+      position: [item.longitude, item.latitude]
+    });
+  })))), /*#__PURE__*/React.createElement("div", {
+    className: "list-con"
+  }, list.map(function (item, index) {
+    return /*#__PURE__*/React.createElement("div", {
+      className: "item",
+      key: index,
+      onClick: function onClick() {
+        return clickDotHandle(item);
+      }
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "name"
+    }, item.hallName), /*#__PURE__*/React.createElement("div", {
+      className: "info"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "icon icon-address"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "title_"
+    }, "\u5730\u5740\uFF1A"), /*#__PURE__*/React.createElement("span", {
+      className: "desc"
+    }, item.addressDetail)), /*#__PURE__*/React.createElement("div", {
+      className: "info"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "icon icon-time"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "title_"
+    }, "\u65F6\u95F4\uFF1A"), /*#__PURE__*/React.createElement("span", {
+      className: "desc"
+    }, item.firstStartTime, " - ", item.firstEndTime, " / ", item.secondStartTime, " - ", item.secondEndTime)), /*#__PURE__*/React.createElement("div", {
+      className: "info"
+    }, /*#__PURE__*/React.createElement("span", {
+      className: "icon icon-phone"
+    }), /*#__PURE__*/React.createElement("span", {
+      className: "title_"
+    }, "\u7535\u8BDD\uFF1A"), /*#__PURE__*/React.createElement("span", {
+      className: "desc"
+    }, item.consultPhone)));
+  }))) : /*#__PURE__*/React.createElement("div", {
+    className: "empty-con"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "empty-img",
+    style: {
+      backgroundImage: "url(" + emptyImg + ")"
+    }
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "empty-text"
+  }, "\u6682\u65E0\u529E\u4E8B\u5927\u5385")));
+};
+Places.displayName = 'Places';
+export default Places;