@shijiu/jsview-vue 0.9.254 → 0.9.267

package/samples/FlowMultiWidget/components/FlowPage.vue

@@ -1,60 +1,60 @@
-<!--
- * @Author: ChenChanghua
- * @Date: 2021-09-27 13:50:40
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2021-09-28 14:38:05
- * @Description: file content
--->
-<script>
-import {
-  VERTICAL,
-  SimpleWidget,
-} from "jsview/utils/JsViewEngineWidget";
-import Block from "./Block.vue";
-
-export default {
-  components: {
-    Block,
-    SimpleWidget,
-  },
-  props: {
-    data: Object,
-    name: String,
-  },
-  setup() {
-    let measures = () => {
-      return {
-        width: 800,
-        height: 200,
-        focusable: true,
-        hasSub: false,
-      };
-    };
-    return {
-      direction: VERTICAL,
-      measures,
-    };
-  },
-};
-</script>
-
-<template>
-  <simple-widget
-    :name="name"
-    :width="800"
-    :height="600"
-    :direction="direction"
-    :data="data"
-    :measures="measures"
-  >
-    <template #renderItem="{ data, query, onEdge, onAction }">
-      <block
-        :name="name + '/block_' + query.id"
-        :data="data"
-        :query="query"
-        :onEdge="onEdge"
-        :onAction="onAction"
-      />
-    </template>
-  </simple-widget>
+<!--
+ * @Author: ChenChanghua
+ * @Date: 2021-09-27 13:50:40
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2021-09-28 14:38:05
+ * @Description: file content
+-->
+<script>
+import {
+  VERTICAL,
+  SimpleWidget,
+} from "jsview/utils/JsViewEngineWidget";
+import Block from "./Block.vue";
+
+export default {
+  components: {
+    Block,
+    SimpleWidget,
+  },
+  props: {
+    data: Object,
+    name: String,
+  },
+  setup() {
+    let measures = () => {
+      return {
+        width: 800,
+        height: 200,
+        focusable: true,
+        hasSub: false,
+      };
+    };
+    return {
+      direction: VERTICAL,
+      measures,
+    };
+  },
+};
+</script>
+
+<template>
+  <simple-widget
+    :name="name"
+    :width="800"
+    :height="600"
+    :direction="direction"
+    :data="data"
+    :measures="measures"
+  >
+    <template #renderItem="{ data, query, onEdge, onAction }">
+      <block
+        :name="name + '/block_' + query.id"
+        :data="data"
+        :query="query"
+        :onEdge="onEdge"
+        :onAction="onAction"
+      />
+    </template>
+  </simple-widget>
 </template>

package/samples/FlowMultiWidget/components/Item.vue

