ydb-components-material 0.1.119 → 0.1.120

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

@@ -0,0 +1,430 @@
+<template>
+  <view class="situation-content">
+    <guideTitle title="材料清单" />
+    <!-- 标语 -->
+    <view class="situation-tip" :class="{'isActive': isExpend}">
+      <view class="inner-tip" :style="{backgroundImage: `url(${bgImg})`}">
+
+        <view class="title-con">
+          <view class="title">导办情形选择</view>
+          <view class="tip">{{ tip }}</view>
+        </view>
+
+        <view class="btn-con" @click="expendChange()">
+          <view v-if="!isExpend">展开</view>
+          <view v-if="isExpend">收起</view>
+  
+          <view class="icon">
+            <u-icon v-if="!isExpend" name="arrow-down" color="#1678FF" size="12" />
+            <u-icon v-if="isExpend" name="arrow-up" color="#1678FF" size="12" />
+          </view>
+  
+        </view>
+      </view>
+    </view>
+
+    <!-- 情形选择结果 -->
+    <view v-show="isExpend" class="situation-inner">
+      <!-- 这里是情形选择表单 -->
+      <iframe
+        id="iframe"
+        frameborder="0"
+        height="100%"
+        width="100%"
+      />
+
+      <!-- <view class="btn-con" @click="reCheck()">
+        <u-button plain shape="circle" color="#1678FF" size="small" :text="isReCheck ? '提交情形' : '重选'" />
+      </view> -->
+    </view>
+  </view>
+</template>
+
+<script>
+import apiConfig from '@/config/api.cofig'
+import guideTitle from './guideTitle.vue'
+import { checkSituation2 } from '@/utils/situation.js'
+export default {
+  components: { guideTitle },
+  data() {
+    return {
+      bgImg: '../../static/img/pc/declare/situation.png',
+      tip: '说明：因个人情况不同上交材料不同，可通过情形选择查看必须上传的材料！',
+      isExpend: false, // 是否展开情形
+      isReCheck: false, // 是否重新选择情形
+
+      applicationId: uni.getStorageSync('applicationId'), // 太原市的事项id
+      // taskHandleItem: '11140100012220174L400010914700301',
+      taskHandleItem: uni.getStorageSync('taskHandleItem'), // 山西省的业务办理项编码
+      stepList: uni.getStorageSync('stepList'), // 步骤列表
+      currentStepObj: '', // 当前步骤
+
+
+      access_token: uni.getStorageSync('access_token'), // 统一身份认证token
+      token: uni.getStorageSync('token'), // 小程序token
+      acctType: uni.getStorageSync('acctType'), // 用户类型(10/20)
+      declarationAppToken: uni.getStorageSync('declarationAppToken'), // 申报token
+
+      situationMaterials: [], // 情形选择后 的材料列表
+      formFieldIds: [],  // 要隐藏的表单字段id
+      formFieldNames: [], // 要隐藏的表单字段名
+      itemSituationRowUid: [], // 情形id
+    }
+  },
+  mounted() {
+    this.initPage()
+    window.addEventListener('message', this.getMessage, false)
+  },
+  beforeDestroy() {
+		// 在组件生命周期结束的时候销毁。
+		window.removeEventListener('message', this.getMessage, false);
+	},
+  methods: {
+    // 初始化情形选择页面
+    initPage() {
+      const { declarePage } = apiConfig
+      const stepList = uni.getStorageSync('stepList')
+      // 找到[智能导办]页面
+      const situationPage = stepList.find((item) => item.name === '智能导办-pc')
+      if(situationPage && situationPage.link) {
+        const finalLink = `${declarePage}/preview.html?pageID=${situationPage.id}`
+
+        const applicationId = uni.getStorageSync('applicationId') // 太原市的事项id
+        const access_token = uni.getStorageSync('access_token') // 统一身份认证token
+        const acctType = uni.getStorageSync('acctType') // 用户类型(10/20)
+        // isReCheck=1
+        // 智能导办页面 如果拿到上面的参数 就把"下一步"按钮的名字 改成 "重新选择"
+        const url = `${finalLink}&isFirst=1&isReCheck=1&applicationId=${applicationId}&access_token=${access_token}&acctType=${acctType}&isPc=1`
+        setTimeout(() => {
+          document.getElementById('iframe').src = url
+        }, 500);
+      }
+    },
+
+    getMessage(e) {
+      // 鹏真向我这边要数据的type
+      // 鹏真向我这边要数据的type
+      const typeArr = [
+        'getAccessToken', 'getDeclaraToken', 'getApplicationId',
+        'getTaskHandleItem', 'getFormId', 'getMaterials', 'getFormData',
+        'getFormFieldNames', 'getItemSituationRowUid', 'getWorkNo'
+      ]
+      console.log(e, '监听webview传值');
+      const { type, data } = e.data
+      if(typeArr.includes(type)) {
+        // 向鹏真发消息
+        this.sendInfoHandle(type, data)
+      }else if(type == 'situationRes') { // 获取情形选择结果(智能导办)
+        console.log('获取情形选择结果', data)
+        uni.setStorageSync('situationRes', data)
+        // this.checkSituation()
+        checkSituation2(true, 'pc')
+      }
+    },
+
+    // 向鹏真发消息
+    sendInfoHandle(type, data) {
+      const { applicationId, taskHandleItem } = this
+      const { access_token, token, acctType, declarationAppToken } = this
+      let sendData = { type, data: {} }
+      switch (type) {
+        case 'getAccessToken': // 获取统一身份认证token和用户类型
+          sendData.data.accessToken = access_token
+          sendData.data.acctType = acctType
+          break;
+        case 'getDeclaraToken': // 获取申报token
+          sendData.data.declarationAppToken = declarationAppToken
+          break;
+        case 'getApplicationId': // 获取事项id(太原市级)
+          sendData.data.applicationId = applicationId
+          break;
+        case 'getTaskHandleItem': // 获取事项的业务办理项编码(山西省级)
+          sendData.data.taskHandleItem = taskHandleItem
+          break;
+        case 'getFormId': // 获取表单id
+          const eventInfo = uni.getStorageSync('eventInfo')
+          if(eventInfo.taskGeneralForms) {
+            const { formId } = eventInfo.taskGeneralForms[0]
+            sendData.data.formId = formId
+            // sendData.data.formId = '12023122617035840604349816'
+          }else{
+            sendData.data.formId = '12023122617035840604349816'
+            uni.$u.toast('没有查到表单id')
+          }
+          break;
+        case 'getMaterials': // 获取材料列表(树状)
+          const finalMaterials = uni.getStorageSync('finalMaterials')
+          const { taskGeneralMaterials } = uni.getStorageSync('eventInfo')
+          // 判断是否有情形选择后的材料 如果没有 则传给鹏真全量的材料
+          if(finalMaterials) {
+            sendData.data.materials = finalMaterials
+          }else{
+            sendData.data.materials = taskGeneralMaterials
+          }
+          break;
+        case 'getFormData': // 获取表单已填写的数据
+          const formData = uni.getStorageSync('formData')
+          sendData.data.formData = formData
+          break;
+
+        case 'getFormFieldNames': // 获取初始化表单时，要隐藏的表单字段
+          const formFieldNames = uni.getStorageSync('formFieldNames')
+          sendData.data.formFieldNames = formFieldNames
+          break;
+
+        case 'getItemSituationRowUid': // 获取已选择的情形id
+          const itemSituationRowUid = uni.getStorageSync('itemSituationRowUid')
+          sendData.data.itemSituationRowUid = itemSituationRowUid
+          break;
+        case 'getWorkNo': // 获取办件编码
+          const workNo = uni.getStorageSync('workNo')
+          sendData.data.workNo = workNo
+          break;
+      }
+
+      console.log(sendData, '给鹏真传的数据');
+      const formIframe = document.getElementById('iframe')
+      formIframe.contentWindow.postMessage(sendData, '*')
+    },
+    // 切换是否展开
+    expendChange() {
+      this.isExpend = !this.isExpend
+    },
+
+    // ====以下为情形选择的处理方法 ====
+    // 组织情形选择后的材料/表单/情形id
+    checkSituation() {
+      const problems = uni.getStorageSync('eventInfo').problems
+      const isMulti = problems.isMultipleChoice == '1'
+      this.getInfo([problems][0].options, isMulti)
+    },
+    getInfo(options, isMulti = false) {
+      console.log(options, '啦啦啦啦');
+      const situationRes = uni.getStorageSync('situationRes')
+
+      options.forEach(opt => {
+        let trueOpt = ''
+        if(isMulti) { //如果是多选
+          trueOpt = situationRes.find((item) => item.optionsValue.includes(opt.id))  
+        }else{ // 如果是单选
+          trueOpt = situationRes.find((item) => item.optionsValue === opt.id)  
+        }
+        // const trueOpt = situationRes.find((item) => item.optionsValue === opt.id)
+
+        if(trueOpt) {
+          console.log('trueOpt', trueOpt);
+          if(opt.materials && opt.materials.length) {
+            this.situationMaterials = this.situationMaterials.concat(opt.materials)
+            // this.situationMaterials = (opt.materials)
+          }
+          if(opt.formFieldIds && opt.formFieldIds.length) {
+            this.formFieldIds.push(opt.formFieldIds)
+          }
+          if(opt.formFieldNames && opt.formFieldNames.length) {
+            this.formFieldNames.push(opt.formFieldNames)
+          }
+          if(opt.itemSituationRowUid) {
+            this.itemSituationRowUid.push(opt.itemSituationRowUid)
+          }
+          if(opt.children && opt.children.length) {
+            const isMulti = opt.children[0].isMultipleChoice == '1'
+            this.getInfo(opt.children[0].options, isMulti)
+          }else{
+            this.showRes()
+          }
+        }else{
+          uni.showModal({
+            title: '提示',
+            content: '答案未匹配',
+            confirmText: '知道了',
+            showCancel: false,
+            confirmColor: '#1678FF',
+            success: (res) => {
+              if (res.confirm) {
+                uni.navigateBack()
+              }
+            }
+          });
+        }
+      })
+
+    },
+    showRes() {
+      const { situationMaterials, formFieldIds, formFieldNames, itemSituationRowUid } = this
+      const originMaterials = uni.getStorageSync('eventInfo').taskGeneralMaterials
+      const originSituation = uni.getStorageSync('eventInfo').taskGeneralSituation
+      const stepList = uni.getStorageSync('stepList')
+      let finalArr = []
+      // 将情形选择后的材料 和 事项原材料进行比对 形成最终的材料列表 (将2者合并)
+      originMaterials.forEach(oriItem => {
+        const sameOne = situationMaterials.find((situItem) => situItem.itemRowGuid === oriItem.rowGuid)
+        // 找到情形选择后相关的材料 将isNeed改为1(必填)
+        if(sameOne) {
+          finalArr.push(Object.assign({}, sameOne, {
+            isNeed: '1'
+          }))
+        }else{
+          // 剩下的为和情形没有关系的 
+          if(oriItem.isNeed == '1') { // 如果isNeed=1, 也需要上传
+            finalArr.push(Object.assign({}, oriItem, {
+              subMaterials: oriItem.childMaterialSplitListBO
+            }))
+          }else if(oriItem.childMaterialSplitListBO){ // 如果有子集材料 判断他的子集材料中, 是否有必传的材料
+            const subFileIsNeed = oriItem.childMaterialSplitListBO.find((item) => item.isNeed == '1')
+            if(subFileIsNeed) {
+              finalArr.push(Object.assign({}, oriItem, {
+                subMaterials: oriItem.childMaterialSplitListBO
+              }))
+            }
+          }
+        }
+      })
+
+      console.log('最终的材料', finalArr);
+      uni.setStorageSync('finalMaterials', finalArr)
+
+
+      let finalSituArr = []
+      // 找到最后选择的那个情形
+      if(itemSituationRowUid && itemSituationRowUid.length) {
+        console.log('开始啦啦啦啦');
+
+        itemSituationRowUid.forEach(itenSitu => {
+          const checkedSituation = originSituation.find((oriSitu) => oriSitu.rowGuid === itenSitu)
+          if(checkedSituation) {
+            finalSituArr.push(checkedSituation)
+          }
+        })
+      }
+
+      let finalSituSubmit = []
+      if(finalSituArr && finalSituArr.length) {
+        finalSituArr.forEach(ele => {
+          let dataObj = {
+            sceneId: ele.rowGuid,
+            sceneName: ele.specificSituation,
+            seq: ele.newSituationNo
+          }
+          finalSituSubmit.push(dataObj)
+        })
+      }
+
+      uni.setStorageSync('finalSituSubmit', finalSituSubmit)
+
+
+
+      uni.setStorageSync('situationMaterials', situationMaterials)
+      uni.setStorageSync('formFieldIds', formFieldIds)
+      uni.setStorageSync('formFieldNames', formFieldNames)
+      uni.setStorageSync('itemSituationRowUid', itemSituationRowUid)
+
+      // location.reload() // 刷新当前页面
+
+
+      const guideHandle = stepList.find((step) => step.name == '智能导办')
+      uni.setStorageSync('currentStepObj', guideHandle)
+      this.$initNextStep('下一步', 'pc')
+      console.log('情形材料', situationMaterials);
+      console.log('表单id', formFieldIds);
+      console.log('表单名', formFieldNames);
+      console.log('情形id', itemSituationRowUid);
+
+
+    },
+    // ====以上为情形选择的处理方法 ====
+
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+  .situation-content{
+    // border: 1px solid red;
+    background: #ffffff !important;
+    .situation-tip{
+      border: 1px solid #ffffff;
+      border-radius: 8px 8px 8px 8px;
+      border: 1px solid #C3DCFF;
+      margin-top: 20px;
+      background: linear-gradient(180deg, #ECF4FF 1%, #F7FAFF 100%);
+      &.isActive{
+        border-radius: 8px 8px 0 0 !important;
+        border-bottom: none;
+      }
+      .inner-tip{
+        padding: 24px;
+        background-repeat: no-repeat;
+        background-size: 104px 70px;
+        background-position: 90% 100%;
+
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        .title-con{
+          // border: 1px solid green;
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          gap: 16px;
+          .title{
+            background: linear-gradient(96deg, #0047A8 0%, #1678FF 98%);
+            -webkit-background-clip: text;
+            -webkit-text-fill-color: transparent;
+            background-clip: text;
+            text-fill-color: transparent;
+            font-size: 16px;
+            font-weight: 500;
+          }
+          .tip{
+            font-size: 14px;
+            color: #5C7292;
+          }
+        }
+        .btn-con{
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          color: #1678FF;
+          font-size: 14px;
+          cursor: pointer;
+          gap: 6px;
+          .icon{
+            width: 14px;
+            height: 14px;
+            border-radius: 50%;
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            border: 1px solid #1678FF;
+          }
+        }
+      }
+
+      
+    }
+
+    .situation-inner{
+      // background: #ffffff;
+      background: linear-gradient(180deg, #F7FAFF 1%, #F7FAFF 100%);
+      border-radius: 0 0 8px 8px;
+      border: 1px solid #C3DCFF;
+      border-top: none;
+      // border: 1px solid ;
+      // border: 1px solid #333333;
+      border-top: none;
+      overflow-y: scroll;
+      height: 500px;
+      padding: 0 12px 12px;
+
+      .list{
+        height: 200px;
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+      .btn-con{
+        padding: 16px;
+      }
+    }
+  }
+</style>

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

@@ -0,0 +1,179 @@
+<template>
+  <view class="guidePc-content">
+    <view class="main-content" v-if="isShow">
+      <!-- 导航切换按钮 -->
+			<view class="stity">
+				<guideTabs @tabsChange="changeTab" />
+			</view>
+			
+			<view class="gap" />
+				
+      <!-- 材料清单 -->
+      <situation id="0" v-if="hasSituation" />
+      <materialsList />
+      
+      <!-- 事项基本信息 -->
+      <basicInfo id="1" />
+      
+      <!-- 办事流程 -->
+      <processImg id="2" />
+      
+      <!-- 受理条件 -->
+      <accept id="3" />
+      
+      <!-- 办事大厅 -->
+      <places id="4" />
+      
+      <!-- 成效分析 -->
+      <result id="5" />
+    </view>
+    <addBtn iconName="arrow-up-fill" @addClick="goUp" />
+  </view>
+</template>
+
+<script>
+import situation from './components/situation.vue'
+import materialsList from './components/materialsList.vue'
+import guideTabs from './components/guideTabs.vue'
+import basicInfo from './components/basicInfo.vue'
+import processImg from './components/processImg.vue'
+import accept from './components/accept.vue'
+import places from './components/places.vue'
+import result from './components/result.vue'
+import { getTyEventDetailApi, getFormValueApi } from '@/api/tyBusiness.js'
+export default {
+  components: { situation, materialsList, guideTabs, basicInfo, processImg, accept, places, result },
+  props: {
+		cantNext: {
+			type: String,
+			default: ''
+		}
+	},
+	data() {
+    return {
+      eventInfo: uni.getStorageSync('eventInfo'),
+      tabIndex: 0,
+      isShow: true,
+    }
+  },
+  onLoad(opt) {
+    console.log(opt, '办事指南自己查询');
+    if(opt.standardItemId && opt.taskHandleItem) {
+      this.isShow = false
+      uni.setStorageSync('declarationAppTokenTY', opt.access_token)
+      // this.standardItemId = opt.standardItemId
+      // this.taskHandleItem = opt.taskHandleItem
+      this.getTyEventDetailFun(opt.standardItemId, opt.taskHandleItem)
+    }
+  },
+	mounted() {
+		if(!cantNext) {
+			this.getFormValueFun() // 查询表单元数据
+		}
+	},
+  computed: {
+    // 判断是否有智能导办步骤 
+    hasSituation() {
+      const stepList = uni.getStorageSync('stepList')
+			if(stepList) {
+				return stepList.find((item) => item.fieldText == '智能导办')
+			}else{
+				return false
+			}
+    }
+  },
+  methods: {
+    // 切换tabs [按钮]
+    changeTab(sectionId) {
+      const element = document.getElementById(sectionId);
+      if (!element) return;
+      const offsetTop = element.offsetTop;
+      const start = window.pageYOffset;
+      window.scrollTo(0, start + (offsetTop - start) - 80);
+    },
+    // 返回顶部 【按钮】
+    goUp() {
+      window.scrollTo(0, 0);
+    },
+    // =============== API ===============
+		// 查询表单元数据
+		getFormValueFun() {
+			let finalCredentialNum = ''
+			// 获取授权人信息（代办）
+			const agentInfo = uni.getStorageSync('agentInfo')
+			// 如果是代办 就把授权人的信息传过去
+			if(agentInfo) {
+				const { acctType, certificateSno, certNo } = agentInfo
+				finalCredentialNum = acctType == '20' ? certificateSno : certNo
+			}else{
+				// 如果不是代办,把当前登录人的信息传过去
+				const { acctType, certificateSno, certNo } = uni.getStorageSync('userInfo')
+				finalCredentialNum = acctType == '20' ? certificateSno : certNo
+			}
+			
+			
+			
+			
+		  const eventInfo = uni.getStorageSync('eventInfo')
+			
+		  if(eventInfo.taskGeneralForms) {
+		    const { formId } = eventInfo.taskGeneralForms[0]
+		    const params = {
+		      formId,
+					credentialNum: finalCredentialNum,
+		      authorization: '',
+		      accType: 0,
+		    }
+		    getFormValueApi(params).then((res) => {
+		      console.log(res, '查询表单元数据');
+					uni.setStorageSync('defaultFormData', res)
+		    }).catch(err => {
+		      console.log(err);
+		    })
+		  }
+		},
+    // 通过事项id 业务办理项编码 查询 事项详情(太原市级的)
+    getTyEventDetailFun(standardItemId, taskHandleItem) {
+      const params = {
+        standardItemId, // 太原市的事项id
+        taskHandleItem, // 山西省的业务办理项编码
+      }
+      getTyEventDetailApi(params).then((res) => {
+        console.log(res);
+        uni.setStorageSync('eventInfo', res)
+        this.isShow = true
+      }).catch(err => {
+        console.log(err);
+      })
+    },
+  }
+}
+</script>
+
+
+<style>
+
+  page{
+    background: #ffffff;
+  }
+</style>
+<style lang="scss" scoped>
+  .guidePc-content{
+    .main-content{
+      // border: 1px solid;
+      width: 1200px;
+      margin: 0 auto;
+			
+			.stity{
+				position: fixed;
+				top: 200px;
+				z-index: 9;
+				width: 1200px;
+				background: #ffffff;
+			}
+			.gap{
+				height: 70px;
+			}
+    }
+  }
+</style>

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

@@ -0,0 +1,37 @@
+import * as React from 'react';
+import './index.scss';
+export interface GuidePcProps {
+    /** Called when user clicks "立即办理" or "上一步" */
+    onNextStep?: (action: string) => void;
+    /** Whether to disable the prev/next buttons */
+    cantNext?: boolean;
+    hasPrevious?: boolean;
+    /** Task handle item code */
+    taskHandleItem?: string;
+    /** Access token */
+    accessToken?: string;
+    /** Event info data */
+    eventInfo?: object;
+    /** Account type */
+    acctType?: string;
+    /** Agent info */
+    agentInfo?: object;
+    /** Application ID */
+    applicationId?: string;
+    /** Final materials after intelligent guidance */
+    finalMaterials?: any[];
+    /** Declaration app token */
+    declarationAppToken?: string;
+    /** Situation page URL */
+    situationPageUrl?: string;
+    /** Base URL */
+    baseUrl?: string;
+    /** Download handler */
+    download?: (params: any) => void;
+    /** Situation result re-change handler */
+    situationResRechange?: (data: any) => void;
+    /** Previous form data from parent */
+    previousData?: object;
+}
+declare const GuidePc: React.FC<GuidePcProps>;
+export default GuidePc;