jufubao-forms 1.0.0-beta1

package/src/components/JfbFormsQuestionAndAnswer/JfbFormsQuestionAndAnswerLess.less

@@ -0,0 +1,79 @@
+/**
+* @desc 获取绝对路径完整地址
+* @param @path
+**/
+//例如：https://image.jufubao.cn/20220501010108/image/bg/default_gonghui_bg.png
+@basePath: 'business/';
+@doMain: '//sandbox-img.jufubao.cn/';
+
+.getBusinessImageUrl(@path, @size: 'size8') {
+  @url: "@{doMain}@{basePath}@{path}?x-oss-process=style/@{size}";
+  background-image: url(@url);
+}
+
+//start
+.jfb-forms-question-and-answer {
+  box-sizing: border-box;
+
+  &__body{
+      position: relative;
+      overflow: hidden;
+      z-index: 2
+  }
+
+  &.editx,&.editx:hover {
+    position: relative;
+    min-height: unit(100, rpx);
+    z-index: 3;
+    &::after {
+      border: 2rpx dashed blue;
+      content: " ";
+      position: absolute;
+      top:0;
+      left:0;
+      bottom:0;
+      right:0;
+      z-index: var(--preview-z-index);
+      cursor: pointer;
+    }
+
+  }
+
+
+  &__edit {
+    cursor: pointer;
+    position: absolute;
+    right: unit(0, rpx);
+    top: unit(-52, rpx);
+    height: unit(50, rpx);
+    line-height: unit(50, rpx);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    background: rgba(0, 0, 0, .6);
+    border-radius: unit(10, rpx);
+    box-shadow: 0 0 10px rbga(0, 0, 0, 0.3);
+    color: #fff;
+    font-size: unit(22, rpx);
+
+    &-icon{
+      padding: 0 unit(20, rpx);
+    }
+
+    &.editx {
+      box-sizing: border-box;
+
+    }
+  }
+}
+//end
+
+
+/**notPreview**/
+.jfb-forms-question-and-answer {
+  //&:before {
+    //content: " ";
+    //display: table;
+  //}
+}
+/**endNotPreview**/

package/src/components/JfbFormsQuestionAndAnswer/JfbFormsQuestionAndAnswerMixin.js

@@ -0,0 +1,30 @@
+'use strict';
+
+
+//@AttrImport
+import Attr from "./Attr";
+//@EndAttrImport
+
+
+export default {
+  data() {
+    return {
+      //#ifdef H5
+      
+      //@AttrData
+      Attr:{}, //对外开发编辑属性
+      //@EndAttrData
+      
+      // #endif
+      cssRoot: 'jfb-forms-question-and-answer'
+    }
+  },
+  created() {
+    
+    //@AttrDataCreated
+    this.Attr = this.$xdUniHelper.customClone(Attr);
+    //@EndAttrDataCreated
+    
+
+  },
+}

package/src/components/JfbFormsQuestionAndAnswer/Mock.js

