cnhis-design-vue 2.2.3 → 2.2.5

package/packages/scale-view/data.js

@@ -1,80 +0,0 @@
-export const defaultFormItem = {
-  type: "TITLE", // 类型
-  title: "标题", // 标题
-  id: "",
-  seq: "0", // 题号
-  validation: false, // 是否校验
-  required: false, // 是否必填
-  options: [], // 自定义选项
-
-  describe: "", // 分线栏，标题 描述 +
-  valueType: "", // 值的类型：'number' 暂时用于 input的 number类型 +
-  startToStop: false,
-
-  // 动态数据配置
-  target_source: {
-    target_id: "",
-    target_title: "",
-    values: "", // 取值字段
-    param: []
-  },
-
-  // 关联配置
-  relation_logic: {
-    relation_logic: "", // "ADN // OR",
-    relation_logic_is: false,
-    condition_target: "", // 暂无用 +
-    // 主动关联
-    condition: [
-      // {
-      //   subject_seq: "1",
-      //   con: "EQ",
-      //   value: "选项1"
-      // }
-    ],
-
-    // 被动关联
-    relation_logic_passive: "", // "ADN // OR",
-    relation_logic_passive_is: false,
-    condition_passive_target: "", // 条件满足 操作的目标 +
-    condition_passive: [
-      // {
-      //   subject_seq: "1", // 题号
-      //   con: "EQ",
-      //   value: "选项1"
-      // },
-    ]
-  },
-
-  // 跳题配置
-  next_logic: {
-    next_logic: "", // condition 条件 uncondition 无条件跳题
-    next_logic_is: true,
-    condition: [
-      // {
-      //   con: "EQ",
-      //   value: "选项1",
-      //   next_subject: "5" // end 结束
-      // }
-    ]
-  },
-
-  // 自定义 string
-  setting: {
-    addressType: "", // 用于地址组件 设置地址格式 +：
-    /**
-     * 'province', 省
-     * 'province-city', 省-市
-     * 'province-city-district', 省-市-区
-     * 'province-city-district-address' 省-市-区-详细地址
-     */
-
-    defaultValue: "", // 默认值
-    // 外部默认值
-    outDefaultValue: {
-      urlKey: "" // URL链接带的key,可能有多个
-    },
-    startToStop: "0", // 0 / 1 暂用于时间，日期组件 设置起止类型 +
-    limitPic: "" // 图片上传的数量限制
-  }
-};

package/packages/scale-view/directive/drag-move.js

