github
/
halo-admin
mirror of https://github.com/halo-dev/halo-admin
1
0
Fork 0
Code Issues Releases Wiki Activity
Browse Source

perf: improve plugin detail page ui 

Signed-off-by: Ryan Wang <i@ryanc.cc>
pull/581/head
Ryan Wang 3 years ago
parent
839024435d
commit
72aad52064
3 changed files with 187 additions and 1 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 129
      src/views/system/plugins/PluginDetail.vue
  2. 12
      src/views/system/plugins/plugins-mock.ts
  3. 47
      src/views/system/roles/RoleDetail.vue

129
src/views/system/plugins/PluginDetail.vue
Unescape View File

@ -6,6 +6,7 @@ import { useRoute } from "vue-router";
import { plugins } from "./plugins-mock";
import { VTag } from "@/components/base/tag";
import { VInput } from "@/components/base/input";
import { VSpace } from "@/components/base/space";
import { VCard } from "@/components/base/card";
import { ref } from "vue";
@ -116,8 +117,134 @@ console.log(plugin);
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt class="text-sm font-medium text-gray-900">模型定义</dt>
<dd class="mt-1 sm:col-span-2 sm:mt-0">
<ul v-if="plugin.extensions" class="space-y-2">
<li
v-for="(extension, index) in plugin.extensions"
:key="index"
>
<div
class="inline-flex w-96 cursor-pointer flex-row flex-col gap-y-3 rounded border p-5 hover:border-themeable-primary"
>
<span class="font-medium text-gray-900">
{{ extension.name }}
</span>
<div class="text-xs text-gray-400">
<VSpace>
<VTag
v-for="(field, fieldIndex) in extension.fields"
:key="fieldIndex"
>
{{ field }}
</VTag>
</VSpace>
</div>
</div>
</li>
</ul>
<span v-else>无</span>
</dd>
</div>
<div
class="bg-gray-50 px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt class="text-sm font-medium text-gray-900">权限定义</dt>
<dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
无
<dl class="divide-y divide-gray-100">
<div
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt class="text-sm font-medium text-gray-900">
Discussions Management
</dt>
<dd
class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0"
>
<ul class="space-y-2">
<li>
<div
class="inline-flex w-72 cursor-pointer flex-row items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Discussions Management
</span>
<span class="text-xs text-gray-400">
依赖于 Discussions View
</span>
</div>
</div>
</li>
<li>
<div
class="inline-flex w-72 cursor-pointer items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Discussions View
</span>
</div>
</div>
</li>
</ul>
</dd>
</div>
<div
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt class="text-sm font-medium text-gray-900">
Posts Management
</dt>
<dd
class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0"
>
<ul class="space-y-2">
<li>
<div
class="inline-flex w-72 cursor-pointer flex-row items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Posts Management
</span>
<span class="text-xs text-gray-400">
依赖于 Posts View
</span>
</div>
</div>
</li>
<li>
<div
class="inline-flex w-72 cursor-pointer items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Posts View
</span>
</div>
</div>
</li>
</ul>
</dd>
</div>
</dl>
</dd>
</div>
</dl>

12
src/views/system/plugins/plugins-mock.ts
Unescape View File

@ -170,6 +170,18 @@ export const plugins = [
description: "提供一个社区/论坛应有的所有模块",
license: "GPL V3",
},
extensions: [
{
name: "posts",
displayName: "帖子",
fields: ["id", "title", "content", "author", "createdAt"],
},
{
name: "discussions",
displayName: "评论",
fields: ["id", "content", "author", "createdAt"],
},
],
},
{
apiVersion: "v1",

47
src/views/system/roles/RoleDetail.vue
Unescape View File

@ -341,6 +341,53 @@ const handleRouteToUser = (username: string) => {
</ul>
</dd>
</div>
<div
class="bg-white px-4 py-5 hover:bg-gray-50 sm:grid sm:grid-cols-3 sm:gap-4 sm:px-6"
>
<dt
class="flex flex-col gap-y-3 text-sm font-medium text-gray-900"
>
<span> Discussions Management </span>
<span class="text-xs text-gray-400"> 由社区插件提供 </span>
</dt>
<dd class="mt-1 text-sm text-gray-900 sm:col-span-2 sm:mt-0">
<ul class="space-y-2">
<li>
<div
class="inline-flex w-72 cursor-pointer flex-row items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Discussions Management
</span>
<span class="text-xs text-gray-400">
依赖于 Discussions View
</span>
</div>
</div>
</li>
<li>
<div
class="inline-flex w-72 cursor-pointer items-center gap-4 rounded border p-5 hover:border-themeable-primary"
>
<input
class="h-4 w-4 rounded border-gray-300 text-indigo-600"
type="checkbox"
/>
<div class="inline-flex flex-col gap-y-3">
<span class="font-medium text-gray-900">
Discussions View
</span>
</div>
</div>
</li>
</ul>
</dd>
</div>
</dl>
<div class="p-4">
<VButton type="secondary">保存</VButton>

Write Preview
Loading…
Cancel
Save