index.html

@@ -7,7 +7,7 @@
   <title>{{title}}</title>
   <meta name="keywords" content="{{keywords}}">
   <meta name="description" content="{{description}}">
-  <link rel="stylesheet" href="//jscdn.ink/@bd/ui/latest/css/reset-basic.css">
+  <link rel="stylesheet" href="//jscdn.ink/@bytedo/wcui/1.0.12/css/reset-basic.css">
   <script async src="//jscdn.ink/es-module-shims/1.6.3/es-module-shims.wasm.js"></script>
   <script type="importmap">{{importmap}}</script>
 </head>

package.json

@@ -2,10 +2,10 @@
   "name": "jscdn.ink",
   "type": "module",
   "scripts": {
-    "start": "fite dev",
-    "build": "fite build"
+    "start": "vue-live dev",
+    "build": "vue-live build"
   },
   "devDependencies": {
-    "fite": "^1.1.6"
+    "@bytedo/vue-live": "^0.1.4"
   }
 }

src/app.vue

@@ -1,5 +1,5 @@
 <template>
-  <Header :searchInput="$store.searchInput" />
+  <Header />
   <div class="main-body"><router-view /></div>
   <Footer />
 </template>
@@ -8,29 +8,13 @@
 import Header from './components/header.vue'
 import Footer from './components/footer.vue'
 
-import fetch from '@/lib/fetch.js'
-
 export default {
   components: { Header, Footer },
 
   mounted() {
     var user = localStorage.getItem('user')
-    var checked = sessionStorage.getItem('session_checked')
-
     if (user) {
-      if (checked) {
-        return (this.$store.user = JSON.parse(user))
-      }
-      fetch('/login/check')
-        .then(r => {
-          localStorage.setItem('token', r.data.token)
-          sessionStorage.setItem('session_checked', 1)
       this.$store.user = JSON.parse(user)
-        })
-        .catch(r => {
-          localStorage.removeItem('token')
-          localStorage.removeItem('user')
-        })
     }
   }
 }

src/components/header.vue

@@ -23,58 +23,13 @@
       <p>同时我们也提供自主提交开源库的收录(前提是在npm上发布的)</p>
     </cite>
 
-    <wc-input
-      class="search"
-      no-border
-      placeholder="请输入开源库的名字~~"
-      clearable
-      v-model="input"
-      @submit="search"
-    />
+    <wc-input class="search" no-border placeholder="请输入开源库的名字~~" />
   </div>
 </template>
 
 <script>
-import fetch from '@/lib/fetch'
-
 export default {
-  data() {
-    return { input: '' }
-  },
-
-  watch: {
-    '$store.searchInput'(v) {
-      this.input = v
-      this.search()
-    }
-  },
-
-  methods: {
-    search() {
-      let id = this.input.trim()
-      if (id) {
-        fetch('/package/search/' + encodeURIComponent(id)).then(r => {
-          let dict = { versions: [], id }
-          let last = null
-          for (let it of r.data) {
-            let tmp = it.split('/')
-            let v = tmp.shift()
-            let n = tmp.join('/')
-            if (last === v) {
-              dict[last].push(n)
-            } else {
-              last = v
-              dict.versions.push(last)
-              dict[last] = [n]
-            }
-          }
-          this.$store.result = dict
-        })
-      } else {
-        this.$store.result = null
-      }
-    }
-  }
+  props: {}
 }
 </script>
 

src/main.js

@@ -1,15 +1,10 @@
 import { createApp } from 'vue'
 
-import 'es.shim'
-import '//jscdn.ink/@bd/ui/latest/form/input.js'
-import '//jscdn.ink/@bd/ui/latest/form/button.js'
-import '//jscdn.ink/@bd/ui/latest/form/checkbox.js'
-import '//jscdn.ink/@bd/ui/latest/form/switch.js'
-import '//jscdn.ink/@bd/ui/latest/form/link.js'
-import '//jscdn.ink/@bd/ui/latest/layer/index.js'
-// import 'http://127.0.0.1:8090/dist/layer/index.js'
-import '//jscdn.ink/@bd/ui/latest/pager/index.js'
-import '//jscdn.ink/@bytedo/wcui/1.0.12/form/dropdown.js'
+import '//jscdn.ink/es.shim/2.1.0/index.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/form/input.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/form/button.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/form/link.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/layer/index.js'
 
 import App from './app.vue'
 

src/store.js

