zydx-plus 1.32.283 → 1.32.284

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "zydx-plus",
-  "version": "1.32.283",
+  "version": "1.32.284",
   "description": "Vue.js",
   "main": "src/index.js",
   "files": [

package/src/components/seek/index.js

@@ -0,0 +1,6 @@
+import main from './src/word';
+
+main.install = function(Vue) {
+    Vue.component(main.name, main);
+};
+export default main;

package/src/components/seek/src/icon.vue

@@ -0,0 +1,92 @@
+<template>
+  <div class="svg-choice" v-if="radio">
+    <div v-if="state === 'default'">
+      <svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" width="14"
+           height="14">
+        <path :fill="disabled? 'rgba(0, 0, 0, .2)': 'rgba(24, 144, 255, 1)'"
+              d="M100,200A100,100,0,1,1,200,100,100,100,0,0,1,100,200Zm0-12.5A87.5,87.5,0,1,0,12.5,100,87.51,87.51,0,0,0,100,187.5Z"/>
+        <circle v-if="select" fill="rgba(24, 144, 255, 1)" cx="98.5" cy="98.5" r="62.5"/>
+      </svg>
+    </div>
+    <div v-else>
+      <svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 174.95 174.95" width="14"
+           height="14">
+        <path :fill="state === 'correct'?'rgba(67, 207, 124, 1)': 'rgba(255, 0, 0, 1)'"
+              d="M100.91,12.49A87.48,87.48,0,1,0,188.39,100,87.48,87.48,0,0,0,100.91,12.49Z"
+              transform="translate(-13.44 -12.49)"/>
+        <path v-if="state === 'correct'" fill="rgba(255, 255, 255, 1)"
+              d="M160.36,76.87,97.93,139.3l-.07.08a12.51,12.51,0,0,1-17.68,0l-.08-.08L42.68,101.87A12.49,12.49,0,1,1,60.35,84.2L89,112.86,142.68,59.2a12.5,12.5,0,1,1,17.68,17.67Z"
+              transform="translate(-15.01 -10.54)"/>
+        <path v-else fill="rgba(255, 255, 255, 1)" d="M151.43,134.15a35.64,35.64,0,0,1,5.81,7.52q1.84,3.41-.61,7.79c-.37.55-.87,1.21-1.51,2s-1.3,1.53-2,2.26a26.89,26.89,0,0,1-2,2,13.1,13.1,0,0,1-1.71,1.3,10.89,10.89,0,0,1-8.07,1.09,16.26,16.26,0,0,1-8.34-4.65l-5.74-5.74L119.57,140l-9-9-9.85-9.84-17.5,17.5q-8.07,8.07-13.12,13.26-5.2,5.19-10.33,6.43A9.56,9.56,0,0,1,50.66,156l-1-1-1.5-1.5-1.5-1.5a5.93,5.93,0,0,1-1-1.1A8.08,8.08,0,0,1,44,147.07a8.74,8.74,0,0,1,.34-3.9,13.88,13.88,0,0,1,1.85-3.69,23.41,23.41,0,0,1,2.73-3.28q1.23-1.09,4.38-4.11l7.38-7.65q4.52-4.38,10-9.85t11.56-11.48q-6.57-6.57-12.52-12.44L59.07,80.14q-4.73-4.65-7.73-7.59l-3.69-3.62c-2.37-2.37-3.57-4.72-3.62-7.05a11.89,11.89,0,0,1,2.39-7,28.65,28.65,0,0,1,3.15-3.21,29.25,29.25,0,0,1,2.87-2.39c2.73-1.83,5.19-2.62,7.38-2.4s4.38,1.49,6.56,3.76l4.24,4.24q3.15,3.15,7.8,7.66T88.88,72.69L101,84.51q5.19-5.19,10.18-10.12t9.3-9.22q4.31-4.32,7.79-7.73t5.82-5.74a16.23,16.23,0,0,1,7.11-4.17,8.12,8.12,0,0,1,7.38,1.71,10.87,10.87,0,0,0,.89.68,18,18,0,0,1,1.5,1.23l1.44,1.3a5.46,5.46,0,0,0,1,.75c2.47,2.37,3.67,4.95,3.63,7.73a11.07,11.07,0,0,1-3.63,7.72q-2.46,2.46-6.08,6.15c-2.42,2.47-5.1,5.16-8.07,8.07s-6.08,6-9.36,9.3l-10.39,10.39q5.06,4.92,9.91,9.64c3.23,3.15,6.24,6.08,9,8.82s5.29,5.24,7.52,7.52,4.08,4.15,5.54,5.61Z"
+              transform="translate(14.88 14.81) scale(0.7)"/>
+      </svg>
+    </div>
+  </div>
+  <div v-else class="svg-choice">
+    <div v-if="state === 'default'">
+      <svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 175 175" width="14" height="14">
+        <path :fill="disabled? 'rgba(0, 0, 0, .2)': 'rgba(24, 144, 255, 1)'"
+              d="M172.92,12.5H27.08A14.58,14.58,0,0,0,12.5,27.08V172.92A14.58,14.58,0,0,0,27.08,187.5H172.92a14.58,14.58,0,0,0,14.58-14.58V27.08A14.58,14.58,0,0,0,172.92,12.5Zm0,160.42H27.08V27.08H172.92V172.92Z"
+              transform="translate(-12.5 -12.5)"/>
+        <path v-if="select" fill="rgba(24, 144, 255, 1)"
+              d="M45.56,38.76H154.44a6.79,6.79,0,0,1,6.8,6.8h0V154.44a6.79,6.79,0,0,1-6.8,6.8H45.56a6.8,6.8,0,0,1-6.8-6.8h0V45.56a6.8,6.8,0,0,1,6.8-6.8Z"
+              transform="translate(-12.5 -12.5)"/>
+      </svg>
+    </div>
+    <div v-else>
+      <svg id="图层_1" data-name="图层 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 175 175" width="19" height="19">
+        <path :fill="state === 'correct'?'rgba(67, 207, 124, 1)': 'rgba(255, 0, 0, 1)'"
+              d="M45.56,38.76H154.44a6.79,6.79,0,0,1,6.8,6.8h0V154.44a6.79,6.79,0,0,1-6.8,6.8H45.56a6.8,6.8,0,0,1-6.8-6.8h0V45.56a6.8,6.8,0,0,1,6.8-6.8Z"
+              transform="translate(-32.5 -12.5)"/>
+        <path v-if="state === 'correct'" fill="rgba(255, 255, 255, 1)"
+              d="M160.36,76.87,97.93,139.3l-.07.08a12.51,12.51,0,0,1-17.68,0l-.08-.08L42.68,101.87A12.49,12.49,0,1,1,60.35,84.2L89,112.86,142.68,59.2a12.5,12.5,0,1,1,17.68,17.67Z"
+              transform="translate(1.01 16.54) scale(0.7)"/>
+        <path v-else fill="rgba(255, 255, 255, 1)" d="M151.43,134.15a35.64,35.64,0,0,1,5.81,7.52q1.84,3.41-.61,7.79c-.37.55-.87,1.21-1.51,2s-1.3,1.53-2,2.26a26.89,26.89,0,0,1-2,2,13.1,13.1,0,0,1-1.71,1.3,10.89,10.89,0,0,1-8.07,1.09,16.26,16.26,0,0,1-8.34-4.65l-5.74-5.74L119.57,140l-9-9-9.85-9.84-17.5,17.5q-8.07,8.07-13.12,13.26-5.2,5.19-10.33,6.43A9.56,9.56,0,0,1,50.66,156l-1-1-1.5-1.5-1.5-1.5a5.93,5.93,0,0,1-1-1.1A8.08,8.08,0,0,1,44,147.07a8.74,8.74,0,0,1,.34-3.9,13.88,13.88,0,0,1,1.85-3.69,23.41,23.41,0,0,1,2.73-3.28q1.23-1.09,4.38-4.11l7.38-7.65q4.52-4.38,10-9.85t11.56-11.48q-6.57-6.57-12.52-12.44L59.07,80.14q-4.73-4.65-7.73-7.59l-3.69-3.62c-2.37-2.37-3.57-4.72-3.62-7.05a11.89,11.89,0,0,1,2.39-7,28.65,28.65,0,0,1,3.15-3.21,29.25,29.25,0,0,1,2.87-2.39c2.73-1.83,5.19-2.62,7.38-2.4s4.38,1.49,6.56,3.76l4.24,4.24q3.15,3.15,7.8,7.66T88.88,72.69L101,84.51q5.19-5.19,10.18-10.12t9.3-9.22q4.31-4.32,7.79-7.73t5.82-5.74a16.23,16.23,0,0,1,7.11-4.17,8.12,8.12,0,0,1,7.38,1.71,10.87,10.87,0,0,0,.89.68,18,18,0,0,1,1.5,1.23l1.44,1.3a5.46,5.46,0,0,0,1,.75c2.47,2.37,3.67,4.95,3.63,7.73a11.07,11.07,0,0,1-3.63,7.72q-2.46,2.46-6.08,6.15c-2.42,2.47-5.1,5.16-8.07,8.07s-6.08,6-9.36,9.3l-10.39,10.39q5.06,4.92,9.91,9.64c3.23,3.15,6.24,6.08,9,8.82s5.29,5.24,7.52,7.52,4.08,4.15,5.54,5.61Z"
+              transform="translate(6.88 24.81) scale(0.6)"/>
+      </svg>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  },
+  props: {
+    radio: { // 单选
+      type: Boolean,
+      default: false
+    },
+    select: { // 选中
+      type: Boolean,
+      default: false
+    },
+    state: { // 状态
+      type: String,
+      default: 'default'
+    },
+    disabled: { // 禁用
+      type: Boolean,
+      default: false
+    }
+  },
+  watch: {
+    select: {
+      handler(val) {
+        console.log(val)
+      },
+      deep: true
+    }
+  }
+}
+</script>
+
+<style scoped>
+.svg-choice {
+  position: absolute;
+  top: 2px;
+  left: 0;
+  z-index: 1;
+}
+</style>

