@opentiny/vue-docs 2.2.4 → 2.2.6

package/demos/mobile/app/pull-refresh/disabled.vue

@@ -1,57 +0,0 @@
-<template>
-  <div>
-    <div class="page__hd">
-      <h1 class="page__title">Refresh</h1>
-      <p class="page__desc">下拉刷新</p>
-    </div>
-    <tiny-pull-refresh
-      v-model="isLoading"
-      @refresh="onRefresh"
-      success-text="刷新成功"
-      animation-duration="500"
-      success-duration="2000"
-      :disabled="false"
-    >
-      <h3>hello pull-refresh</h3>
-    </tiny-pull-refresh>
-  </div>
-</template>
-
-<script lang="jsx">
-import { PullRefresh } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyPullRefresh: PullRefresh
-  },
-  data() {
-    return {
-      isLoading: false
-    }
-  },
-  methods: {
-    onRefresh() {
-      setTimeout(() => {
-        this.isLoading = false
-      }, 1000)
-    }
-  }
-}
-</script>
-
-<style scoped>
-.page__hd {
-  padding: 40px;
-}
-.page__title {
-  font-weight: 400;
-  font-size: 21px;
-  text-align: left;
-}
-.page__desc {
-  margin-top: 5px;
-  color: #888;
-  font-size: 14px;
-  text-align: left;
-}
-</style>

package/demos/mobile/app/pull-refresh/head-height.vue

@@ -1,31 +0,0 @@
-<template>
-  <tiny-pull-refresh :pullDown="pullDownRefresh" head-height="100">
-    <h3>hello pull-refresh</h3>
-  </tiny-pull-refresh>
-</template>
-
-<script lang="jsx">
-import { PullRefresh } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyPullRefresh: PullRefresh
-  },
-  data() {
-    return {
-      pullDownRefresh: {
-        handler: () => this.handlerPullDownRefresh()
-      }
-    }
-  },
-  methods: {
-    handlerPullDownRefresh() {
-      return new Promise((resolve) => {
-        setTimeout(() => {
-          resolve()
-        }, 1000)
-      })
-    }
-  }
-}
-</script>

package/demos/mobile/app/pull-refresh/result-text.vue

@@ -1,46 +0,0 @@
-<template>
-  <tiny-pull-refresh
-    :pullUp="pullUpLoad"
-    :pullDown="pullDownRefresh"
-    success-text="运气真好！！！"
-    failed-text="哦哦，出错了!"
-  >
-    <h3>hello pull-refresh</h3>
-  </tiny-pull-refresh>
-</template>
-
-<script>
-import { PullRefresh } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyPullRefresh: PullRefresh
-  },
-  data() {
-    return {
-      pullUpLoad: {
-        handler: () => this.handlerPullUpLoad()
-      },
-      pullDownRefresh: {
-        handler: () => this.handlerPullDownRefresh()
-      }
-    }
-  },
-  methods: {
-    handlerPullUpLoad() {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          reject(new Error())
-        }, 1000)
-      })
-    },
-    handlerPullDownRefresh() {
-      return new Promise((resolve, reject) => {
-        setTimeout(() => {
-          resolve()
-        }, 1000)
-      })
-    }
-  }
-}
-</script>

package/demos/mobile/app/pull-refresh/success-duration.vue

@@ -1,31 +0,0 @@
-<template>
-  <tiny-pull-refresh ref="refresh" :pullDown="pullDownRefresh" success-duration="3000" success-text="加载完成">
-    <h3>hello pull-refresh</h3>
-  </tiny-pull-refresh>
-</template>
-
-<script lang="jsx">
-import { PullRefresh } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyPullRefresh: PullRefresh
-  },
-  data() {
-    return {
-      pullDownRefresh: {
-        handler: () => this.handlerPullDownRefresh()
-      }
-    }
-  },
-  methods: {
-    handlerPullDownRefresh() {
-      return new Promise((resolve) => {
-        setTimeout(() => {
-          resolve()
-        }, 1000)
-      })
-    }
-  }
-}
-</script>

package/demos/mobile/app/pull-refresh/success-text.vue