@@ -1,132 +0,0 @@
-const findparent = (el, name) => {
-  let parent = el.parentElement;
-  let pcname = parent.className || '';
-  while (parent && !pcname.includes(name)) {
-    parent = parent.parentElement;
-    if (parent) pcname = parent.className || '';
-  }
-  return parent;
-};
-
-const initSetDom = (dragDom, pDom) => {
-  const screenWidth = pDom?.clientWidth || document.body.clientWidth; // body当前宽度
-
-  const dragDomWidth = dragDom.offsetWidth; // 对话框宽度
-
-  const iL = screenWidth - dragDomWidth;
-
-  dragDom.style.cssText += `position: absolute;left:${iL}px;top:0 px;right:unset;`;
-};
-
-// 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);
-const sty = (function() {
-  if (document.body.currentStyle) {
-    // 在ie下兼容写法
-    return (dom, attr) => dom.currentStyle[attr];
-  }
-  return (dom, attr) => getComputedStyle(dom, null)[attr];
-})();
-
-const maskStyle = 'position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 2999;width: 100%;height: 100%;';
-
-const mouseMove = (e, config) => {
-  const { dragDom, minDragDomLeft, maxDragDomLeft, disX, disY, minDragDomTop, maxDragDomTop, styL, styT } = config || {};
-  // 通过事件委托，计算移动的距离
-  let left = e.clientX - disX;
-  let top = e.clientY - disY;
-  // 边界处理
-  if (-left > minDragDomLeft) {
-    left = -minDragDomLeft;
-  } else if (left > maxDragDomLeft) {
-    left = maxDragDomLeft;
-  }
-
-  if (-top > minDragDomTop) {
-    top = -minDragDomTop;
-  } else if (top > maxDragDomTop) {
-    top = maxDragDomTop;
-  }
-
-  // 移动当前元素
-  dragDom.style.cssText += `;left:${left + styL}px;top:${top + styT}px;`;
-};
-
-const mouseUp = () => {
-  const iframeFix = document.getElementsByClassName('scale-countdown-iframeFix')[0];
-  iframeFix && document.body.removeChild(iframeFix);
-  document.onmousemove = null;
-  document.onmouseup = null;
-};
-
-const dragMethod = obj => {
-  const { el, containerName, targetName, contentName } = obj;
-  const pDom = findparent(el, containerName);
-
-  const dialogHeaderEl = pDom.querySelector(`.${targetName}`);
-  const dragDom = pDom.querySelector(`.${contentName}`);
-  // 初始化定位
-  initSetDom(dragDom, pDom);
-
-  dialogHeaderEl.style.cssText += ';cursor:move;';
-
-  dialogHeaderEl.onmousedown = e => {
-    const dialogMask = document.createElement('div');
-    dialogMask.className = 'scale-countdown-iframeFix';
-    dialogMask.setAttribute('style', maskStyle);
-    document.body.appendChild(dialogMask);
-
-    // 鼠标按下，计算当前元素距离可视区的距离
-    const disX = e.clientX - dialogHeaderEl.offsetLeft;
-    const disY = e.clientY - dialogHeaderEl.offsetTop;
-    const screenWidth = pDom?.clientWidth || document.body.clientWidth; // body当前宽度
-    const screenHeight = pDom?.clientHeight || document.documentElement.clientHeight; // 可见区域高度(应为body高度，可某些环境下无法获取)
-
-    const dragDomWidth = dragDom.offsetWidth; // 对话框宽度
-    const dragDomheight = dragDom.offsetHeight; // 对话框高度
-
-    const minDragDomLeft = dragDom.offsetLeft;
-    const maxDragDomLeft = screenWidth - dragDom.offsetLeft - dragDomWidth;
-
-    const minDragDomTop = dragDom.offsetTop;
-    const maxDragDomTop = screenHeight - dragDom.offsetTop - dragDomheight;
-
-    // 获取到的值带px 正则匹配替换
-    let styL = sty(dragDom, 'left');
-    // 为兼容ie
-    if (styL === 'auto') styL = '0px';
-    let styT = sty(dragDom, 'top');
-
-    // console.log(styL)
-    // 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px
-    if (styL.includes('%')) {
-      styL = +screenWidth * (+styL.replace(/%/g, '') / 100);
-      styT = +screenHeight * (+styT.replace(/%/g, '') / 100);
-    } else {
-      styL = +styL.replace(/px/g, '');
-      styT = +styT.replace(/px/g, '');
-    }
-
-    document.onmousemove = e => mouseMove(e, { dragDom, minDragDomLeft, maxDragDomLeft, disX, disY, minDragDomTop, maxDragDomTop, styL, styT });
-
-    document.onmouseup = mouseUp;
-    return false;
-  };
-};
-
-// 拖拽的指令
-export default {
-  bind: function(el, binding, vnode) {
-    // 自定义属性，判断是否可拖拽
-    if (!binding.value) return;
-    const { target, container, content, isDrag } = binding.value || {};
-    if (!isDrag) return;
-
-    const containerName = container || 'r-scale-v3'; // 容器dom
-    const targetName = target || 'evaluateCountdown-wrap'; // 触发dom
-    const contentName = content || 'c-evaluateCountdown-v2'; // 移动dom
-
-    setTimeout(() => {
-      dragMethod({ el, containerName, targetName, contentName });
-    }, 50);
-  }
-};

package/packages/scale-view/evaluateCountdown.vue