package/src/components/seek/src/word.css

@@ -0,0 +1,246 @@
+.paper{
+    background: #fff;
+    padding: 40px;
+    border: 1px solid #ccc;
+    width: 793px;
+    margin: 0 auto;
+}
+.parer-name{
+    text-align: right;
+}
+.parer-name-list{
+    height: 25px;
+    line-height: 25px;
+    font-size: 12px;
+}
+.choice:after {
+    content: "";
+    clear: left;
+    display: block;
+}
+.text{
+    letter-spacing: 25px;
+    margin-right: -25px;
+}
+.parer-name-list span{
+    line-height: 25px;
+    display: inline-block;
+}
+.parer-name-list em{
+    display: inline-block;
+    min-width: 100px;
+    border-bottom: 1px solid #000;
+    height: 25px;
+    line-height: 25px;
+    text-align: left;
+    margin-left: 10px;
+    font-style: normal;
+}
+.parer-title{
+    padding: 30px 0;
+    text-align: center;
+}
+.parer-title span{
+    font-size: 14px;
+}
+.parer-title p{
+    font-size: 20px;
+    margin-top: 5px;
+}
+.parer-cont>p{
+    font-size: 12px;
+    line-height: 18px;
+    font-weight: bold;
+}
+.parer-cont>p>span{
+    font-weight: normal;
+}
+.parer-table{
+    width: 100%;
+    margin: 5px 0;
+}
+.parer-table>table{
+    width: 100%;
+    border-left: 1px solid #ccc;
+    border-top: 1px solid #ccc;
+}
+.parer-table>table th,.parer-table>table td{
+    line-height: 30px;
+    font-weight: normal;
+    text-align: center;
+    border-bottom: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+    font-size: 14px;
+}
+.choice-title{
+    font-size: 16px;
+    font-weight: 700;
+    line-height: 23px;
+}
+.subject{
+    font-size: 14px;
+    line-height: 25px;
+    display: flex;
+    align-items: center;
+}
+.subject-title{
+    flex: 1;
+    position: relative;
+    line-height: 24px;
+}
+.subject-title label{
+    display: inline-block;
+}
+.subject-title label input{
+    position: absolute;
+    top: 5px;
+    left: 0;
+    z-index: 1;
+}
+.subject span{
+    text-align: justify;
+    padding-left: 2em;
+}
+.subject span em{
+    font-style: normal;
+    padding-left: 5px;
+}
+.choice-box{
+    text-indent: 2em;
+    line-height: 24px;
+    font-size: 14px;
+    position: relative;
+}
+.choice-input{
+    position: absolute;
+    top: 7px;
+    left: 2em;
+    z-index: 1;
+}
+.choice-span{
+    padding-left: 20px;
+}
+.choice-color{
+    color: #00ff00;
+}
+.paper-textarea{
+    width: calc(100% - 2em);
+    height: 85px;
+    margin-left: 2em;
+    resize: none;
+    padding: 10px;
+    box-sizing: border-box;
+    font-size: 14px;
+}
+.array-ch .choice-box{
+    float: left;
+    width: 50%;
+}
+.but{
+    margin-left: 5px;
+    font-size: 12px;
+    background-color: transparent;
+    border: 1px solid #000;
+    border-radius: 3px;
+    padding: 2px 5px;
+    cursor: pointer;
+    min-width: 60px;
+    height: 21px;
+}
+.buts-actives{
+    color: #00ff00 !important;
+}
+input[name='check'] {
+    width: 15px;
+    height: 15px;
+    position: absolute;
+    top: 5px;
+    left: 0;
+}
+.subject-but{
+    position: relative;
+}
+.subject-but b{
+    position: absolute;
+    z-index: 1;
+    display: flex;
+}
+.subject-html-title{
+    text-indent: 2em;
+    font-weight: bold;
+    font-size: 14px;
+    line-height: 24px;
+}
+.subject-html-cont{
+    text-align: justify;
+    line-height: 24px;
+    text-indent: 2em;
+}
+.table{
+    width: 100%;
+    margin: 5px 0;
+}
+.table table{
+    width: 100%;
+    border-left: 1px solid #ccc;
+    border-top: 1px solid #ccc;
+}
+.table table td{
+    line-height: 30px;
+    font-weight: normal;
+    text-align: center;
+    border-bottom: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+    font-size: 14px;
+}
+.table table td:first-child{
+    width: 110px;
+}
+.tab-title{
+    font-weight: 700 !important;
+}
+.reasoning{
+    font-size: 16px;
+    font-weight: 700;
+    text-indent: 1.7em;
+    display: inline-block;
+    padding-bottom: 8px;
+}
+.subject-student-edi{
+    text-indent: 2em;
+    padding: 2px 0;
+}
+.review{
+    padding-left: 2em;
+    box-sizing: border-box;
+}
+.review-title{
+    padding: 6px 0 4px 0;
+    display: flex;
+    justify-content: center;
+}
+.review-title span{
+    flex: 1;
+    font-size: 16px;
+    font-weight: 700;
+}
+.table td>input{
+    width: 80px;
+    border: 0;
+    text-align: center;
+}
+.choice-red{
+    color: red;
+}
+.task {
+    display: flex;
+    justify-content: center;
+}
+.task>span{
+    font-size: 16px;
+    font-weight: 700;
+    flex: 1;
+}
+.padd{
+    padding-bottom: 24px;
+}