@@ -1,27 +0,0 @@
-<template>
-  <tiny-pull-refresh v-model="isLoading" @refresh="onRefresh" success-text="运气真好！！！">
-    <h3>hello pull-refresh</h3>
-  </tiny-pull-refresh>
-</template>
-
-<script lang="jsx">
-import { PullRefresh } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyPullRefresh: PullRefresh
-  },
-  data() {
-    return {
-      isLoading: false
-    }
-  },
-  methods: {
-    onRefresh() {
-      setTimeout(() => {
-        this.isLoading = false
-      }, 1000)
-    }
-  }
-}
-</script>

package/demos/pc/app/grid/loading/grid-loading-off-tip.spec.js

@@ -1,8 +0,0 @@
-import { test, expect } from '@playwright/test'
-
-test('关闭加载中状态', async ({ page }) => {
-  page.on('pageerror', (exception) => expect(exception).toBeNull())
-  await page.goto('grid-loading#loading-grid-loading-off-tip')
-  await page.getByRole('button', { name: '重试' }).click()
-  await expect(page.getByText('暂无数据')).toBeVisible()
-})

package/demos/pc/app/tag/before-delete.vue

@@ -1,64 +0,0 @@
-<template>
-  <div>
-    <p>
-      <tiny-switch v-model="beforeDeleteValue"></tiny-switch>
-      before-change 返回 {{ beforeDeleteValue }} 时 {{ beforeDeleteText }}
-      <br />
-    </p>
-    <tiny-tag
-      v-for="tag in tags"
-      :key="'tiny-tag1-' + tag.name"
-      closable
-      :type="tag.type"
-      @close="close(tag)"
-      :before-delete="beforeDelete"
-      >{{ tag.name }}</tiny-tag
-    >
-  </div>
-</template>
-
-<script>
-import { Tag, Switch } from '@opentiny/vue'
-
-export default {
-  components: {
-    TinyTag: Tag,
-    TinySwitch: Switch
-  },
-  data() {
-    return {
-      tags: [
-        { name: '标签一', type: '' },
-        { name: '标签二', type: 'success' },
-        { name: '标签三', type: 'info' },
-        { name: '标签四', type: 'warning' },
-        { name: '标签五', type: 'danger' }
-      ],
-      beforeDeleteValue: false
-    }
-  },
-  computed: {
-    beforeDeleteText() {
-      return this.beforeDeleteValue
-        ? '可执行 close 事件，点击删除图标可以删除标签'
-        : '将拦截 close 事件的执行，点击删除图标将无法删除标签'
-    }
-  },
-  methods: {
-    close(tag) {
-      this.tags.splice(this.tags.indexOf(tag), 1)
-    },
-    beforeDelete(done) {
-      setTimeout(() => {
-        this.beforeDeleteValue && done()
-      })
-    }
-  }
-}
-</script>
-
-<style scoped>
-.tiny-tag + .tiny-tag {
-  margin-left: 10px;
-}
-</style>

package/demos/pc/app/tag/closable-composition-api.vue

@@ -1,25 +0,0 @@
-<template>
-  <div class="tiny-tag-demo">
-    <tiny-tag v-for="tag in tags" :key="'tiny-tag1-' + tag.name" closable :type="tag.type" @close="handleClose(tag)">{{
-      tag.name
-    }}</tiny-tag>
-  </div>
-</template>
-
-<script setup lang="jsx">
-import { ref } from 'vue'
-import { Tag as TinyTag, Modal } from '@opentiny/vue'
-
-const tags = ref([
-  { name: '标签一', type: '' },
-  { name: '标签二', type: 'success' },
-  { name: '标签三', type: 'info' },
-  { name: '标签四', type: 'warning' },
-  { name: '标签五', type: 'danger' }
-])
-
-function handleClose(tag) {
-  tags.value.splice(tags.value.indexOf(tag), 1)
-  Modal.message('close 事件')
-}
-</script>

package/demos/pc/app/tag/closable.spec.ts

@@ -1,14 +0,0 @@
-import { expect, test } from '@playwright/test'
-
-test('是否正常移除标签', async ({ page }) => {
-  page.on('pageerror', (exception) => expect(exception).not.toBeNull())
-  await page.goto('tag#closable')
-
-  const first = page.locator('.tiny-tag').filter({ hasText: '标签一' })
-  const close = first.locator('.tiny-tag__close')
-  const modal = page.locator('.tiny-modal__box').nth(0)
-
-  await close.click()
-  await modal.waitFor({ state: 'attached', timeout: 100 })
-  await expect(first).not.toBeVisible()
-})