init

.svn/pristine/5b/5b09b7b1da403be8686a5c4c376afb610223e7e3.svn-base

@@ -0,0 +1,16 @@
+<script lang="ts">
+export default {
+  name: "PrintIcon",
+};
+</script>
+<script setup lang="ts">
+import LayIcon from "../component/icon/index";
+
+const props = defineProps<{
+  color?: string;
+  size?: string;
+}>();
+</script>
+<template>
+  <lay-icon :color="props.color" :size="props.size" type="layui-icon-print" />
+</template>

.svn/pristine/5b/5b99bbaea932df4c2bae63112fa21a0da8594a0b.svn-base

@@ -0,0 +1,7 @@
+import { createPinia } from "pinia";
+import piniaPluginPersist from "pinia-plugin-persist";
+
+const store = createPinia();
+store.use(piniaPluginPersist);
+
+export default store;

.svn/pristine/5b/5bc7159d6fbbdb9845042ae4762dd9fcc9e16dd4.svn-base

@@ -0,0 +1 @@
+:root{--input-border-radius: var(--global-border-radius);--input-border-color: var(--global-neutral-color-3)}.layui-input{width:100%;height:38px;line-height:38px;border-width:1px;border-style:solid;border-color:var(--input-border-color);border-radius:var(--input-border-radius);display:inline-flex}.layui-input input{height:38px;line-height:38px;background-color:#fff;color:#000000d9;padding-left:10px;display:inline-block;border:none;height:100%;width:100%}.layui-input-append{background-color:#fafafa;border-left:1px solid var(--input-border-color);display:flex;padding:0 15px;flex:none;align-items:center}.layui-input-prepend{background-color:#fafafa;border-right:1px solid var(--input-border-color);display:flex;padding:0 15px;flex:none;align-items:center}.layui-input-wrapper{width:100%;display:inline-flex;border:none}.layui-input:hover,.layui-input:focus-within{border-color:#d2d2d2}.layui-input-clear,.layui-input-prefix,.layui-input-suffix,.layui-input-password{background-color:#fff}.layui-input-clear,.layui-input-password,.layui-input-prefix,.layui-input-suffix{display:flex;flex:none;align-items:center;padding:0 10px}.layui-input-has-prefix input{padding:0}.layui-input-clear,.layui-input-password{color:#00000073}.layui-input-clear:hover{opacity:.6}.layui-input input::-webkit-input-placeholder{line-height:1.3}.layui-input input::-ms-reveal{display:none}.layui-input-disabled{border-color:var(--input-border-color)!important}.layui-input-disabled{opacity:.6}.layui-input-disabled,.layui-input-disabled *{cursor:not-allowed!important}.layui-input[size=lg]{height:44px}.layui-input[size=lg] .layui-input{height:44px;line-height:44px}.layui-input[size=md]{height:38px}.layui-input[size=md] .layui-input{height:38px;line-height:38px}.layui-input[size=sm]{height:32px}.layui-input[size=sm] .layui-input{height:32px;line-height:32px}.layui-input[size=xs]{height:26px}.layui-input[size=xs] .layui-input{height:26px;line-height:26px}

.svn/pristine/5b/5bcd19d0ad3c14e4f6bae30071f97ddef10e51b1.svn-base

@@ -0,0 +1,161 @@
+<template>
+  <lay-scroll height="100%">
+    <div class="markdown-body light-scheme">
+      <div class="alone-header">
+        <img class="alone-logo" src="../assets/logo.png" />
+        <a class="version">{{ version }}</a>
+        <a
+          href="https://gitee.com/layui/layui-vue"
+          style="position: absolute; right: 10%; line-height: 75px"
+        >
+          <svg width="1.7em" height="1.7em" viewBox="0 0 24 24">
+            <path
+              fill="#fff"
+              d="M10.9,2.1c-4.6,0.5-8.3,4.2-8.8,8.7c-0.5,4.7,2.2,8.9,6.3,10.5C8.7,21.4,9,21.2,9,20.8v-1.6c0,0-0.4,0.1-0.9,0.1 c-1.4,0-2-1.2-2.1-1.9c-0.1-0.4-0.3-0.7-0.6-1C5.1,16.3,5,16.3,5,16.2C5,16,5.3,16,5.4,16c0.6,0,1.1,0.7,1.3,1c0.5,0.8,1.1,1,1.4,1 c0.4,0,0.7-0.1,0.9-0.2c0.1-0.7,0.4-1.4,1-1.8c-2.3-0.5-4-1.8-4-4c0-1.1,0.5-2.2,1.2-3C7.1,8.8,7,8.3,7,7.6C7,7.2,7,6.6,7.3,6 c0,0,1.4,0,2.8,1.3C10.6,7.1,11.3,7,12,7s1.4,0.1,2,0.3C15.3,6,16.8,6,16.8,6C17,6.6,17,7.2,17,7.6c0,0.8-0.1,1.2-0.2,1.4 c0.7,0.8,1.2,1.8,1.2,3c0,2.2-1.7,3.5-4,4c0.6,0.5,1,1.4,1,2.3v2.6c0,0.3,0.3,0.6,0.7,0.5c3.7-1.5,6.3-5.1,6.3-9.3 C22,6.1,16.9,1.4,10.9,2.1z"
+            ></path>
+          </svg>
+        </a>
+      </div>
+      <div class="alone-banner layui-bg-black">
+        <div class="layui-main">
+          <img src="../assets/logo.jpg" />
+          <h1>layer vue</h1>
+          <p>首 选 的 函 数 式 弹 出 层 解 决 方 案 ⭐</p>
+        </div>
+      </div>
+      <div class="layui-container" style="width: 80%; margin-left: 10%">
+        <lay-tab type="brief" v-model="active">
+          <lay-tab-item title="入门" id="/zh-CN/index"></lay-tab-item>
+          <lay-tab-item title="示例" id="/zh-CN/demo"></lay-tab-item>
+          <lay-tab-item title="帮助" id="/zh-CN/help"></lay-tab-item>
+          <lay-tab-item title="问题" id="/zh-CN/question"></lay-tab-item>
+        </lay-tab>
+        <router-view></router-view>
+      </div>
+      <div class="footer footer-index">
+        <p>Released under the <a href="/index.html">MIT License</a>.</p>
+        <p>Copyright © 2021-2022 layui-vue.com</p>
+      </div>
+    </div>
+  </lay-scroll>
+</template>
+
+<script setup>
+import config from "../../../layer/package.json";
+import { useRouter } from "vue-router";
+import { ref, watch } from "vue";
+import { useRoute } from "vue-router";
+
+const route = useRoute();
+const router = useRouter();
+const version = config.version;
+const active = ref(route.path);
+
+watch(active, (val) => {
+  router.push(val);
+});
+</script>
+
+<style>
+body {
+  margin: 0px;
+}
+
+.alone-header {
+  width: 100%;
+  height: 60px;
+  background: #393d49;
+  border-bottom: 1px solid #404553;
+  overflow: hidden;
+}
+
+.alone-header .alone-logo {
+  display: inline-block;
+  width: 82px;
+  height: 31px;
+  background: transparent;
+  margin-top: 16px;
+  margin-left: 10%;
+}
+
+.alone-banner {
+  height: 250px;
+  text-align: center;
+  font-weight: 300;
+  color: #fff;
+  background: #393d49;
+}
+
+.version {
+  position: absolute;
+  color: rgba(255, 255, 255, 0.8) !important;
+  line-height: 60px;
+  font-size: 15px;
+  right: 16%;
+}
+
+.alone-banner img {
+  width: 100px;
+}
+
+.alone-banner h1 {
+  margin: 0px !important;
+  padding: 0px !important;
+  padding-top: 10px !important;
+  line-height: 32px !important;
+  font-size: 30px !important;
+  font-weight: 300 !important;
+  color: white !important;
+  border-bottom: none !important;
+  letter-spacing: 3px;
+}
+
+.alone-banner p {
+  padding-top: 40px;
+  color: #e2e2e2;
+  font-size: 14px;
+  color: rgba(255, 255, 255, 0.8);
+}
+
+.alone-download {
+  width: 77.5%;
+  border-radius: 4px;
+  background: whitesmoke;
+  margin-left: 10%;
+  margin-top: 30px;
+  padding: 20px;
+}
+
+.layui-field-title {
+  margin: 10px 0 20px;
+  border-width: 1px 0 0;
+}
+
+.layui-container {
+  padding-bottom: 50px !important;
+}
+
+.layui-elem-field {
+  padding: 0;
+  margin-top: 10px;
+  margin-bottom: 10px;
+  border-top: 1px solid #eee;
+  border-style: solid;
+}
+
+.layui-tab-content {
+  padding: 0 !important;
+}
+
+.footer {
+  width: 100%;
+  padding: 30px 0px;
+  line-height: 30px;
+  text-align: center;
+  border-top: 1px solid #eee;
+  color: rgba(60, 60, 60, 0.7);
+  font-weight: 300;
+  font-size: 13.6px;
+  background: #f9f9f9;
+}
+</style>

.svn/pristine/5b/5bfadf6a79312aedec15d2a0a35d6cf8a21be195.svn-base

@@ -0,0 +1,164 @@
+<template>
+  <div class="layui-laydate">
+    <div class="layui-laydate-main laydate-main-list-0 laydate-time-show">
+      <div class="layui-laydate-header">
+        <div class="laydate-set-ym">
+          <span class="laydate-time-text">{{
+            t("datePicker.selectTime")
+          }}</span>
+        </div>
+      </div>
+      <div class="layui-laydate-content" style="height: 210px">
+        <ul class="layui-laydate-list laydate-time-list" ref="timePanelRef">
+          <li
+            class="num-list"
+            v-for="item in els"
+            :key="item.type"
+            :data-type="item.type"
+          >
+            <ol class="scroll" @click="chooseTime">
+              <li
+                v-for="(it, index) in item.count"
+                :id="item.type + index.toString()"
+                :data-value="index.toString().padStart(2, '0')"
+                :data-type="item.type"
+                :key="it"
+                :class="['num', index == hms[item.type] ? 'layui-this' : '']"
+              >
+                {{ index.toString().padStart(2, "0") }}
+              </li>
+            </ol>
+          </li>
+        </ul>
+      </div>
+    </div>
+    <PanelFoot @ok="footOnOk" @now="footOnNow" @clear="footOnClear">
+      <span
+        v-if="datePicker.type === 'datetime' && !datePicker.range"
+        @click="datePicker.showPanel.value = 'datetime'"
+        class="laydate-btns-time"
+        >{{ t("datePicker.selectDate") }}</span
+      >
+      <template v-else-if="!isNaN(hms.hh) && !isNaN(hms.mm) && !isNaN(hms.ss)">
+        {{
+          dayjs().hour(hms.hh).minute(hms.mm).second(hms.ss).format("HH:mm:ss")
+        }}
+      </template>
+    </PanelFoot>
+  </div>
+</template>
+<script lang="ts">
+export default {
+  name: "TimePanel",
+};
+</script>
+<script lang="ts" setup>
+import dayjs from "dayjs";
+import { useI18n } from "../../../language";
+import { inject, onMounted, ref, nextTick, watch } from "vue";
+import { provideType } from "../interface";
+import PanelFoot from "./PanelFoot.vue";
+export interface hmsType {
+  hh: number;
+  mm: number;
+  ss: number;
+  [key: string]: any;
+}
+export interface TimePanelProps {
+  modelValue: hmsType;
+}
+
+const props = withDefaults(defineProps<TimePanelProps>(), {});
+const emits = defineEmits(["update:modelValue", "ok"]);
+const datePicker: provideType = inject("datePicker") as provideType;
+const { t } = useI18n();
+
+const els = [
+  { count: 24, type: "hh" },
+  { count: 60, type: "mm" },
+  { count: 60, type: "ss" },
+];
+const hms = ref<hmsType>({
+  hh: props.modelValue.hh,
+  mm: props.modelValue.mm,
+  ss: props.modelValue.ss,
+});
+
+// 点击时间 - hms
+const chooseTime = (e: any) => {
+  if (e.target.nodeName == "LI") {
+    let { value, type } = e.target.dataset;
+    hms.value[type as keyof typeof hms.value] = parseInt(value);
+  }
+};
+
+const timePanelRef = ref();
+onMounted(() => {
+  scrollTo();
+});
+watch(
+  () => props.modelValue,
+  () => {
+    hms.value = {
+      hh: props.modelValue.hh,
+      mm: props.modelValue.mm,
+      ss: props.modelValue.ss,
+    };
+  },
+  { deep: true }
+);
+const scrollTo = () => {
+  nextTick(() => {
+    timePanelRef.value.childNodes.forEach((element: HTMLElement) => {
+      if (element.nodeName === "LI") {
+        let scrollTop = 0;
+        let parentDom = element.firstElementChild as HTMLElement;
+        let childList = parentDom.childNodes;
+        for (let index = 0; index < childList.length; index++) {
+          const child = childList[index] as HTMLElement;
+          if (child.nodeName !== "LI") {
+            continue;
+          }
+          if (child.classList && child.classList.contains("layui-this")) {
+            scrollTop =
+              child.offsetTop -
+              (parentDom.offsetHeight - child.offsetHeight) / 2;
+            parentDom.scrollTo(0, scrollTop);
+            break;
+          }
+        }
+      }
+    });
+  });
+};
+
+//确认关闭回调
+const footOnOk = () => {
+  emits("update:modelValue", hms.value);
+  if (datePicker.range) {
+    //关闭菜单
+    emits("ok");
+    return;
+  } else {
+    datePicker.ok();
+    if (datePicker.type === "datetime") {
+      datePicker.showPanel.value = "date";
+    }
+  }
+};
+//现在回调
+const footOnNow = () => {
+  hms.value.hh = dayjs().hour();
+  hms.value.mm = dayjs().minute();
+  hms.value.ss = dayjs().second();
+  scrollTo();
+};
+
+//清空回调
+const footOnClear = () => {
+  hms.value.hh = 0;
+  hms.value.mm = 0;
+  hms.value.ss = 0;
+  scrollTo();
+};
+</script>