@@ -1,103 +1,103 @@
-<!--
- * @Author: ChenChanghua
- * @Date: 2021-09-27 13:49:54
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2021-10-15 10:53:13
- * @Description: file content
--->
-<script>
-import borderImg from "../assets/nine_patch_focus.png";
-
-export default {
-  props: {
-    data: Object,
-    query: Object,
-    onEdge: Function,
-    onAction: Object,
-  },
-  computed: {
-    imgClass() {
-      return this.focused ? "focus" : "blur";
-    },
-  },
-  setup(props) {
-    let borderStyle = {
-      borderImage: `url(${borderImg}) 40 fill`,
-      borderImageOutset: "28px 28px 28px 28px",
-      borderImageWidth: "40px",
-      width: 89,
-      height: 121,
-    };
-    let imageStyle = {
-      backgroundImage: props.data.content.url,
-      width: 89,
-      height: 121,
-      borderRadius: "8px 8px 8px 8px",
-    };
-    return {
-      borderImg,
-      borderStyle,
-      imageStyle,
-    };
-  },
-  data() {
-    return {
-      focused: false,
-    };
-  },
-  methods: {
-    onFocus() {
-      this.focused = true;
-    },
-    onBlur() {
-      this.focused = false;
-    },
-    onClick() {},
-  },
-  created() {
-    this.onAction.register("onFocus", this.onFocus);
-    this.onAction.register("onBlur", this.onBlur);
-    this.onAction.register("onClick", this.onClick);
-  },
-};
-</script>
-
-<template>
-  <div :class="imgClass">
-    <div :style="imageStyle" />
-    <div v-if="focused" :style="borderStyle" />
-  </div>
-  <div class="text">
-    {{ this.data.content.title }}
-  </div>
-</template>
-
-<style scoped>
-.focus {
-  width: 89px;
-  height: 121px;
-  transform: scale3d(1.05, 1.05, 1);
-  border-radius: 8px 8px 8px 8px;
-  transition: transform 0.25s linear;
-}
-
-.blur {
-  width: 89px;
-  height: 121px;
-  transform: scale3d(1, 1, 1);
-  border-radius: 8px 8px 8px 8px;
-  transition: transform 0.25s linear;
-}
-
-.text {
-  top: 121px;
-  width: 89px;
-  height: 25px;
-  color: #ffffff;
-  font-size: 12px;
-  line-height: 25px;
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
+<!--
+ * @Author: ChenChanghua
+ * @Date: 2021-09-27 13:49:54
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2021-10-15 10:53:13
+ * @Description: file content
+-->
+<script>
+import borderImg from "../assets/nine_patch_focus.png";
+
+export default {
+  props: {
+    data: Object,
+    query: Object,
+    onEdge: Function,
+    onAction: Object,
+  },
+  computed: {
+    imgClass() {
+      return this.focused ? "focus" : "blur";
+    },
+  },
+  setup(props) {
+    let borderStyle = {
+      borderImage: `url(${borderImg}) 40 fill`,
+      borderImageOutset: "28px 28px 28px 28px",
+      borderImageWidth: "40px",
+      width: 89,
+      height: 121,
+    };
+    let imageStyle = {
+      backgroundImage: props.data.content.url,
+      width: 89,
+      height: 121,
+      borderRadius: "8px 8px 8px 8px",
+    };
+    return {
+      borderImg,
+      borderStyle,
+      imageStyle,
+    };
+  },
+  data() {
+    return {
+      focused: false,
+    };
+  },
+  methods: {
+    onFocus() {
+      this.focused = true;
+    },
+    onBlur() {
+      this.focused = false;
+    },
+    onClick() {},
+  },
+  created() {
+    this.onAction.register("onFocus", this.onFocus);
+    this.onAction.register("onBlur", this.onBlur);
+    this.onAction.register("onClick", this.onClick);
+  },
+};
+</script>
+
+<template>
+  <div :class="imgClass">
+    <div :style="imageStyle" />
+    <div v-if="focused" :style="borderStyle" />
+  </div>
+  <div class="text">
+    {{ this.data.content.title }}
+  </div>
+</template>
+
+<style scoped>
+.focus {
+  width: 89px;
+  height: 121px;
+  transform: scale3d(1.05, 1.05, 1);
+  border-radius: 8px 8px 8px 8px;
+  transition: transform 0.25s linear;
+}
+
+.blur {
+  width: 89px;
+  height: 121px;
+  transform: scale3d(1, 1, 1);
+  border-radius: 8px 8px 8px 8px;
+  transition: transform 0.25s linear;
+}
+
+.text {
+  top: 121px;
+  width: 89px;
+  height: 25px;
+  color: #ffffff;
+  font-size: 12px;
+  line-height: 25px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 </style>

package/samples/FlowMultiWidget/components/MenuItem.vue

@@ -1,72 +1,72 @@
-<!--
- * @Author: ChenChanghua
- * @Date: 2021-09-28 16:02:50
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2021-09-28 16:22:24
- * @Description: file content
--->
-<!--
- * @Author: ChenChanghua
- * @Date: 2021-09-27 13:49:54
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2021-09-28 15:42:49
- * @Description: file content
--->
-<script>
-export default {
-  props: {
-    data: Object,
-    query: Object,
-    onEdge: Function,
-    onAction: Object,
-  },
-  computed: {
-    bgStyle() {
-      return {
-        width: 280,
-        height: 40,
-        backgroundColor: this.isFocus ? "#06a7ff" : "#575d8d",
-      };
-    },
-  },
-  data() {
-    return {
-      isFocus: false,
-    };
-  },
-  methods: {
-    onFocus() {
-      this.isFocus = true;
-    },
-    onBlur() {
-      this.isFocus = false;
-    },
-    onClick() {},
-  },
-  created() {
-    this.onAction.register("onFocus", this.onFocus);
-    this.onAction.register("onBlur", this.onBlur);
-    this.onAction.register("onClick", this.onClick);
-  },
-};
-</script>
-
-<template>
-  <div :style="bgStyle">
-    <div class="text">
-      {{ data.title }}
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.text {
-  width: 280px;
-  height: 40px;
-  color: #ececec;
-  font-size: 12px;
-  line-height: 40px;
-  white-space: nowrap;
-  text-align: left;
-}
+<!--
+ * @Author: ChenChanghua
+ * @Date: 2021-09-28 16:02:50
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2021-09-28 16:22:24
+ * @Description: file content
+-->
+<!--
+ * @Author: ChenChanghua
+ * @Date: 2021-09-27 13:49:54
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2021-09-28 15:42:49
+ * @Description: file content
+-->
+<script>
+export default {
+  props: {
+    data: Object,
+    query: Object,
+    onEdge: Function,
+    onAction: Object,
+  },
+  computed: {
+    bgStyle() {
+      return {
+        width: 280,
+        height: 40,
+        backgroundColor: this.isFocus ? "#06a7ff" : "#575d8d",
+      };
+    },
+  },
+  data() {
+    return {
+      isFocus: false,
+    };
+  },
+  methods: {
+    onFocus() {
+      this.isFocus = true;
+    },
+    onBlur() {
+      this.isFocus = false;
+    },
+    onClick() {},
+  },
+  created() {
+    this.onAction.register("onFocus", this.onFocus);
+    this.onAction.register("onBlur", this.onBlur);
+    this.onAction.register("onClick", this.onClick);
+  },
+};
+</script>
+
+<template>
+  <div :style="bgStyle">
+    <div class="text">
+      {{ data.title }}
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.text {
+  width: 280px;
+  height: 40px;
+  color: #ececec;
+  font-size: 12px;
+  line-height: 40px;
+  white-space: nowrap;
+  text-align: left;
+}
 </style>

package/samples/FlowMultiWidget/components/MyMenu.vue

@@ -1,90 +1,90 @@
-<!--
- * @Author: ChenChanghua
- * @Date: 2021-09-27 13:49:54
- * @LastEditors: ChenChanghua
- * @LastEditTime: 2021-10-25 09:56:36
- * @Description: file content
--->
-<script>
-import {
-  VERTICAL,
-  SimpleWidget,
-} from "jsview/utils/JsViewEngineWidget";
-import MenuItem from "./MenuItem.vue";
-
-export default {
-  components: {
-    SimpleWidget,
-    MenuItem,
-  },
-  props: {
-    data: Array,
-    name: String,
-  },
-  setup() {
-    let measures = () => {
-      return {
-        width: 280,
-        height: 50,
-        focusable: true,
-        hasSub: false,
-      };
-    };
-    return {
-      direction: VERTICAL,
-      measures,
-    };
-  },
-  mounted() {
-    this.$refs.focusNode.findBlockByName(this.name).requestFocus();
-  },
-};
-</script>
-
-<template>
-  <div
-    :style="{
-      left: (1280 - 300) / 2,
-      top: (720 - 255) / 2,
-      width: 300,
-      height: 255,
-      backgroundColor: '#000000',
-    }"
-  >
-    <div class="title">菜单</div>
-    <div :style="{ left: 10, top: 45 }">
-      <jsv-focus-block ref="focusNode">
-        <simple-widget
-          :name="name"
-          :width="280"
-          :height="200"
-          :direction="direction"
-          :data="data"
-          :measures="measures"
-        >
-          <template #renderItem="{ data, query, onEdge, onAction }">
-            <menu-item
-              :data="data"
-              :query="query"
-              :onEdge="onEdge"
-              :onAction="onAction"
-            />
-          </template>
-        </simple-widget>
-      </jsv-focus-block>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-.title {
-  top: 10px;
-  left: 40px;
-  width: 200px;
-  height: 25px;
-  color: #ffffff;
-  font-size: 22px;
-  white-space: nowrap;
-  text-align: center;
-}
+<!--
+ * @Author: ChenChanghua
+ * @Date: 2021-09-27 13:49:54
+ * @LastEditors: ChenChanghua
+ * @LastEditTime: 2021-10-25 09:56:36
+ * @Description: file content
+-->
+<script>
+import {
+  VERTICAL,
+  SimpleWidget,
+} from "jsview/utils/JsViewEngineWidget";
+import MenuItem from "./MenuItem.vue";
+
+export default {
+  components: {
+    SimpleWidget,
+    MenuItem,
+  },
+  props: {
+    data: Array,
+    name: String,
+  },
+  setup() {
+    let measures = () => {
+      return {
+        width: 280,
+        height: 50,
+        focusable: true,
+        hasSub: false,
+      };
+    };
+    return {
+      direction: VERTICAL,
+      measures,
+    };
+  },
+  mounted() {
+    this.$refs.focusNode.findBlockByName(this.name).requestFocus();
+  },
+};
+</script>
+
+<template>
+  <div
+    :style="{
+      left: (1280 - 300) / 2,
+      top: (720 - 255) / 2,
+      width: 300,
+      height: 255,
+      backgroundColor: '#000000',
+    }"
+  >
+    <div class="title">菜单</div>
+    <div :style="{ left: 10, top: 45 }">
+      <jsv-focus-block ref="focusNode">
+        <simple-widget
+          :name="name"
+          :width="280"
+          :height="200"
+          :direction="direction"
+          :data="data"
+          :measures="measures"
+        >
+          <template #renderItem="{ data, query, onEdge, onAction }">
+            <menu-item
+              :data="data"
+              :query="query"
+              :onEdge="onEdge"
+              :onAction="onAction"
+            />
+          </template>
+        </simple-widget>
+      </jsv-focus-block>
+    </div>
+  </div>
+</template>
+
+<style scoped>
+.title {
+  top: 10px;
+  left: 40px;
+  width: 200px;
+  height: 25px;
+  color: #ffffff;
+  font-size: 22px;
+  white-space: nowrap;
+  text-align: center;
+}
 </style>