@@ -1,157 +0,0 @@
-<template>
-  <div
-    class="evaluateCountdown c-evaluateCountdown-v2"
-    v-drag-move="dragSetting" 
-    :class="{ 'evaluateCountdown-hasTime': showEvaluateCountdown }"
-  >
-    <div class="evaluateCountdown-wrap">
-      <div v-if="showEvaluateCountdown" class="countdown" :class="{ 'countdown-red': countdownRed }">
-        <span>{{ countdownStr }}</span>
-        <svg-icon icon-class="zhongtai-zujianliebiao-gongzuoshijian"></svg-icon>
-      </div>
-      <div class="answered-wrap">
-        答题情况： {{ setAnswered }}/<span>{{ totalLen }}</span>
-      </div>
-    </div>
-  </div>
-</template>
-<script>
-import evaluate from "./mixin/evaluate";
-import moment from 'moment';
-import dragMove from './directive/drag-move'
-export default {
-  name: "evaluateCountdown",
-  mixins: [evaluate],
-  components: {},
-  directives: { dragMove },
-  props: [
-    "formArray",
-    "evaluateResultConfig",
-    "evaluateResultSetting",
-    "form",
-    "currentTime",
-    "showEvaluateCountdown"
-  ],
-  data() {
-    return {
-      source: "countdown",
-      setAnswered: 0,
-      dragSetting: { isDrag: true }
-    };
-  },
-
-  computed: {},
-  watch: {
-    form: {
-      immediate: true,
-      deep: true,
-      handler(val) {
-        if (!val && !Object.keys(val).length) return;
-        console.log("触发修改啦啦啦");
-        this.diffAnswered(val);
-      }
-    }
-  },
-  // 生命周期
-  created() {},
-  mounted() {
-    this.init();
-  },
-
-  // 方法
-  methods: {
-    init() {
-      this.getTotalLen();
-      // 倒计时
-      let { evaluateStartTime, evaluateTime } = this.evaluateResultSetting;
-      if (!this.showCountdown || !evaluateTime) return;
-      let startTime = evaluateStartTime ? moment(evaluateStartTime) : moment();
-      let rangTime = startTime.add(evaluateTime, "minutes");
-      this.clearTimer();
-      this.countdown(rangTime);
-    },
-    diffAnswered(form) {
-      let useFormArray = this.formArray?.filter(item => !this.filterArr.includes(item.type));
-      if (!useFormArray || !useFormArray.length) return;
-      let useForm = {};
-      useFormArray.forEach(item => {
-        const key = item.databaseTitle || item.title;
-        // useForm[item.title] = form[item.title];
-        useForm[key] = form[key];
-      });
-      console.log(useForm);
-      let num = 0;
-      for (let key in useForm) {
-        let value = useForm[key];
-        let type = this.checkType(value);
-        if (type == "[object Object]") {
-          if (value && Object.keys(value).length) num++;
-        } else if (type == "[object Array]") {
-          if (value && value.length) num++;
-        } else if (type == "[object Number]") {
-          if (value || value === 0) num++;
-        } else {
-          if (value) num++;
-        }
-      }
-      this.setAnswered = num;
-    },
-    checkType(val) {
-      return Object.prototype.toString.call(val);
-    }
-  }
-};
-</script>
-<style lang="less" scoped>
-.evaluateCountdown {
-  position: absolute;
-  top: 0;
-  right: 0;
-  min-width: 166px;
-  padding: 8px 12px;
-  background: #f2f2f4;
-  border-radius: 8px;
-  color: #212121;
-  z-index: 2;
-  text-align: center;
-  user-select: none;
-  &.evaluateCountdown-hasTime {
-
-    padding: 8px 32px;
-    background: #f1f1f4;
-    .countdown {
-      line-height: 40px;
-      font-size: 26px;
-      span {
-        line-height: unset;
-      }
-      svg {
-        display: none;
-      }
-    }
-  }
-  .countdown {
-    display: flex;
-    align-content: center;
-    justify-content: center;
-    font-size: 14px;
-    color: #000000;
-    span {
-      line-height: 18px;
-    }
-    svg {
-      margin-left: 8px;
-      font-size: 16px;
-      color: #969696;
-    }
-    &.countdown-red {
-      color: #ff1818;
-    }
-  }
-  .answered-wrap {
-    span {
-      color: #2d7aff;
-    }
-  }
-}
-</style>

package/packages/scale-view/evaluatePage.vue

