Merge branch 'master' of http://git.ndjsxh.cn:10080/nd/nd_h5

# Conflicts:
#	src/tailwind.css

package.json

@@ -18,6 +18,7 @@
     "tailwindcss": "^3.0.23",
     "vant": "^2.12.47",
     "vue": "^2.6.11",
+    "vue-photo-preview": "^1.1.3",
     "vue-preview-image-mobile": "^0.1.1",
     "vue-router": "3.5.3",
     "vue-swiper-component": "^2.1.3",

src/components/base.js

@@ -8,8 +8,18 @@ export default {
         return {};
       },
     },
+    datas:{
+      type: Object,
+      default: () => {
+        return {};
+      },
+    }
   },
   methods: {
+    formatLabel(datas, options){
+      if( !options.labels || !options.bind ) return options.label;
+      return options.labels[datas[options.bind]]||options.label;
+    },
     click(link) {
       /* let isLink = ['string', 'number'].indexOf(typeof link) == -1;
       if(!isLink || !link || link=="0" ) return;

src/components/form/datetime.vue

@@ -1,7 +1,7 @@
 
 <template>
   <div class="form-datetime mb-4 last:mb-0 flex" :style="options.style">
-    <v-label :options="options"></v-label>
+    <v-label :options="options" :datas="datas"></v-label>
     <div class="form-value flex-1">
       <div class="datetime" @click="show = true">{{ value | format }}</div>
     </div>

src/components/form/index.vue

@@ -2,7 +2,7 @@
 <template>
   <div class="form mb-4 last:mb-0" :style="options.style">
     <div class="mb-4">
-      <component :is="getComponent(item)" :key="index" :options="item" :value.sync="formData[item.field]" v-for="(item, index) in options.children"></component>
+      <component :is="getComponent(item)" :key="index" :options="item" :datas="formData" :value.sync="formData[item.field]" v-for="(item, index) in options.children"></component>
     </div>
     <v-button :disable="success" :options="buttonOptions" @click="submit"></v-button>
   </div>
@@ -95,7 +95,7 @@ export default {
   border: 1px solid rgba(255, 255, 255, 0.55);
   border-radius: 0.5rem;
   /deep/ .form-label {
-    width: 5rem;
+    width: 5.5rem;
     padding: 0.5rem 0;
     font-size: 1rem;
     line-height: 1;

src/components/form/input.vue

@@ -1,7 +1,7 @@
 
 <template>
   <div class="form-input mb-4 last:mb-0 flex" :style="options.style">
-    <v-label :options="options"></v-label>
+    <v-label :options="options" :datas="datas"></v-label>
     <div class="form-value flex-1">
       <input class="input w-full" :value="options.value" @input="handleChange" />
     </div>

src/components/form/label.vue

@@ -1,28 +1,29 @@
 <template>
-  <div class="form-label flex-0 text-right mr-4">
-    <label :class="{ required: options.required }">{{ options.label }}</label>
+  <div class="form-label flex-0 text-right mr-4" :style="{width:options.labelWidth||'5rem'}">
+    <label :class="{ required: options.required }">{{formatLabel(datas, options)}}</label>
   </div>
 </template>
 <script>
-import Base from '../base';
+  import Base from '../base';
 
-export default {
-  extends: Base,
-}
+  export default {
+    extends: Base,
+  }
 </script>
 <style lang="less" scoped>
-.form-label {
-  position: relative;
-  .required {
-    &::after {
-      content: '*';
-      position: absolute;
-      color: #fe441f;
-      right: -0.5rem;
-      top: 0.5rem;
-      font-size: 1rem;
-      font-weight: bold;
+  .form-label {
+    position: relative;
+
+    .required {
+      &::after {
+        content: '*';
+        position: absolute;
+        color: #fe441f;
+        right: -0.5rem;
+        top: 0.5rem;
+        font-size: 1rem;
+        font-weight: bold;
+      }
     }
   }
-}
 </style>

src/components/form/radio.vue

@@ -1,7 +1,7 @@
 
 <template>
   <div class="form-radio mb-4 last:mb-0 flex" :style="options.style">
-    <v-label :options="options"></v-label>
+    <v-label :options="options" :datas="datas"></v-label>
     <div class="form-value flex-1">
       <div
         class="form-radio-item mb-2 last:mb-0 flex"

src/components/image.vue

@@ -1,18 +1,20 @@
 <template>
   <div v-if="!options.text" @click="click" class="image mb-6 last:mb-0 mx-auto">
-    <img :style="options.style" :src="options.image" />
+    <img v-if="options.preview" :style="options.style" :src="options.image" :large="options.image.split('?')[0]" :preview="1" @click="handleClick"/>
+    <img v-else :style="options.style" :src="options.image"/>
     <div v-if="options.marks" class="mark flex justify-center items-center">
       <span :style="options.marksStyle" v-html="options.marks"></span>
     </div>
   </div>
   <div v-else class="image mb-6 last:mb-0 mx-auto">
-    <img class="mb-1" :style="options.style" :src="options.image" @click="handleClick" />
+    <img  v-if="options.preview" class="mb-1" :style="options.style" :src="options.image" :large="options.image.split('?')[0]"  :preview="1" @click="handleClick"/>
+    <img v-else class="mb-1" :style="options.style" :src="options.image"/>
     <v-text :options="descOptions"></v-text>
   </div>
 </template>
 <script>
 import Base from './base';
-import EventBus from '@/utils/eventBus.js';
+// import EventBus from '@/utils/eventBus.js';
 
 export default {
   name: 'v-image',
@@ -30,11 +32,12 @@ export default {
   },
   methods: {
     handleClick(){
-      const { image, preview } = this.options;
-      console.log('1');
-      this.click();
-      if(!preview) return;
-      EventBus.$emit('preview', image);
+      const { preview } = this.options;
+      console.log("preview", preview);
+      this.click()
+      if(preview==undefined) return;
+      console.log("preview", preview);
+      this.$previewRefresh()
     }
   }
 }

src/main.js

@@ -3,13 +3,24 @@ import Vue from 'vue';
 import router from '@/router/index'
 import store from './store'
 import components from './components';
-import PreviewImage from 'vue-preview-image-mobile';
-import 'vue-preview-image-mobile/packages/preview-image/index.less'
+import PreviewImage from 'vue-photo-preview';
+import 'vue-photo-preview/dist/skin.css'
 import App from './App.vue';
 
 Vue.config.productionTip = false
 Vue.use(components);
-Vue.use(PreviewImage)
+Vue.use(PreviewImage, {
+  fullscreenEl: false,
+  closeEl: false,
+  tapToClose: true, //点击滑动区域应关闭图库
+  shareEl: false, //控制是否显示分享按钮
+  zoomEl: true, //控制是否显示放大缩小按钮
+  counterEl: true, //控制是否显示左上角图片数量按钮
+  arrowEl: true, //控制如图的左右箭头（pc浏览器模拟手机时）
+  tapToToggleControls: true, //点击应切换控件的可见性
+  clickToCloseNonZoomable: true ,//点击图片应关闭图库，仅当图像小于视口的大小时
+})
+
 
 new Vue({
   store,

src/tailwind.css

@@ -686,8 +686,11 @@ Ensure the default browser behavior of the `hidden` attribute.
 .last\:mb-0:last-child {
   margin-bottom: 0px;
 }
+<<<<<<< HEAD
 
 @font-face {
   font-family: "FangSong_GB2312"; /* Project id  */
   src: url('./font/FSGB2312.ttf');/* Safari, Android, iOS */
 }
+=======
+>>>>>>> fac0ecd875f55a0e75e68d0d3a5ebd9bb4d8e90f

src/views/page.vue

@@ -24,6 +24,7 @@ export default {
   data(){
     return {
       loading: false,
+      backMain:false,
       page: undefined,
       isMain: false,
       background:"",
@@ -81,12 +82,12 @@ export default {
       title && (document.title = title);
     },
     init(){
-      let {uuid} = this.$route.params;
+      let {uuid, id} = this.$route.params;
       const { data } = this.$store.state.pages;
       if(data) {
         return this.getPageInfo();
       }
-
+      this.backMain = (id != 'main');
       if(this.loading) return;
       this.loading = true;
       fetch("paper.getpaper", {uuid}).then((res) => {
@@ -101,7 +102,18 @@ export default {
       })
     },
     back(){
-      this.$router.back();
+      // 分享二级页面，回到主页
+      if(this.backMain){
+        this.$router.push({
+          name: 'page',
+          params: {
+            id: 'main'
+          }
+        });
+        this.backMain = false;
+      }else{
+        this.$router.back();
+      }
     }
   }
 }
@@ -111,7 +123,7 @@ export default {
   position: fixed;
   right: 1rem;
   top: 1rem;
-  z-index: 100000;
+  z-index: 100;
   border-radius: 1rem;
   padding: 0.5rem 1rem;
   line-height: 1;