@@ -7,8 +7,7 @@ const store = reactive({
     1: '🕒待审核中',
     2: '✅正常',
     9: '🙅🏻拒绝收录'
-  },
-  result: null // 搜索结果
+  }
 })
 
 export default function (app) {

src/views/home.vue

@@ -1,32 +1,10 @@
 <template>
-  <main class="home" @click="copy">
-    <dl class="card noselect" v-if="version">
-      <dt class="title">
-        {{ $store.result.id }} -
-        <wc-dropdown v-model="version">
-          <wc-option
-            v-for="v in $store.result.versions"
-            :key="v"
-            :value="v"
-            :label="v"
-          />
-        </wc-dropdown>
-      </dt>
-      <dd class="list">
-        <section class="link" v-for="f in $store.result[version]">
-          //jscdn.ink/<b>{{ $store.result.id }}</b
-          >/<i>{{ version }}</i
-          >/<q>{{ f }}</q>
-        </section>
-      </dd>
-    </dl>
-    <dl class="card noselect" v-else v-for="it in libs" :key="it.name">
+  <main class="home">
+    <dl class="card" v-for="it in libs">
       <dt class="title">{{ it.name }} - v{{ it.version }}</dt>
       <dd class="list">
-        <section class="link" v-for="f in it.files">
-          //jscdn.ink/<b>{{ it.name }}</b
-          >/<i>{{ it.version }}</i
-          >/<q>{{ f }}</q>
+        <section class="link">
+          //jscdn.ink/{{ it.name }}/{{ it.version }}/{{ it.file }}
         </section>
       </dd>
     </dl>
@@ -38,62 +16,19 @@ export default {
   data() {
     return {
       libs: [
+        { name: 'vue', version: '2.3.2', file: 'vue.esm-browser.js' },
         {
-          name: 'vue',
-          version: '3.2.47',
-          files: [
-            'vue.cjs.js',
-            'vue.cjs.prod.js',
-            'vue.esm-browser.js',
-            'vue.esm-browser.prod.js',
-            'vue.esm-bundler.js',
-            'vue.global.js',
-            'vue.global.prod.js',
-            'vue.runtime.esm-browser.js',
-            'vue.runtime.esm-browser.prod.js',
-            'vue.runtime.esm-bundler.js',
-            'vue.runtime.global.js',
-            'vue.runtime.global.prod.js'
+          name: 'vue-router',
+          version: '4.1.2',
+          file: 'vue-router.esm-browser.js'
+        },
+        { name: '@bytedo/fetch', version: '2.1.2', file: 'index.js' }
       ]
-        },
-        {
-          name: '@bytedo/fetch',
-          version: '2.1.1',
-          files: ['index.js', 'next.js']
-        }
-      ],
-      version: ''
-    }
-  },
-
-  watch: {
-    '$store.result'(val) {
-      if (val) {
-        this.version = val.versions[val.versions.length - 1]
-      } else {
-        this.version = ''
-      }
     }
   },
 
   mounted() {
     this.$store.searchShow = true
-    if (this.$route.query.name) {
-      this.$store.searchInput = this.$route.query.name
-    }
-  },
-
-  methods: {
-    copy(ev) {
-      let elem = ev.target
-      if (elem.tagName === 'SECTION' || elem.parentNode.tagName === 'SECTION') {
-        if (elem.parentNode.tagName === 'SECTION') {
-          elem = elem.parentNode
-        }
-        navigator.clipboard.writeText(elem.textContent.trim())
-        layer.toast('复制成功', 'success')
-      }
-    }
   }
 }
 </script>
