闫增涛
2024-05-27 1b89c6d9b6626e09cf3c30a2f2d7354c9f18151f
Merge branch 'master' of http://182.92.203.7:2001/r/testbookLayout
4个文件已修改
1个文件已添加
9228 ■■■■ 已修改文件
package.json 1 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/childHealth/view/content/components/chapter0004.vue 39 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/books/lifeCare/index.vue 5 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
src/components/drawflow/index.vue 209 ●●●●● 补丁 | 查看 | 原始文档 | blame | 历史
yarn.lock 8974 ●●●● 补丁 | 查看 | 原始文档 | blame | 历史
package.json
@@ -10,6 +10,7 @@
  "dependencies": {
    "axios": "^1.6.8",
    "core-js": "^3.8.3",
    "drawflow": "^0.0.59",
    "element-ui": "^2.15.14",
    "lodash": "^4.17.21",
    "moment": "^2.30.1",
src/books/childHealth/view/content/components/chapter0004.vue
@@ -342,6 +342,44 @@
            <p class="img">视频:学前儿童身高的测量</p>
          </div>
        </div>
        <div class="padding-96">
          <p class="m0-t0">
            每月平均增加200~250克;1岁时体重是出生时的3倍。2岁时为出生时的4倍;2岁后到七八岁,体重每年增长不足2千克,可用以下公式估算体重。
          </p>
          <p>1~10岁 体重(千克)=实足年龄×2+7(或8)</p>
          <p>
            称体重时,1岁以下可取卧位,孩子能站稳了,可取站位。使用前应先校正零点。测量时,调整砝码至杠杆平衡,记录读数。测量误差不得超过0.1千克。读数时,以千克为单位,至小数点后两位。
          </p>
          <p>
            体重测量应在早晨、空腹、便后进行。儿童可裸体或穿背心、短裤,也可在测后扣除衣服质量。
          </p>
          <p>(2)身高(长)</p>
          <p>
            身高(长)是人体站立时颅顶到脚跟(与地面相及处)的垂直高度。3岁以下儿童立位测量不准确,应采用仰卧位测量,故身高又称身长;3岁以后可立位测量,称身高。立位与仰卧位测量值相差1~2厘米。
          </p>
          <div class="fl fl-around">
            <div class="left" style="width: 38%">
              <p>
                身高(长)有较大的个体差异,中国新生儿出生时身长平均50厘米,第一年增长最快,前半年平均每月增长2.5厘米,后半年平均每月增长1~1.5厘米,1岁时约为出生时身长的1.5倍,即75厘米左右。第二年增长速度减慢,平均增长10厘米,以后每年递增5
              </p>
            </div>
            <div class="right" style="width: 60%">
              <video
                :src="pathTwo"
                poster="../../../assets/images/chapterOne/people-video-img.jpg"
                webkit-playsinline="true"
                x-webkit-airplay="true"
                playsinline="true"
                x5-video-orientation="h5"
                x5-video-player-fullscreen="true"
                x5-playsinline=""
                controls
                class="w100 video-border"
              ></video>
              <p class="img">视频:学前儿童身高的测量</p>
            </div>
          </div>
        <p class="t0">~7.5厘米。1岁以后平均身高估算公式如下。</p>
        <p>身高=年龄(岁)×7+70(厘米)</p>
        <p>
@@ -383,6 +421,7 @@
        </p>
      </div>
    </div>
    </div>
    <!-- 84 -->
    <div class="page-box" page="92">
      <div class="header-box">
src/books/lifeCare/index.vue
@@ -8,6 +8,9 @@
        transform: `scale(${pageZoom ? pageZoom : 1})`,
      }"
    >
      <div style="width: 100%; height: 800px;">
        <drawflow />
      </div>
      <front001 v-if="showCatalogList.indexOf(0) > -1" />
      <ChapterOne v-if="showCatalogList.indexOf(1) > -1" />
      <ChapterTwo v-if="showCatalogList.indexOf(2) > -1" />