@@ -1,203 +0,0 @@
-<template>
-  <div class="evaluate-page">
-    <div class="evaluate-container">
-      <h4 class="evaluate-name" v-if="evaluateResultSetting.evaluateName">
-        {{ evaluateResultSetting.evaluateName }}</h4
-      >
-      <div class="evaluate-explain" v-if="evaluateResultSetting.evaluateExplain">
-        <div>
-          {{ evaluateResultSetting.evaluateExplain }}
-        </div>
-      </div>
-      <ul class="evaluate-score">
-        <li>
-          <div>{{ totalLen }}</div>
-          <span>测评总题</span>
-        </li>
-        <li>
-          <div>{{ maxScore }}</div>
-          <span>测评总分</span>
-        </li>
-        <li v-if="getEvaluateTime">
-          <div>{{ getEvaluateTime }}</div>
-          <span>测试时间(分钟)</span>
-        </li>
-      </ul>
-      <div class="evaluate-time-range" v-if="showRange">
-        {{ timeRange }}
-      </div>
-      <a-button
-        class="evaluate-btn"
-        type="primary"
-        @click="writeGuage"
-        :disabled="disabledEvaluate || banStart"
-      >
-        {{ getEvaluateText }}
-        <template v-if="!isTimeOut && countdownStr">（{{ countdownStr }}）</template>
-      </a-button>
-    </div>
-  </div>
-</template>
-<script>
-import { Button } from 'ant-design-vue'
-import evaluate from "./mixin/evaluate";
-import moment from 'moment';
-export default {
-  name: "evaluatePage",
-  mixins: [evaluate],
-  components: {[Button.name]: Button,},
-  props: ["formArray", "evaluateResultConfig", "evaluateResultSetting", "isFinished", "maxScore"],
-  data() {
-    return {
-      source: "page",
-      timer: null,
-      curTime: new Date().getTime(),
-      timeRange: undefined,
-      banStart: false
-    };
-  },
-
-  computed: {},
-  watch: {},
-  // 生命周期
-  created() {},
-  beforeDestroy() {},
-  mounted() {
-    this.init();
-  },
-
-  // 方法
-  methods: {
-    init() {
-      this.getTotalLen();
-      this.handleEvaluateParams();
-    },
-    handleEvaluateParams() {
-      if (!this.evaluateResultSetting || !Object.keys(this.evaluateResultSetting).length) return;
-      // 考试时间
-      if (this.showRange) {
-        let { evaluateStartTime, evaluateTime } = this.evaluateResultSetting;
-        let formatStart = moment(evaluateStartTime).format("YYYY年MM月DD日HH:mm:ss");
-        if (evaluateTime) {
-          let rangTime = moment(evaluateStartTime).add(evaluateTime, "minutes");
-          let formatEnd = rangTime.format("YYYY年MM月DD日HH:mm:ss");
-          this.timeRange = `${formatStart}~${formatEnd}`;
-        } else {
-          this.timeRange = `${formatStart}`;
-        }
-      }
-      // 未设置开始时间
-      if (!this.evaluateStartTime) return;
-      // 倒计时
-      let time = this.getEvaluateStartTime;
-      if (!time) return;
-      let startTime = time.getTime();
-      this.clearTimer();
-      this.countdown(startTime);
-    },
-
-    writeGuage() {
-      console.log("触发---writeGuage");
-      this.clearTimer();
-      let banStart = this.isBanStart();
-      this.banStart = banStart;
-      // 需要校验当前时间是否超出考试时间范围
-      if (this.banStart) return;
-      this.$emit("writeGuage", this.showCountdown);
-    }
-  }
-};
-</script>
-<style lang="less" scoped>
-.evaluate-page {
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  width: 100%;
-  height: 100%;
-  .evaluate-container {
-    width: 620px;
-    padding: 45px 32px;
-    text-align: center;
-    border-radius: 15px;
-    border: 1px solid #e0e0e0;
-    .evaluate-name {
-      font-size: 20px;
-      color: #212121;
-      line-height: 28px;
-      margin-bottom: 10px;
-      max-height: 88px;
-      overflow-y: auto;
-      word-break: break-all;
-    }
-    .evaluate-explain {
-      padding: 12px 22px 12px 30px;
-      margin-bottom: 24px;
-      text-align: left;
-      border-radius: 8px;
-      background: #f2f2f4;
-      overflow: hidden;
-      > div {
-        padding-right: 8px;
-        max-height: 206px;
-        overflow-y: auto;
-        word-break: break-all;
-      }
-    }
-    .evaluate-score {
-      display: flex;
-      margin-bottom: 24px;
-      li + li {
-        border-left: 1px solid rgba(213, 213, 213, 0.6);
-      }
-      li {
-        flex: 1;
-        div {
-          line-height: 50px;
-          font-size: 36px;
-          color: #000000;
-        }
-        span {
-          line-height: 20px;
-          font-size: 14px;
-          color: rgba(0, 0, 0, 0.6);
-        }
-      }
-    }
-    .evaluate-time-range {
-      font-size: 14px;
-      color: #000000;
-      line-height: 20px;
-      margin-bottom: 20px;
-    }
-
-    .evaluate-btn {
-      width: 380px;
-      height: unset;
-      padding: 16px 0;
-      text-align: center;
-      font-size: 18px;
-      color: #ffffff;
-      border-radius: 8px;
-    }
-    .ant-btn-primary-disabled,
-    .ant-btn-primary.disabled,
-    .ant-btn-primary[disabled],
-    .ant-btn-primary-disabled:hover,
-    .ant-btn-primary.disabled:hover,
-    .ant-btn-primary[disabled]:hover,
-    .ant-btn-primary-disabled:focus,
-    .ant-btn-primary.disabled:focus,
-    .ant-btn-primary[disabled]:focus,
-    .ant-btn-primary-disabled:active,
-    .ant-btn-primary.disabled:active,
-    .ant-btn-primary[disabled]:active,
-    .ant-btn-primary-disabled.active,
-    .ant-btn-primary.disabled.active,
-    .ant-btn-primary[disabled].active {
-      color: #ffffff;
-      background-color: #c8c8c8;
-    }
-  }
-}
-</style>