@@ -0,0 +1,144 @@
+"use strict";
+
+module.exports = {
+  getDynamicForm: {
+    message: "",
+    form_name: "抽奖11",
+    list: [
+      {
+        field_id: 78,
+        field_value: "field_78",
+        form_id: 38,
+        field_name: "123的因数有几个？",
+        field_type: "radio",
+        is_show_explain: "Y",
+        explain: "标题说明标题说明标题说明",
+        required: false,
+        options: [
+          { value: "1", label: "1" },
+          { value: "2", label: "2" },
+          { value: "3", label: "3" }
+        ],
+        default: "",
+        placeholder: "",
+        validate_type: "",
+        validate_rules: "",
+        sort: 0,
+        score: 0,
+        answer: [],
+        answer_analysis: "",
+        is_verify_answer: "N",
+        created_time: 1730259754,
+        updated_time: 1730361074
+      },
+      {
+        field_id: 79,
+        field_value: "field_79",
+        form_id: 38,
+        field_name: "有0,3,8这三个数组成的3位数中，共有几个偶数 ",
+        field_type: "radio",
+        is_show_explain: "",
+        explain: "",
+        required: true,
+        options: [
+          { value: "6", label: "6" },
+          { value: "5", label: "5" },
+          { value: "4", label: "4" },
+          { value: "3", label: "3" },
+        ],
+        default: "",
+        placeholder: "",
+        validate_type: "",
+        validate_rules: "",
+        sort: 0,
+        score: 0,
+        answer: ["1"],
+        answer_analysis: "123123123",
+        is_verify_answer: "Y",
+        created_time: 1730259777,
+        updated_time: 1730259777
+      },
+      {
+        field_id: 79,
+        field_value: "field_79",
+        form_id: 38,
+        field_name: "两个相同的数组成的3位数中，共有几个偶数 ",
+        field_type: "radio",
+        is_show_explain: "",
+        explain: "",
+        required: true,
+        options: [
+          { value: "6", label: "6" },
+          { value: "5", label: "5" },
+          { value: "4", label: "4" },
+          { value: "3", label: "3" },
+        ],
+        default: "",
+        placeholder: "",
+        validate_type: "",
+        validate_rules: "",
+        sort: 0,
+        score: 0,
+        answer: ["3"],
+        answer_analysis: "123123123",
+        is_verify_answer: "Y",
+        created_time: 1730259777,
+        updated_time: 1730259777
+      },
+      {
+        field_id: 79,
+        field_value: "field_79",
+        form_id: 38,
+        field_name: "正方形的边长是质数，它的面积一定是什么？",
+        field_type: "radio",
+        is_show_explain: "",
+        explain: "",
+        required: true,
+        options: [
+          { value: "6", label: "质数" },
+          { value: "5", label: "合数" },
+          { value: "4", label: "奇数" },
+          { value: "3", label: "偶数" },
+        ],
+        default: "",
+        placeholder: "",
+        validate_type: "",
+        validate_rules: "",
+        sort: 0,
+        score: 0,
+        answer: ["3"],
+        answer_analysis: "123123123",
+        is_verify_answer: "Y",
+        created_time: 1730259777,
+        updated_time: 1730259777
+      },
+      {
+        field_id: 79,
+        field_value: "field_79",
+        form_id: 38,
+        field_name: "下面那些是质数？",
+        field_type: "checkbox",
+        is_show_explain: "",
+        explain: "",
+        required: true,
+        options: [
+          { value: "6", label: "123" },
+          { value: "5", label: "33" },
+          { value: "4", label: "222" },
+          { value: "3", label: "44" },
+        ],
+        default: "",
+        placeholder: "",
+        validate_type: "",
+        validate_rules: "",
+        sort: 0,
+        score: 0,
+        answer: ["3"],
+        answer_analysis: "123123123",
+        is_verify_answer: "Y",
+        created_time: 1730259777,
+        updated_time: 1730259777
+      },
+    ]
+  }
+};

package/src/components/SkeProduct/SkeProduct.vue

