init

.svn/pristine/f0/f025809db047df08db1038a607c03a9d0f47e7a6.svn-base

@@ -0,0 +1,29 @@
+<script lang="ts">
+export default {
+  name: "CloseBtn",
+};
+</script>
+
+<script lang="ts" setup>
+import { computed, defineEmits } from "vue";
+
+export interface CloseBtnProps {
+  closeBtn?: number | string | boolean;
+}
+
+const props = defineProps<CloseBtnProps>();
+
+const emit = defineEmits(["closeHandle"]);
+
+const closeHandle = () => {
+  emit("closeHandle");
+};
+</script>
+
+<template>
+  <a
+    :class="['layui-layer-ico layui-layer-close layui-layer-close' + closeBtn]"
+    href="javascript:;"
+    @click="closeHandle"
+  ></a>
+</template>

.svn/pristine/f0/f03281c5d3fb2e5aba7ead474d5d5d294eb2e881.svn-base

@@ -0,0 +1,2 @@
+x
E<>=<0E>0<0C>af<61><66><EFBFBD>L<EFBFBD>L<><4C><10><>[<0C><><EFBFBD>Q<EFBFBD>J<EFBFBD><4A><EFBFBD>c<EFBFBD><03>7<EFBFBD><37>7<EFBFBD>2<EFBFBD><32>t<EFBFBD>E<EFBFBD>Z<EFBFBD><5A>B<EFBFBD><42>Ӑ<><D390>ui<75>7<EFBFBD><37>*<2A>@,4<><05><><EFBFBD><EFBFBD><1C><><EFBFBD>B<l2
D<><44>
+'O<>V*8	<09><>A<EFBFBD><41><EFBFBD>Η[<5B>6<EFBFBD>z<><7A><EFBFBD><EFBFBD>~<7E><>.<2E>

.svn/pristine/f0/f0605f06416752aa1b15004ba78553d872771744.svn-base

@@ -0,0 +1,276 @@
+::: anchor
+:::
+
+::: title 基础使用
+:::
+
+::: describe 常用于行数据的交互筛选，在浩瀚的业务需求中，值得一用。
+:::
+
+::: title 基础使用
+:::
+
+::: demo 使用 `lay-transfer` 标签, 创建穿梭框
+
+<template>
+  <lay-transfer v-model="value1" :dataSource="dataSource1"></lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value1 = ref(['1']);
+    const dataSource1 = ref([{id:'1', title:'易大师', disabled: true},{id:'2', title:'战争之王'}])
+
+    return {
+      value1,
+      dataSource1
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 指定标题
+:::
+
+::: demo
+
+<template>
+  <lay-transfer v-model="value2" :dataSource="dataSource2" :title="title"></lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value2 = ref([]);
+    const dataSource2 = [{id:'1', title:'易大师'},{id:'2', title:'战争之王'}]
+    const title = ['我喜欢的','我不喜欢的']
+
+    return {
+      value2,
+      dataSource2,
+      title
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 使用插槽
+:::
+
+::: demo
+
+<template>
+  <lay-transfer v-model="value3" :dataSource="dataSource3">
+    <template v-slot:item="{ data }">
+      {{data.id}}
+    </template>
+  </lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value3 = ref([]);
+    const dataSource3 = [{id:'1', title:'易大师'},{id:'2', title:'战争之王'}]
+
+    return {
+      value3,
+      dataSource3
+    }
+  }
+}
+</script>
+
+:::
+
+
+::: title 开启搜索
+:::
+
+::: demo
+
+<template>
+  <lay-transfer v-model="value5" :dataSource="dataSource5" :showSearch="true"></lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value5 = ref([]);
+    const dataSource5 = [
+      {id:'1', title:'无影剑'},
+      {id:'2', title:'逸龙剑'},
+      {id:'3', title:'精灵之语'},
+      {id:'4', title:'十字斩刀-斗'},
+      {id:'5', title:'落炎魔杖'},
+      {id:'6', title:'石中剑'},
+      {id:'7', title:'屠戮之刃'}
+    ]
+    
+    return {
+      value5,
+      dataSource5
+    }
+  }
+}
+</script>
+
+::: 
+
+::: title 海量数据
+:::
+
+::: demo
+
+<template>
+  <lay-transfer v-model="value4" :dataSource="dataSource4"></lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value4 = ref([]);
+
+    const dataSource4 = [
+      {id:'1', title:'无影剑'},
+      {id:'2', title:'逸龙剑'},
+      {id:'3', title:'精灵之语'},
+      {id:'4', title:'十字斩刀-斗'},
+      {id:'5', title:'落炎魔杖'},
+      {id:'6', title:'石中剑'},
+      {id:'7', title:'屠戮之刃'},
+      {id:'8', title:'无影剑'},
+      {id:'9', title:'逸龙剑'},
+      {id:'10', title:'精灵之语'},
+      {id:'11', title:'十字斩刀-斗'},
+      {id:'12', title:'落炎魔杖'},
+      {id:'13', title:'石中剑'},
+      {id:'14', title:'屠戮之刃'},
+      {id:'15', title:'落炎魔杖'},
+      {id:'16', title:'石中剑'},
+      {id:'17', title:'屠戮之刃'},
+      {id:'18', title:'无影剑'},
+      {id:'19', title:'逸龙剑'},
+      {id:'20', title:'精灵之语'},
+      {id:'21', title:'十字斩刀-斗'},
+      {id:'22', title:'落炎魔杖'},
+      {id:'23', title:'石中剑'},
+      {id:'24', title:'屠戮之刃'}
+    ]
+    
+    return {
+      value4,
+      dataSource4
+    }
+  }
+}
+</script>
+
+:::
+
+::: title 底部插槽
+:::
+
+::: demo
+
+<template>
+  <lay-transfer v-model="value5" :dataSource="dataSource5">
+    <template v-slot:leftFooter>左侧底部</template>
+    <template v-slot:rightFooter>右侧底部</template>
+  </lay-transfer>
+</template>
+
+<script>
+import { ref } from 'vue'
+
+export default {
+  setup() {
+
+    const value5 = ref([])
+
+    const dataSource5 = [
+      {id:'1', title:'无影剑'},
+      {id:'2', title:'逸龙剑'},
+      {id:'3', title:'精灵之语'},
+      {id:'4', title:'十字斩刀-斗'},
+      {id:'5', title:'落炎魔杖'},
+      {id:'6', title:'石中剑'},
+      {id:'7', title:'屠戮之刃'}
+    ]
+    
+    return {
+      value5,
+      dataSource5
+    }
+  }
+}
+</script>
+
+::: 
+
+::: title Transfer 属性
+:::
+
+::: table
+
+| Name       | Description | Accepted Values |
+| ---------- | ----------- | --------------- |
+| modalValue (v-model) | 目标值    | --              |
+| dataSource | 数据来源    | --              |
+| title      | 标题        | --              |
+| id         | 主键        | --              |
+| showSearch | 开启搜索        | --              |
+| width      | 左右盒子宽度        | `200px`              |
+| height     | 左右盒子高度        |  `360px`              |
+
+:::
+
+::: title Transfer 插槽
+:::
+
+::: table
+
+| Name | Description | Accepted Values |
+| ---- | ----------- | --------------- |
+| item | 列表项      | { data }        |
+| leftFooter | 左侧盒子底部内容      | --      |
+| rightFooter | 右侧盒子底部内容      | --        |
+
+:::
+
+::: title Transfer 事件
+:::
+
+::: table
+
+| Name | Description | Accepted Values |
+| ---- | ----------- | --------------- |
+| change | 数据穿梭回调      | targetKeys        |
+
+:::
+
+::: contributor transfer
+:::
+
+::: previousNext transfer
+:::

.svn/pristine/f0/f098bdb1f6777d7f34d2765dd2ba0a799ffe9835.svn-base

@@ -0,0 +1,16 @@
+<script lang="ts">
+export default {
+  name: "PlayIcon",
+};
+</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-play" />
+</template>