htui-yllkbz 1.2.35 → 1.2.39

package/src/views/About.vue

@@ -4,26 +4,44 @@
  * @Author: hutao
  * @Date: 2021-11-15 14:41:40
  * @LastEditors: hutao
- * @LastEditTime: 2021-12-22 09:58:13
+ * @LastEditTime: 2022-01-04 09:31:44
 -->
 <template>
   <div>
+    <HtExportPdf selector="f"
+                 ref="pdf"
+                 :title="'测试'"></HtExportPdf>
+    <el-button type=""
+               @click="test">test</el-button>
+    <!-- <ht-count-down :stopwatch="true"
+                     :frequency="200"
+                     :start="!state.start">
+        <template slot-scope="{timeStr}">
+          {{timeStr}}
+        </template>
+      </ht-count-down>
+      <ht-count-down :stopwatch="true"
+                     :start="!state.start">
+        <template slot-scope="{timeStr}">
+          {{timeStr}}
+        </template>
+      </ht-count-down> -->
 
-    <HtMd v-model="state.content"
-          @save="save"
-          placeholder="请输入"></HtMd>
-    <HtTable :data="state.data"
-             @onchange="test"
-             :height="200"
-             :columns="state.columns">
-      <div slot="sex"
-           slot-scope="{row}">{{row.sex?'男':'女'}}</div>
-      <div slot="age"
-           slot-scope="{row}">
-        <el-tag>{{row.age}}</el-tag>
-      </div>
-      <div slot="header_name">测试名字</div>
-    </HtTable>
+    <ht-md v-model="state.content"
+           :subfield="true"></ht-md>
+    <div ref="ht-pdf">
+      <HtTable :data="state.data"
+               :height="200"
+               :columns="state.columns">
+        <div slot="sex"
+             slot-scope="{row}">{{row.sex?'男':'女'}}</div>
+        <div slot="age"
+             slot-scope="{row}">
+          <el-tag>{{row.age}}</el-tag>
+        </div>
+        <div slot="header_name">测试名字</div>
+      </HtTable>
+    </div>
     <!-- <el-dropdown>
       <el-select placeholder="请选择">
       </el-select>
@@ -43,30 +61,73 @@
 <script lang='ts'>
 import { Component, Vue } from "vue-property-decorator";
 import HtTable from "@/packages/HtTable/index.vue";
-import HtMd from "@/packages/HtMd/index.vue";
+import HtCountDown from "@/packages/HtCountDown/index.vue";
+import HtExportPdf from "@/packages/HtExportPdf/index.vue";
+import HtUi from "htui-yllkbz";
+import "htui-yllkbz/lib/htui.css";
+Vue.use(HtUi);
 interface State {
   /** 数据状态 */
   loading: boolean;
   columns: any;
   data: any;
   content: string;
+  start: boolean;
 }
 @Component({
   components: {
     HtTable,
-    HtMd,
+    HtCountDown,
+    HtExportPdf,
   },
 })
 export default class Index extends Vue {
   /** 数据 */
   state: State = {
     loading: false,
+    start: false,
     content: "",
     data: [
-      { name: "胡涛", age: 12, sex: 0, id: 1, test: { title: "测试" } },
-      { name: "胡涛", age: 12, sex: 1, id: 2, test: { title: "测试" } },
-      { name: "胡涛", age: 12, sex: 1, id: 3, test: { title: "测试" } },
-      { name: "胡涛", age: 12, sex: 0, id: 4, test: { title: "测试" } },
+      {
+        name: "胡涛",
+        age: 12,
+        sex: 0,
+        id: 1,
+        test: { title: "测试" },
+        time: "2022-01-20T00:00:00+08:00",
+      },
+      {
+        name: "胡涛",
+        age: 12,
+        sex: 1,
+        id: 2,
+        test: { title: "测试" },
+        time: "2022-01-20T00:00:00+08:00",
+      },
+      {
+        name: "胡涛",
+        age: 12,
+        sex: 1,
+        id: 3,
+        test: { title: "测试" },
+        time: "2022-01-20T00:00:00+08:00",
+      },
+      {
+        name: "胡涛",
+        age: 12,
+        sex: 0,
+        id: 4,
+        test: { title: "测试" },
+        time: "2022-01-20T00:00:00+08:00",
+      },
+      {
+        name: "胡涛",
+        age: 12,
+        sex: 0,
+        id: 41,
+        test: { title: "测试" },
+        time: "2022-01-20T00:00:00+08:00",
+      },
     ],
     columns: [
       {
@@ -82,6 +143,12 @@ export default class Index extends Vue {
         title: "age",
         key: "age",
       },
+      {
+        title: "time",
+        type: "time",
+        spread: true,
+        key: "time",
+      },
       {
         title: "性别",
         key: "sex",
@@ -89,10 +156,24 @@ export default class Index extends Vue {
     ],
   };
   /** 生命周期 */
+  created() {
+    //this.rewriteGetComputedStyle();
+  }
   /** 方法 */
   test() {
+    (this.$refs.pdf as any).exportPdf(this.$refs["ht-pdf"]);
     //console.log("ee", e);
   }
+  // rewriteGetComputedStyle() {
+  //   const getComputedStyle = window.getComputedStyle;
+  //   window.getComputedStyle = function (element: any, property) {
+  //     console.log("element", element, typeof element);
+  //     if (element != "localhost:8080") {
+  //       return getComputedStyle(element.host || element, property);
+  //     }
+  //     return "";
+  //   };
+  // }
   save(e: string, f: string) {
     console.log("e,f", e, f);
   }