@@ -103,7 +38,7 @@ export default {
   display: flex;
   flex-direction: column;
   align-items: center;
-  padding: 16px 0 32px;
+  padding-top: 16px;
 
   .card {
     width: 1024px;
@@ -122,25 +57,9 @@ export default {
     }
 
     .link {
-      padding: 0 6px;
-      border-radius: 4px;
       transition: background 0.1s ease;
-
-      b,
-      i,
-      q {
-        padding: 0 2px;
-      }
-      b {
-        color: var(--color-teal-1);
-      }
-      i {
-        color: var(--color-blue-1);
-      }
-      q {
-      }
       &:hover {
-        background: var(--color-plain-1);
+        text-decoration: underline;
       }
       &:active {
         background: var(--color-plain-a);

src/views/request.vue

@@ -6,20 +6,16 @@
         placeholder="请输入开源库的名字"
         @submit="search"
       />
-
-      <wc-switch v-model="onlyShowWaited" @change="search"
+      <wc-switch v-model="onlyShowWaited" @input="search"
         >只显示待审核</wc-switch
       >
       <wc-link type="info" @click="openDialog">
         没找到你想的库?点击申请收录
       </wc-link>
     </div>
-
     <wc-table class="list" :thead="thead">
       <wc-tr v-for="it of list" :key="it.id">
-        <wc-td align="center">
-          <router-link :to="'/?name=' + it.id">{{ it.id }}</router-link>
-        </wc-td>
+        <wc-td align="center">{{ it.id }}</wc-td>
         <wc-td align="center">{{ it.author }}</wc-td>
         <wc-td align="center">{{ it.latest || '-' }}</wc-td>
         <wc-td align="center">{{ it.latest ? it.sync_date : '-' }}</wc-td>
@@ -27,8 +23,7 @@
         <wc-td>{{ it.remark || '-' }}</wc-td>
         <wc-td align="center">
           <wc-link
-            v-if="it.stat === 2"
-            :disabled="loading"
+            :disabled="loading || it.stat !== 2"
             @click="handlePackgae('sync', it.id)"
             type="info"
             >更新</wc-link
@@ -40,13 +35,13 @@
             >通过</wc-link
           >
           <wc-link
-            v-if="$store.user.admin && it.stat !== 0"
+            v-if="$store.user.admin"
             @click="handlePackgae('reject', it.id)"
             type="warning"
             >拒绝</wc-link
           >
           <wc-link
-            v-if="$store.user.admin && it.stat !== 0"
+            v-if="$store.user.admin"
             @click="handlePackgae('delete', it.id)"
             type="danger"
             >删除</wc-link
@@ -57,9 +52,8 @@
 
     <wc-pager
       class="pager"
-      layout="prev,pages,next,info"
+      layout="prev,pages,next"
       red
-      @page-changed="pageChanged"
       :total="total"
       :page="page"
     />
@@ -101,6 +95,8 @@
 
 <script>
 import '//jscdn.ink/@bytedo/wcui/1.0.12/table/index.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/form/switch.js'
+import '//jscdn.ink/@bytedo/wcui/1.0.12/pager/index.js'
 import fetch from '@/lib/fetch.js'
 
 export default {
@@ -142,25 +138,13 @@ export default {
         this.$list = r.data.map(
           it => ((it.sync_date = new Date(it.sync_date).format('Y/m/d')), it)
         )
-        this.fetchPage()
-        this.total = this.$list.length
+        this.list = this.$list.filter(it =>
+          this.onlyShowWaited ? it.stat === 1 : true
+        )
+        this.total = this.list.length
       })
     },
 
-    fetchPage() {
-      let start = (this.page - 1) * 20
-      let end = start + 20
-      this.list = this.$list
-        .filter(it => (this.onlyShowWaited ? it.stat === 1 : true))
-        .slice(start, end)
-    },
-
-    pageChanged(ev) {
-      this.page = ev.data
-      console.log('<><><>', this.page)
-      this.fetchPage()
-    },
-
     search() {
       let filter = this.filter.trim()
       let onlyShowWaited = this.onlyShowWaited
@@ -345,7 +329,6 @@ export default {
 
 .request-form {
   width: 640px;
-  background: #fff;
 
   .title {
     display: flex;

vue.live.js

@@ -25,13 +25,11 @@ export default {
   // 有用到其他的库, 可以手动添加,
   // 也可以在页面中直接引入完整的路径, 而不必须在这里声明
   imports: {
-    'es.shim': '//jscdn.ink/es.shim/2.1.0/index.js',
-    vue: '//jscdn.ink/vue/latest/vue.esm-browser.prod.js',
-    'vue-router': '//jscdn.ink/@bytedo/vue-router/4.1.6/vue-router.js',
+    vue: '//jscdn.ink/vue/3.2.47/vue.esm-browser.prod.js',
+    'vue-router': '//jscdn.ink/vue-router/4.1.6/vue-router.esm-browser.js',
     // 这个库被vue-router依赖, 可以注释掉vue-router代码中的 @vue/devtools-api 的引入
     // 以达到减少不必须的体积的效果
-    fetch: '//jscdn.ink/@bytedo/fetch/latest/next.js',
-    '@bd/core': '//jscdn.ink/wkit/latest/index.js',
-    wkit: '//jscdn.ink/wkit/latest/index.js'
+    '@vue/devtools-api': '//jscdn.ink/@vue/devtools-api/6.5.0/esm/index.js',
+    fetch: '//jscdn.ink/@bytedo/fetch/2.1.1/next.js'
   }
 }