完善帮助文档

This commit is contained in:
fofolee
2022-05-02 02:28:18 +08:00
parent 916105aa3d
commit b41b262c8b
16 changed files with 436 additions and 3838 deletions

View File

@@ -340,10 +340,7 @@ export default {
},
// 打开文档
showHelp() {
utools.createBrowserWindow("./helps/quickcommand.html", {
width: 1280,
height: 920,
});
window.showUb.docs();
},
// 展开收起侧栏
toggleSideBarWidth() {

View File

@@ -1,349 +1,357 @@
<template>
<q-menu
max-height="480px"
max-width="300px"
transition-show="jump-up"
transition-hide="jump-down"
>
<!-- 用户信息 -->
<UserInfo
ref="user"
:allQuickCommandsLength="allQuickCommandsLength"
:allFeaturesLength="allFeaturesLength"
/>
<!-- 菜单 -->
<q-list>
<!-- 实用功能 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>实用功能</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item>
<q-item-section side>
<q-icon name="folder_special" />
</q-item-section>
<q-input
dense
prefix="快速收藏文件至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
autofocus
v-model="$root.profile.quickFeatures.favFile.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('favFile')"
v-model="$root.profile.quickFeatures.favFile.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后选中文件可以通过超级面板快速将文件收藏到{{
$root.profile.quickFeatures.favFile.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="bookmarks" />
</q-item-section>
<q-input
dense
prefix="快速收藏网址至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
v-model="$root.profile.quickFeatures.favUrl.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('favUrl')"
v-model="$root.profile.quickFeatures.favUrl.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在浏览器界面可以通过超级面板快速将网址收藏到{{
$root.profile.quickFeatures.favUrl.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="drive_file_rename_outline" />
</q-item-section>
<q-input
dense
prefix="新建插件别名至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
autofocus
v-model="$root.profile.quickFeatures.pluNickName.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('pluNickName')"
v-model="$root.profile.quickFeatures.pluNickName.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在主输入框输入插件别名可以快速设置插件别名<br />
并将所有设置的别名保存至{{
$root.profile.quickFeatures.pluNickName.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="api" />
</q-item-section>
<q-input
dense
prefix="开启快捷命令服务"
suffix="端口"
outlined
v-model="$root.profile.quickFeatures.apiServer.port"
input-class="text-center"
style="width: 280px"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('apiServer')"
v-model="$root.profile.quickFeatures.apiServer.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在主输入框输入快捷命令服务可以进入配置一个后台服务<br />
通过本地监听{{
$root.profile.quickFeatures.apiServer.port
}}端口的形式接收用户传送过来的参数然后根据参数执行不同的操作
<br />
本功能的意义在于 utools
的接口暴露出来可以通过命令行等外部途径 <br />
直接启用 ubrowser 或者直接redirect 到相应的插件<br />
需要配置插件跟随 utools 启动和保留后台
</q-tooltip>
</q-input>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 导入 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>导入导出</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable v-close-popup @click="importCommand">
<q-item-section side>
<q-icon name="text_snippet" />
</q-item-section>
<q-item-section>从文件导入</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="importCommand(false)">
<q-item-section side>
<q-icon name="content_paste" />
</q-item-section>
<q-item-section>从剪贴板导入</q-item-section>
</q-item>
<!-- 导出 -->
<q-item clickable v-close-popup @click="exportAllCommands">
<q-item-section side>
<q-icon name="file_upload" />
</q-item-section>
<q-item-section>导出所有命令</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 批处理 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>批处理</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable v-close-popup @click="enableAllCommands">
<q-item-section side>
<q-icon name="checklist_rtl" />
</q-item-section>
<q-item-section>启用本页所有命令</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="disableAllCommands">
<q-item-section side>
<q-icon name="remove_done" />
</q-item-section>
<q-item-section>禁用本页所有命令</q-item-section>
</q-item>
<!-- 清空 -->
<q-item
style="color: red"
clickable
v-close-popup
@click="clearAllCommands"
>
<q-item-section side>
<q-icon name="delete" />
</q-item-section>
<q-item-section>删除所有命令</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 选项 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>个性化设置</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="color_lens" />
</q-item-section>
<q-item-section>主颜色</q-item-section>
<q-tooltip>你可以更改界面的主题色会员限定</q-tooltip>
<q-menu
v-if="$refs.user.isVIP"
nchor="top left"
self="bottom end"
>
<q-card>
<q-color
@change="setPrimaryColor"
v-model="$root.profile.primaryColor"
/>
<q-btn
color="primary"
label="重置为默认"
class="full-width"
@click="resetPrimary"
/>
</q-card>
</q-menu>
</q-item>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="image" />
</q-item-section>
<q-item-section>面板视图背景图片</q-item-section>
<q-tooltip
>为面板视图设置一张背景图片会员限定<br />请不要选择尺寸太大的图片将影响插件载入速度</q-tooltip
>
<q-menu
v-if="$refs.user.isVIP"
nchor="top left"
self="bottom end"
>
<q-card>
<q-file
dense
standout="bg-primary text-white"
v-model="selectFile"
autofocus
@update:model-value="changeBackground()"
accept="image/*"
label="请选择一张图片"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<q-btn
color="negative"
label="取消背景"
class="full-width"
@click="changeBackground(1)"
/>
</q-card>
</q-menu>
</q-item>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="label" />
</q-item-section>
<q-item-section class="flex">紧凑标签栏 </q-item-section>
<q-tooltip>更为紧凑的标签栏适用于标签非常多的情形</q-tooltip>
<q-item-section side
><q-toggle
v-model="$root.profile.denseTagBar"
:disable="!$refs.user.isVIP"
color="primary"
/></q-item-section>
</q-item>
<q-item clickable>
<q-item-section side>
<q-icon name="search" />
</q-item-section>
<q-item-section class="flex">自动聚焦搜索 </q-item-section>
<q-tooltip>进入插件时自动聚焦搜索</q-tooltip>
<q-item-section side
><q-toggle
v-model="$root.profile.autofocusSearch"
color="primary"
/></q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<q-item clickable to="/share">
<q-item-section side>
<q-icon name="groups" />
</q-item-section>
<q-item-section>分享中心</q-item-section>
</q-item>
<!-- 收藏 -->
<q-item v-if="isTagStared" clickable @click="unMarkTag">
<q-item-section side>
<q-icon name="star_border" />
</q-item-section>
<q-item-section>取消收藏</q-item-section>
</q-item>
<q-item v-else clickable @click="showPanelConf = true">
<q-item-section side>
<q-icon name="star" />
</q-item-section>
<q-item-section>收藏标签</q-item-section>
<q-tooltip
>收藏后会将当前标签名作为全局关键字可在 uTools 的主输入框进行搜索
<br />
搜索进入后默认进入当前标签的面板视图 <br />
类似于旧版本的快捷面板</q-tooltip
>
</q-item>
<!-- 关于 -->
<q-item clickable @click="showAbout = true">
<q-item-section side>
<q-icon name="info" />
</q-item-section>
<q-item-section>关于</q-item-section></q-item
<div class="flex">
<q-btn stretch color="primary" flat size="xs"
><q-spinner-bars color="primary" size="1.5em" />
<q-menu
max-height="480px"
max-width="300px"
transition-show="jump-up"
transition-hide="jump-down"
>
</q-list>
<!-- 用户信息 -->
<UserInfo
ref="user"
:allQuickCommandsLength="allQuickCommandsLength"
:allFeaturesLength="allFeaturesLength"
/>
<!-- 菜单 -->
<q-list>
<!-- 实用功能 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>实用功能</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item>
<q-item-section side>
<q-icon name="folder_special" />
</q-item-section>
<q-input
dense
prefix="快速收藏文件至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
autofocus
v-model="$root.profile.quickFeatures.favFile.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('favFile')"
v-model="$root.profile.quickFeatures.favFile.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后选中文件可以通过超级面板快速将文件收藏到{{
$root.profile.quickFeatures.favFile.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="bookmarks" />
</q-item-section>
<q-input
dense
prefix="快速收藏网址至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
v-model="$root.profile.quickFeatures.favUrl.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('favUrl')"
v-model="$root.profile.quickFeatures.favUrl.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在浏览器界面可以通过超级面板快速将网址收藏到{{
$root.profile.quickFeatures.favUrl.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="drive_file_rename_outline" />
</q-item-section>
<q-input
dense
prefix="新建插件别名至"
suffix="标签"
outlined
input-class="text-center"
style="width: 280px"
autofocus
v-model="$root.profile.quickFeatures.pluNickName.tag"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('pluNickName')"
v-model="$root.profile.quickFeatures.pluNickName.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在主输入框输入插件别名可以快速设置插件别名<br />
并将所有设置的别名保存至{{
$root.profile.quickFeatures.pluNickName.tag
}}标签
</q-tooltip>
</q-input>
</q-item>
<q-item>
<q-item-section side>
<q-icon name="api" />
</q-item-section>
<q-input
dense
prefix="开启快捷命令服务"
suffix="端口"
outlined
v-model="$root.profile.quickFeatures.apiServer.port"
input-class="text-center"
style="width: 280px"
type="text"
>
<template v-slot:append>
<q-toggle
@click="toggleFeature('apiServer')"
v-model="$root.profile.quickFeatures.apiServer.enable"
checked-icon="check"
color="primary"
/>
</template>
<q-tooltip
>启用后在主输入框输入快捷命令服务可以进入配置一个后台服务<br />
通过本地监听{{
$root.profile.quickFeatures.apiServer.port
}}端口的形式接收用户传送过来的参数然后根据参数执行不同的操作
<br />
本功能的意义在于 utools
的接口暴露出来可以通过命令行等外部途径 <br />
直接启用 ubrowser 或者直接redirect 到相应的插件<br />
需要配置插件跟随 utools 启动和保留后台
</q-tooltip>
</q-input>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 导入 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>导入导出</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable v-close-popup @click="importCommand">
<q-item-section side>
<q-icon name="text_snippet" />
</q-item-section>
<q-item-section>从文件导入</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="importCommand(false)">
<q-item-section side>
<q-icon name="content_paste" />
</q-item-section>
<q-item-section>从剪贴板导入</q-item-section>
</q-item>
<!-- 导出 -->
<q-item clickable v-close-popup @click="exportAllCommands">
<q-item-section side>
<q-icon name="file_upload" />
</q-item-section>
<q-item-section>导出所有命令</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 批处理 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>批处理</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable v-close-popup @click="enableAllCommands">
<q-item-section side>
<q-icon name="checklist_rtl" />
</q-item-section>
<q-item-section>启用本页所有命令</q-item-section>
</q-item>
<q-item clickable v-close-popup @click="disableAllCommands">
<q-item-section side>
<q-icon name="remove_done" />
</q-item-section>
<q-item-section>禁用本页所有命令</q-item-section>
</q-item>
<!-- 清空 -->
<q-item
style="color: red"
clickable
v-close-popup
@click="clearAllCommands"
>
<q-item-section side>
<q-icon name="delete" />
</q-item-section>
<q-item-section>删除所有命令</q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<!-- 选项 -->
<q-item clickable>
<q-item-section side>
<q-icon name="keyboard_arrow_left" />
</q-item-section>
<q-item-section>个性化设置</q-item-section>
<q-menu anchor="top end" self="top start">
<q-list>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="color_lens" />
</q-item-section>
<q-item-section>主颜色</q-item-section>
<q-tooltip>你可以更改界面的主题色会员限定</q-tooltip>
<q-menu
v-if="$refs.user.isVIP"
nchor="top left"
self="bottom end"
>
<q-card>
<q-color
@change="setPrimaryColor"
v-model="$root.profile.primaryColor"
/>
<q-btn
color="primary"
label="重置为默认"
class="full-width"
@click="resetPrimary"
/>
</q-card>
</q-menu>
</q-item>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="image" />
</q-item-section>
<q-item-section>面板视图背景图片</q-item-section>
<q-tooltip
>为面板视图设置一张背景图片会员限定<br />请不要选择尺寸太大的图片将影响插件载入速度</q-tooltip
>
<q-menu
v-if="$refs.user.isVIP"
nchor="top left"
self="bottom end"
>
<q-card>
<q-file
dense
standout="bg-primary text-white"
v-model="selectFile"
autofocus
@update:model-value="changeBackground()"
accept="image/*"
label="请选择一张图片"
>
<template v-slot:prepend>
<q-icon name="attach_file" />
</template>
</q-file>
<q-btn
color="negative"
label="取消背景"
class="full-width"
@click="changeBackground(1)"
/>
</q-card>
</q-menu>
</q-item>
<q-item clickable :disable="!$refs.user.isVIP">
<q-item-section side>
<q-icon name="label" />
</q-item-section>
<q-item-section class="flex">紧凑标签栏 </q-item-section>
<q-tooltip
>更为紧凑的标签栏适用于标签非常多的情形</q-tooltip
>
<q-item-section side
><q-toggle
v-model="$root.profile.denseTagBar"
:disable="!$refs.user.isVIP"
color="primary"
/></q-item-section>
</q-item>
<q-item clickable>
<q-item-section side>
<q-icon name="search" />
</q-item-section>
<q-item-section class="flex">自动聚焦搜索 </q-item-section>
<q-tooltip>进入插件时自动聚焦搜索</q-tooltip>
<q-item-section side
><q-toggle
v-model="$root.profile.autofocusSearch"
color="primary"
/></q-item-section>
</q-item>
</q-list>
</q-menu>
</q-item>
<q-item clickable to="/share">
<q-item-section side>
<q-icon name="groups" />
</q-item-section>
<q-item-section>分享中心</q-item-section>
</q-item>
<!-- 收藏 -->
<q-item v-if="isTagStared" clickable @click="unMarkTag" v-close-popup>
<q-item-section side>
<q-icon name="star_border" />
</q-item-section>
<q-item-section>取消收藏</q-item-section>
</q-item>
<q-item v-else clickable @click="showPanelConf = true" v-close-popup>
<q-item-section side>
<q-icon name="star" />
</q-item-section>
<q-item-section>收藏标签</q-item-section>
<q-tooltip
>收藏后会将当前标签名作为全局关键字可在 uTools
的主输入框进行搜索
<br />
搜索进入后默认进入当前标签的面板视图 <br />
类似于旧版本的快捷面板</q-tooltip
>
</q-item>
<!-- 关于 -->
<q-item clickable @click="showAbout = true" v-close-popup>
<q-item-section side>
<q-icon name="info" />
</q-item-section>
<q-item-section>关于和帮助</q-item-section></q-item
>
</q-list>
</q-menu>
</q-btn>
<!-- 关于弹窗 -->
<q-dialog v-model="showAbout">
<AboutThis />
@@ -352,7 +360,7 @@
<q-dialog v-model="showPanelConf">
<PanelSetting :isTagStared="isTagStared" :currentTag="currentTag" />
</q-dialog>
</q-menu>
</div>
</template>
<script>

View File

@@ -1,52 +1,65 @@
<template>
<q-card>
<q-card-section class="q-gutter-md flex items-center">
<q-avatar square size="48px">
<img src="logo/quickcommand.png" />
</q-avatar>
<span class="text-h5"
>{{ pluginInfo.pluginName }} v{{ pluginInfo.version }}</span
>
</q-card-section>
<q-card-section> {{ pluginInfo.description }} </q-card-section>
<q-card-section>
<div v-for="group in Object.keys(links)" :key="group" class="q-gutter-sm">
<q-btn
flat
color="primary"
v-for="item in links[group]"
:key="item"
@click="visit(item.url)"
:label="item.name"
><q-tooltip>{{ item.desc }} </q-tooltip></q-btn
<div>
<q-card>
<q-card-section class="q-gutter-md flex items-center">
<q-avatar square size="48px">
<img src="logo/quickcommand.png" />
</q-avatar>
<span class="text-h5"
>{{ pluginInfo.pluginName }} v{{ pluginInfo.version }}</span
>
<br />
</div>
</q-card-section>
<q-card-actions align="right">
<q-btn flat label="确定" color="primary" v-close-popup />
</q-card-actions>
</q-card>
</q-card-section>
<q-card-section> {{ pluginInfo.description }} </q-card-section>
<q-card-section>
<div
v-for="group in Object.keys(links)"
:key="group"
class="q-gutter-sm"
>
<q-btn
flat
color="primary"
v-for="item in links[group]"
:key="item"
@click="item.url ? visit(item.url) : (showMore = true)"
:label="item.name"
><q-tooltip>{{ item.desc }} </q-tooltip></q-btn
>
<br />
</div>
</q-card-section>
<q-card-actions align="right">
<q-btn flat label="确定" color="primary" v-close-popup />
</q-card-actions>
</q-card>
<q-dialog v-model="showMore"> <MorePlugins /></q-dialog>
</div>
</template>
<script>
import MorePlugins from "./MorePlugins";
const links = {
plugin: [
{
name: "帮助",
url: "",
url: "https://www.yuque.com/fofolee/mwsoos/bg31vl",
desc: "查看插件使用帮助",
},
{
name: "源码",
url: "https://github.com/fofolee/uTools-quickcommand",
desc: "本插件完全开源,记得 Star 哟",
desc: "本插件完全开源,记得 ⭐️ 哟",
},
{
name: "论坛",
url: "https://yuanliao.info/d/424-242-242",
desc: "到猿料论坛参与讨论吧",
},
{
name: "更多插件",
desc: "看一看作者的其他插件吧",
},
],
tech: [
{
@@ -73,10 +86,12 @@ const links = {
};
export default {
components: { MorePlugins },
data() {
return {
pluginInfo: window.pluginInfo(),
links: links,
showMore: false,
};
},
methods: {

View File

@@ -126,7 +126,7 @@ export default {
}, 1000);
},
showHelp() {
window.showHelpPage("#Q0e7s");
window.showUb.help("#Q0e7s");
},
initValue() {
this.cronDetail = _.cloneDeep(this.default);

View File

@@ -154,7 +154,9 @@ export default {
quickcommand.showMessageBox("Token 校验失败", "error");
}
},
showHelp() {},
showHelp() {
window.showUb.help('#rWU2i')
},
joinRepo() {
quickcommand
.showConfirmBox(

View File

@@ -84,7 +84,7 @@
折优惠
</div>
<div>
会员功能将在保障用户完整的插件功能体验的前提下提供以下个性化功能
会员功能将在保障用户完整的插件功能体验的前提下提供主题样式类个性化功能
</div>
<div class="row items-center">
<q-icon size="sm" name="color_lens" class="q-mr-sm"></q-icon>
@@ -109,6 +109,12 @@
v-close-popup
@click="thinkOver"
/>
<q-btn
label="功能介绍"
icon="info"
color="deep-orange"
@click="showHelp"
></q-btn>
<q-btn
v-if="!isPluginVIP"
label="赏了!"
@@ -200,6 +206,9 @@ export default {
this.showPayPage = false;
});
},
showHelp() {
window.showUb.help("#yiSRi");
},
},
};
</script>

View File

@@ -131,7 +131,7 @@ export default {
}, 1000);
},
showHelp() {
window.showHelpPage("#GNjEg");
window.showUb.help("#GNjEg");
},
},
};