@@ -0,0 +1,241 @@
+<template>
+  <view class="skeleton-wrap-item" :class="{display: cell===1}">
+    <template v-if="cell===1">
+      <view class="image skeleton-item" :style="{marginRight:cellSpacing + 'rpx'}"></view>
+      <view class="content">
+        <view class="top">
+          <view class="title skeleton-item"></view>
+          <view class="brand skeleton-item" v-if="productConfig.is_show_brand==='Y'"></view>
+          <view class="tags">
+            <view  class="skeleton-item" v-if="productConfig.showActivityPrice==='Y'"></view>
+            <template v-if="productConfig.isShowTag==='Y'">
+              <view class="skeleton-item"></view>
+              <view class="skeleton-item"></view>
+              <view class="skeleton-item"></view>
+            </template>
+          </view>
+        </view>
+        <view class="bottom">
+          <view class="price skeleton-item" v-if="productConfig.isPrice==='Y'"></view>
+          <view class="orgPrice skeleton-item" v-if="productConfig.isPrice==='Y' && productConfig.isShowDiscount === 'Y'"></view>
+          <view class="cart">
+            <view class="skeleton-item" v-if="productConfig.isAddCart === 'Y'"></view>
+          </view>
+        </view>
+      </view>
+    </template>
+    <template v-if="cell >= 2">
+      <view class="image2 skeleton-item" :style="{marginBottom:rowSpacing + 'rpx', height: height + 'rpx'}"></view>
+      <view class="content2">
+        <view class="top">
+          <view class="title skeleton-item"></view>
+          <view class="brand skeleton-item" v-if="productConfig.is_show_brand==='Y'"></view>
+          <view class="tags">
+            <view  class="skeleton-item" v-if="productConfig.showActivityPrice==='Y'"></view>
+            <template v-if="productConfig.isShowTag==='Y'">
+              <view class="skeleton-item"></view>
+              <view class="skeleton-item"></view>
+              <view class="skeleton-item"></view>
+            </template>
+          </view>
+        </view>
+        <view class="bottom">
+          <view class="price skeleton-item" v-if="productConfig.isPrice==='Y'"></view>
+          <view class="orgPrice skeleton-item" v-if="productConfig.isPrice==='Y' && productConfig.isShowDiscount === 'Y'"></view>
+          <view class="cart">
+            <view class="skeleton-item" v-if="productConfig.isAddCart === 'Y'"></view>
+          </view>
+        </view>
+      </view>
+    </template>
+  </view>
+</template>
+
+<script>
+export default {
+  name: "SkeProduct",
+  props:{
+    rowSpacing:{
+      type: Number|String,
+      required: true
+    },
+    cellSpacing:{
+      type: Number|String,
+      required: true
+    },
+    cell:{
+      type: Number,
+      required: true
+    },
+    height:{
+      type: Number|String,
+      default:''
+    },
+    productConfig:{
+      type:Object|null,
+      default: null
+    },
+  }
+}
+</script>
+
+
+
+<style scoped lang="less">
+.skeleton-wrap-item {
+
+  &.display {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    align-content: space-between;
+
+    & .image {
+      .skeleton-item(200rpx, 200rpx);
+    }
+
+
+    & .content {
+      flex: 1;
+      min-height: 200rpx;
+
+      .top {
+        height: 140rpx;
+
+        & .title {
+          .skeleton-item(100%, 60rpx);
+
+        }
+
+        & .brand {
+          margin-top: 10rpx;
+          .skeleton-item(70%, 25rpx);
+        }
+
+        .tags {
+          display: flex;
+          justify-content: flex-start;
+          align-items: center;
+          flex-flow: wrap;
+          margin-top: 10rpx;
+
+          & > view {
+            .skeleton-item(80rpx, 30rpx);
+            margin-left: 10rpx;
+            margin-bottom: 10rpx;
+            &:first-child {
+              margin-left: 0;
+              width: 120rpx;
+            }
+          }
+        }
+      }
+
+      .bottom {
+        display: flex;
+        justify-content: flex-end;
+        align-content: center;
+        align-items: center;
+        width: 100%;
+        height: 40rpx;
+        margin-top: 20rpx;
+
+        & .price {
+          flex-shrink: 0;
+          .skeleton-item(120rpx, 35rpx);
+        }
+
+        & .orgPrice {
+          flex-shrink: 0;
+          margin-left: 20rpx;
+          .skeleton-item(130rpx, 20rpx);
+        }
+
+        & .cart {
+          flex: 1;
+          display: flex;
+          justify-content: flex-end;
+          align-items: center;
+          & > view {
+            .skeleton-item(40rpx, 40rpx);
+          }
+        }
+      }
+    }
+  }
+
+  & .image2 {
+    .skeleton-item();
+  }
+
+  & .content2 {
+    flex: 1;
+
+    .top {
+      //min-height: 140rpx;
+
+      & .title {
+        .skeleton-item(100%, 60rpx);
+
+      }
+
+      & .brand {
+        margin-top: 10rpx;
+        .skeleton-item(70%, 25rpx);
+      }
+
+      .tags {
+        display: flex;
+        justify-content: flex-start;
+        align-items: center;
+        flex-flow: wrap;
+        margin-top: 10rpx;
+
+
+        & > view {
+          .skeleton-item(80rpx, 30rpx);
+          margin-right: 10rpx;
+          margin-bottom: 10rpx;
+
+          &:first-child {
+            margin-right: 0;
+            width: 120rpx;
+          }
+        }
+      }
+    }
+
+    .bottom {
+      width: 100%;
+      margin-top: 20rpx;
+      position: relative;
+
+      & .price {
+        flex-shrink: 0;
+        .skeleton-item(120rpx, 35rpx);
+      }
+
+      & .orgPrice {
+        flex-shrink: 0;
+        margin-top: 10rpx;
+        .skeleton-item(100rpx, 20rpx);
+      }
+
+      & .cart {
+        position: absolute;
+        right:0;
+        top:50%;
+        transform: translateY(-50%);
+        flex: 1;
+        display: flex;
+        justify-content: flex-end;
+        align-items: center;
+        & > view {
+          .skeleton-item(40rpx, 40rpx);
+        }
+      }
+    }
+  }
+
+}
+</style>

package/src/config.app.plus.js

@@ -0,0 +1,6 @@
+'use strict';
+
+export default  {
+  
+}
+

package/src/config.h5.js

@@ -0,0 +1,13 @@
+'use strict';
+
+export default {
+  "type": "test",
+  "NODE_ENV": "development",
+  "UNI_PLATFORM": "h5",
+  "platform": "h5",
+  "viewType": "preview",
+  "isPreview": true,
+  "server": "server",
+  "copypack": "server",
+  "fileDir": "resource"
+}

package/src/config.mp.weixin.js

@@ -0,0 +1,13 @@
+'use strict';
+
+export default {
+  "type": "build",
+  "NODE_ENV": "production",
+  "UNI_PLATFORM": "mp-weixin",
+  "platform": "mp.weixin",
+  "viewType": "preview",
+  "isPreview": true,
+  "server": "server",
+  "copypack": null,
+  "fileDir": "resource"
+}

package/src/config.project.js

@@ -0,0 +1,15 @@
+'use strict';
+
+//#ifdef H5
+import config from "@/config.h5";
+//#endif
+
+//#ifdef MP-WEIXIN
+import config from "@/config.mp.weixin";
+//#endif
+
+//#ifdef APP-PLUS
+import config from "@/config.app.plus";
+//#endif
+
+export default config;