@@ -52,6 +55,7 @@
import chapter017 from "./view/chapter017";
import chapter018 from "./view/chapter018";
import NoteIcon from "@/assets/images/biji.png";
import drawflow from "@/components/drawflow";
import _ from "lodash";
export default {
  data() {
@@ -147,6 +151,7 @@
    // }, 3000);
  },
  components: {
    drawflow,
    front001,
    ChapterOne,
    ChapterTwo,
src/components/drawflow/index.vue
New file
@@ -0,0 +1,209 @@
<template>
  <div class="drawflow">
    <div class="menu">
      <div class="menuItem">
        <div
          class="drag-drawflow"
          draggable="true"
          @dragstart="drag"
          data-node="none"
        >
          <span>节点</span>
        </div>
      </div>
    </div>
    <div class="content" id="drawflow" @drop="drop" @dragover="allowDrop"></div>
  </div>
</template>
<script>
import Vue from "vue";
import Drawflow from "drawflow";
import styleDrawflow from "drawflow/dist/drawflow.min.css";
export default {
  data() {
    return {
      editor: null,
      mobile_item_selec: "",
      mobile_last_move: null
    };
  },
  props: {
    importData: {
      type: Object
    }
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.editor = new Drawflow("drawflow", Vue, this);
      this.editor.reroute = true;
      if (this.importData) {
        // 渲染记录的数据
        this.editor.import(this.importData);
      }
      // 事件绑定
      this.editor.on("nodeCreated", function (id) {
        console.log("Node created " + id);
      });
      this.editor.on("nodeRemoved", function (id) {
        console.log("Node removed " + id);
      });
      this.editor.on("nodeSelected", function (id) {
        console.log("Node selected " + id);
      });
      this.editor.on("moduleCreated", function (name) {
        console.log("Module Created " + name);
      });
      this.editor.on("moduleChanged", function (name) {
        console.log("Module Changed " + name);
      });
      this.editor.on("connectionCreated", function (connection) {
        console.log("Connection created");
        console.log(connection);
      });
      this.editor.on("connectionRemoved", function (connection) {
        console.log("Connection removed");
        console.log(connection);
      });
      this.editor.on("mouseMove", function (position) {
        console.log("Position mouse x:" + position.x + " y:" + position.y);
      });
      this.editor.on("nodeMoved", function (id) {
        console.log("Node moved " + id);
      });
      this.editor.on("zoom", function (zoom) {
        console.log("Zoom level " + zoom);
      });
      this.editor.on("translate", function (position) {
        console.log("Translate x:" + position.x + " y:" + position.y);
      });
      this.editor.on("addReroute", function (id) {
        console.log("Reroute added " + id);
      });
      this.editor.on("removeReroute", function (id) {
        console.log("Reroute removed " + id);
      });
    },
    drop(ev) {
      if (ev.type === "touchend") {
        var parentdrawflow = document
          .elementFromPoint(
            this.mobile_last_move.touches[0].clientX,
            this.mobile_last_move.touches[0].clientY
          )
          .closest("#drawflow");
        if (parentdrawflow != null) {
          this.addNodeToDrawFlow(
            this.mobile_item_selec,
            this.mobile_last_move.touches[0].clientX,
            this.mobile_last_move.touches[0].clientY
          );
        }
        this.mobile_item_selec = "";
      } else {
        ev.preventDefault();
        var data = ev.dataTransfer.getData("node");
        this.addNodeToDrawFlow(data, ev.clientX, ev.clientY);
      }
    },
    positionMobile(ev) {
      this.mobile_last_move = ev;
    },
    drag(ev) {
      console.log(ev, "drag");
      if (ev.type === "touchstart") {
        this.mobile_item_selec = ev.target
          .closest(".drag-drawflow")
          .getAttribute("data-node");
      } else {
        ev.dataTransfer.setData("node", ev.target.getAttribute("data-node"));
      }
    },
    addNodeToDrawFlow(name, pos_x, pos_y) {
      if (this.editor.editor_mode === "fixed") {
        return false;
      }
      pos_x =
        10;
      pos_y =
        10;
      switch (name) {
        case "none":
          var none = `
        <div>
          <div>
            <input df-title />
          </div>
          <div>
          <textarea df-content></textarea>
        </div>
        </div>
        `;
          this.editor.addNode(
            "none",
            1,
            1,
            pos_x,
            pos_y,
            "none",
            {
              title: "",
              content: ""
            },
            none
          );
          break;
      }
    },
    allowDrop(ev) {
      ev.preventDefault();
    }
  }
};
</script>
<style scoped>
.drawflow {
  width: 100%;
  height: 100%;
  display: flex;
  border: 1px solid #ccc;
  background: #fff;
}
.menu {
  width: 160px;
  border-right: 1px solid #ccc;
}
.menuItem {
  border-bottom: 1px solid #ccc;
}
.drag-drawflow {
  padding: 10px 20px;
  cursor: move;
  user-select: none;
}
.content {
  flex: 1;
  overflow: hidden;
  background-size: 25px 25px;
  background-image: linear-gradient(to right, #f1f1f1 1px, transparent 1px),
    linear-gradient(to bottom, #f1f1f1 1px, transparent 1px);
}
</style>
yarn.lock
Diff too large