package/src/components/seek/src/word.vue

@@ -0,0 +1,222 @@
+<template>
+  <div :class="{paper: borderShow}">
+    <div class="parer-cont" ref="parer">
+      <div class="paper-choice" :class="{'array-ch': !styleText(item.testKey)}" v-for="(item,index) in value">
+        <div class="subject">
+          <div class="subject-title" :class="{'padd': item.top !== 0}" v-if="item.subject">
+            <input v-if="multipleShow" type="checkbox" :checked="item.checked" @change="checkboxChange($event,index)"
+                   name="check"/>
+            <span>{{ item.order ? item.order : index + 1 }}{{ item.order === ' ' ? '' : '.' }}<em
+                v-html="item.title"></em><em v-if="scoreShow">({{ item.score }}分)</em>
+                               <i class="subject-but" ref="subject">
+                                 <b :style="{right: -item.right + 'px', top: item.top + 'px'}" ref="b">
+                                       <button class="but" v-for="(it) in item.customBut" :class="{'buts-actives': it.active}" @click="customButTap(it,item)">{{ it.active? it.nameActive: it.name }}</button>
+                                   </b>
+                               </i>
+                           </span>
+          </div>
+        </div>
+        <div v-if="item.alist" class="subject-html" v-show="item.open">
+          <div v-for="(it,ind) in item.alist">
+            <div v-if="it.annexType === '0'">
+              <div class="subject-html-title">{{ titleText }}{{ ind + 1 }}</div>
+              <div class="subject-html-cont" v-html="it.annexContent"></div>
+            </div>
+          </div>
+        </div>
+        <div class="choice" v-if="item.testKey" v-show="item.open">
+          <div class="choice-box" v-for="(ts,ind) in item.testKey">
+            <label>
+              <input class="choice-input" style="display: none;" :disabled="disabled" :checked="ts.checked"
+                     @change="answerChange($event,item,`${id}${index}`,ts)" :type="ques(item.quesType)? 'radio': 'checkbox'"
+                     :name="`${id}${index}`"/>
+              <svgs v-if="chooseAnswer" :radio="ques(item.quesType)" :select="ts.checked" :disabled="disabled" :state="stateFun(ts,item)"></svgs>
+              <span :class="{'choice-span': chooseAnswer}">{{
+                  ts.index
+                }}. {{ ts.content[0] }}</span>
+            </label>
+          </div>
+        </div>
+        <slot name="content" :row="item"></slot>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import {html2json, json2html} from 'html2json'
+import svgs from './icon.vue'
+
+export default {
+  name: "zydx-seek2",
+  components: {svgs},
+  data() {
+    return {
+      value: [],
+      multipleShow: false,
+      id: null
+    }
+  },
+  props: {
+    data: {
+      type: Array,
+      default: []
+    },
+    disabled: {
+      type: Boolean,
+      default: false
+    },
+    multiple: {
+      type: Boolean,
+      default: false
+    },
+    borderShow: {
+      type: Boolean,
+      default: true
+    },
+    titleText: {
+      type: String,
+      default: '材料'
+    },
+    chooseAnswer: {
+      type: Boolean,
+      default: true
+    },
+    scoreShow: {
+      type: Boolean,
+      default: false
+    },
+  },
+  watch: {
+    data: {
+      handler: function (val, oldVal) {
+        this.init()
+      },
+      immediate: true,
+      deep: true,
+    },
+    multiple: {
+      handler: function (val, oldVal) {
+        this.multipleShow = val
+      },
+      immediate: true,
+      deep: true
+    },
+    replace: {
+      handler: function (val, oldVal) {
+        this.replaceShow = val
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.id = this.randomId()
+  },
+  emits: ['change', 'butChange', 'changeAll', 'judgeAnswer'],
+  methods: {
+    stateFun(ts,item) {
+      if(this.disabled&&ts.checked&&!item.error&&!this.nothing) return 'correct'
+      if(this.disabled&&ts.checked&&item.error&&!this.nothing) return 'error'
+      return 'default'
+    },
+    customButTap(e,d) {
+      if(e.key === 'option') d.open = !d.open
+      if(e.butStart) e.active = !e.active
+      this.$emit('butChange',d)
+    },
+    init() {
+      const val = JSON.parse(JSON.stringify(this.data))
+      this.value = val.map((item, index) => { // 转换html
+        item.choice = true
+        item.right = 0
+        item.top = 0
+        item.open = item.open !== undefined ? item.open : true
+        item.error = item.error !== undefined ? item.error : false
+        item.subject = item.subject !== undefined ? item.subject : true
+        if (item.alist) {
+          item.alist.map(x => {
+            x.annexContent = json2html({node: "root", child: JSON.parse(x.annexContent)})
+            return x
+          })
+        }
+        if (item.testKey) {
+          item.testKey = typeof item.testKey === 'string' ? JSON.parse(item.testKey) : item.testKey
+          let judge = item?.judgeAnswer
+          if (item.stuAnswer) judge = item.stuAnswer?.answer
+          item.testKey = item.testKey.map(x => {
+            if (this.ques(item.quesType)) { // 判断是否单选
+              x.checked = x.index === judge;  //答案
+            } else {
+              for (let i = 0; i < judge?.length; i++) {
+                if (x.index === judge[i]) {
+                  x.checked = true
+                  break
+                } else {
+                  x.checked = false
+                }
+              }
+            }
+            return x
+          })
+        }
+        return item
+      })
+      this.$nextTick(() => {  // 保证所有的数据都渲染完毕
+        const w = this.$refs.parer.offsetWidth // 获取父级宽度
+        for (let i = 0; i < this.$refs?.subject?.length; i++) {
+          this.value[i].right = w - this.$refs.subject[i].offsetLeft
+          if (this.$refs.b && this.$refs.b.length > 0) {
+            if (this.value[i].right < this.$refs.b[i].offsetWidth) this.value[i].top = 25 // 判断是否换行
+          }
+        }
+      })
+    },
+    randomId() { // 生成随机id
+      const id = Math.random().toString(36).substr(2)
+      return id.replace(/[0-9]/g, '')
+    },
+    answerChange(e, v, id, check) {
+      if(this.ques(v.quesType)) {
+        v.testKey.map(x => {
+          x.checked = false
+          return x
+        })
+      }
+      check.checked = e.target.checked
+      let answerArr = []
+      const ids = document.getElementsByName(id)
+      ids.forEach((x, index) => {
+        if (x.checked) {
+          answerArr.push(v.testKey[index].index)
+        }
+      })
+      this.$emit('judgeAnswer', {
+        ...v,
+        judgeAnswer: this.ques(v.quesType) ? answerArr[0] : answerArr
+      })
+    },
+    checkboxChange(e, index) {
+      this.value[index].checked = e.target.checked
+      this.$emit('change', {
+        data: this.value[index],
+        value: e.target.checked
+      })
+      this.$emit('changeAll', this.value)
+    },
+    ques(v) {
+      return v.indexOf('101') > -1
+    },
+    styleText(v) {
+      if (!v || v === 'null') return
+      for (let i = 0; i < v.length; i++) {
+        if (v[i].content[0].length > 10) {
+          return true
+        }
+      }
+      return false
+    },
+  }
+}
+</script>
+
+<style scoped src="./word.css"></style>

package/src/components/word/src/word.vue

@@ -142,7 +142,8 @@ export default {
       choiceState: true,
       replaceShow: this.replace,
       replaceOpen: false,
-      id: null
+      id: null,
+      states: false
     }
   },
   props: {
@@ -232,10 +233,11 @@ export default {
   watch: {
     data: {
       handler: function (val, oldVal) {
-        if (this.state) return
+        if (this.states) return
         this.init()
       },
       immediate: true,
+      deep: true,
     },
     multiple: {
       handler: function (val, oldVal) {
@@ -248,11 +250,18 @@ export default {
         this.replaceShow = val
       },
       deep: true
+    },
+    state: {
+      handler: function (val) {
+        this.states = val
+      },
+      deep: true,
+      immediate: true
     }
   },
   mounted() {
     this.id = this.randomId()
-    if (!this.state) return
+    if (!this.states) return
     this.init()
   },
   emits: ['change', 'modify', 'del', 'changeAll', 'replaceData', 'choiceData', 'judgeAnswer', 'openReasoning', 'review', 'subject'],

package/src/index.js

@@ -33,6 +33,7 @@ import lessonTemplate from './components/lesson_template/index';
 import paper from './components/word2/index';
 import question from './components/question/index';
 import tagging from './components/tagging/index';
+import seek from './components/seek/index';
 
 const components = [
     Calendar,
@@ -67,7 +68,8 @@ const components = [
     lessonTemplate,
     paper,
     question,
-    tagging
+    tagging,
+    seek
 ];
 
 function install(app) {
@@ -79,7 +81,7 @@ function install(app) {
 }
 
 export default {
-    version: '1.32.283',
+    version: '1.32.284',
     install,
     Calendar,
     Message,
@@ -115,6 +117,7 @@ export default {
     lessonTemplate,
     paper,
     question,
-    tagging
+    tagging,
+    seek
 };