feat: support custom script/css

ygyzy · Dec 28, 2021 · 8af3902 · 8af3902
1 parent 10d2550
commit 8af3902
Show file tree

Hide file tree

Showing 22 changed files with 211 additions and 36 deletions.
diff --git a/packages/sharelist-plugin/lib/driver.baidu.js b/packages/sharelist-plugin/lib/driver.baidu.js
@@ -167,6 +167,8 @@ module.exports = class Driver {
  { key: 'redirect_uri', label: '回调地址 / Redirect URI', required: true },
  { key: 'refresh_token', label: '刷新令牌 / Refresh Token', type: 'string', required: true },
  { key: 'root_id', label: '初始文件夹ID', help: '', type: 'string', required: false },
+ { key: 'access_token', label: '令牌', help: '', type: 'hidden', required: false },
+ { key: 'expires_at', label: '有效期', help: '', type: 'hidden', required: false },
  ]
 
  this.abusiveFilesMap = {}

diff --git a/packages/sharelist-plugin/lib/driver.caiyun.js b/packages/sharelist-plugin/lib/driver.caiyun.js
@@ -240,7 +240,7 @@ module.exports = class Driver {
  { key: 'token', label: 'ORCHES-C-TOKEN', type: 'string', required: true },
  { key: 'encrypt', label: 'ORCHES-I-ACCOUNT-ENCRYPT', type: 'string', required: true },
  { key: 'mobile', label: '手机号', type: 'string', required: true },
- //{ key: 'root_id', label: '初始目录ID', type: 'string', required: false },
+ { key: 'root_id', label: '初始目录ID', type: 'string', required: false },
  ]
  }
 

diff --git a/packages/sharelist-web/src/assets/font/source-code-pro_latin.woff2 b/packages/sharelist-web/src/assets/font/source-code-pro_latin.woff2
diff --git a/packages/sharelist-web/src/assets/style/index.less b/packages/sharelist-web/src/assets/style/index.less
diff --git a/packages/sharelist-web/src/components/icon/icon-svg.js b/packages/sharelist-web/src/components/icon/icon-svg.js
diff --git a/packages/sharelist-web/src/components/icon/index.less b/packages/sharelist-web/src/components/icon/index.less
@@ -1,10 +1,32 @@
-.sl-icon {
- display: inline-block;
- font-style: normal;
- vertical-align: -0.125em;
- text-align: center;
- text-transform: none;
- line-height: 0;
- text-rendering: optimizeLegibility;
- -webkit-font-smoothing: antialiased;
-}
+// .sl-icon {
+// display: inline-block;
+// font-style: normal;
+// vertical-align: -0.125em;
+// text-align: center;
+// text-transform: none;
+// line-height: 0;
+// text-rendering: optimizeLegibility;
+// -webkit-font-smoothing: antialiased;
+// }
+@type: {
+ icon-folder:#f8d673;
+ icon-other:#4285f4;
+ icon-audio:#db4437;
+ icon-video:#db4437;
+ icon-word:#2F97FE;
+ icon-pdf:#FC5A5A;
+ icon-image:#db4437;
+ icon-doc:#4285f4;
+ icon-ppt:#db4437;
+}
+// :root{
+// each(@type, {
+// --@{key}: @value;
+// });
+// }
+
+each(@type, {
+ #@{key}{
+ color:~"var(--@{key},@{value})";
+ }
+});
diff --git a/packages/sharelist-web/src/components/icon/index.ts b/packages/sharelist-web/src/components/icon/index.ts
@@ -1,8 +1,9 @@
 import { createFromIconfontCN } from '@ant-design/icons-vue'
 import config from '../../config/setting'
-
+import './icon-svg'
+import './index.less'
 const IconFont = createFromIconfontCN({
- scriptUrl: config.iconFontCN,
+ scriptUrl: [],
 })
 
 export default IconFont
diff --git a/packages/sharelist-web/src/config/api.ts b/packages/sharelist-web/src/config/api.ts
@@ -13,7 +13,7 @@ const api: IAPI[] = [
  ['setting', 'GET /api/setting', { token: true }],
  ['exportSetting', 'GET /api/setting?raw=true', { token: true }],
  ['saveSetting', 'POST /api/setting', { token: true }],
- ['config', 'GET /api/config'],
+ ['config', 'GET /api/configs'],
  ['clearCache', 'PUT /api/cache/clear'],
  ['reload', 'PUT /api/reload'],
  //

diff --git a/packages/sharelist-web/src/hooks/useDisk.ts b/packages/sharelist-web/src/hooks/useDisk.ts
@@ -13,7 +13,7 @@ export type IFile = {
  ctime: number
  mtime: number
  path: string
- extra?: any
+ extra?: Record<string, any>
  [key: string]: any
 }
 

diff --git a/packages/sharelist-web/src/index.html b/packages/sharelist-web/src/index.html
@@ -6,12 +6,15 @@
  <link rel="icon" href="/favicon.ico" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <meta name="referrer" content="never">
+ <link rel="stylesheet" href="/api/config/style?content-type=text/css" type="text/css" charset="utf-8" />
+ <!-- <link rel="stylesheet" href="/assets/style.css" type="text/css" charset="utf-8" /> -->
  <title>ShareList</title>
 </head>
 
 <body>
  <div id="app"></div>
  <script type="module" src="/main.ts"></script>
+ <script src="/api/config/script?content-type=application/x-javascript"></script>
 </body>
 
 </html>
diff --git a/packages/sharelist-web/src/main.ts b/packages/sharelist-web/src/main.ts
@@ -4,7 +4,6 @@ import store from './store'
 import router from './router'
 import { message } from 'ant-design-vue'
 // console.log('electron-store', new Store())
-
 import 'ant-design-vue/dist/antd.less'
 import '@/assets/style/index.less'
 

diff --git a/packages/sharelist-web/src/utils/format.ts b/packages/sharelist-web/src/utils/format.ts
@@ -9,6 +9,8 @@ export const getFileType = (v: string, type: string): string => {
  return 'audio'
  } else if (['doc', 'docx', 'wps'].includes(v)) {
  return 'word'
+ } else if (['ppt', 'pptx'].includes(v)) {
+ return 'ppt'
  } else if (['pdf'].includes(v)) {
  return 'pdf'
  } else if (['doc', 'docx', 'ppt', 'pptx', 'xls', 'xlsx', 'pdf', 'txt', 'yaml', 'ini', 'cfg'].includes(v)) {

diff --git a/packages/sharelist-web/src/views/home/index.less b/packages/sharelist-web/src/views/home/index.less
@@ -8,23 +8,47 @@
  padding:12px;
  transition: all 0.3s;
  cursor: pointer;
+ position: relative;
  &:hover{
  background-color: rgba(132,133,141,0.08);
  }
 
-
+ .item-info{
+ padding:0 6px;
+ color:rgba(0,0,0,.5);
+ flex:0 0 auto;
+ position:absolute;
+ right:0;
+ top:0;
+ }
  .item-name{
  flex: 1;
  min-width: 0;
  width:100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
+ // display: flex;
+ position: relative;
  }
  .item-icon{
  margin-right: 16px;
  flex:none;
  }
+
+ .item-icon__ext{
+ position: absolute;
+ font-size: 12px;
+ left:20px;
+ bottom: 12px;
+ color:#fff;
+ text-transform: uppercase;
+ transform: scale(0.8);
+ width:42px;
+ // text-align: center;
+ transform-origin: left;
+ }
+
  .item-meta{
  flex:auto;
  display: flex;
@@ -62,7 +86,12 @@
  width:100%;
  overflow: hidden;
  }
-
+ .item-icon__ext--md{
+ transform: scale(0.55);
+ }
+ .item-icon__ext--sm{
+ display: none;
+ }
  .item-ctime{
  // display: none;
  }

diff --git a/packages/sharelist-web/src/views/home/index.tsx b/packages/sharelist-web/src/views/home/index.tsx
@@ -1,6 +1,6 @@
-import { ref, defineComponent, watch, reactive, toRef, computed } from 'vue'
+import { ref, defineComponent, watch, reactive, toRef, computed, withModifiers } from 'vue'
 import { useStore } from 'vuex'
-import { Spin } from 'ant-design-vue'
+import { Spin, Modal } from 'ant-design-vue'
 import Icon from '@/components/icon'
 import useDisk, { IFile } from '@/hooks/useDisk'
 import './index.less'
@@ -9,6 +9,8 @@ import { isSupportType, isAudioSupport, isVideoSupport } from '@/utils/format'
 import MediaPlayer, { usePlayer } from '@/components/player'
 import Breadcrumb from './partial/breadcrumb'
 import Error from './partial/error'
+import { useSetting } from '@/hooks/useSetting'
+import { InfoCircleOutlined } from '@ant-design/icons-vue'
 
 export default defineComponent({
  setup() {
@@ -20,6 +22,8 @@ export default defineComponent({
 
  const [mediaId, setMediaData] = usePlayer()
 
+ const { loginState } = useSetting()
+
  const onClick = (data: IFile) => {
  if (data.type == 'folder') {
  setPath(data)
@@ -41,6 +45,23 @@ export default defineComponent({
  }
  }
 
+ const onShowInfo = (file: IFile) => {
+ console.log(file)
+ Modal.info({
+ centered: true,
+ title: file.name,
+ content: <div>
+ <div class="item">
+ <div class="item__header">
+ <div class="item__meta">
+ <h4 class="item__meta-title">目录ID</h4>
+ <div class="item__meta-desc" style="font-size:10px;color:rgba(0,0,0,.5);">{file.extra?.fid}</div>
+ </div>
+ </div>
+ </div>
+ </div>
+ })
+ }
  return () => (
  <div class="layout app-light">
  <Header />
@@ -50,14 +71,19 @@ export default defineComponent({
  <Error value={error}>
  {files.value.map((i: IFile) => {
  return (
- <a href={'/' + [...paths.value, i.name].join('/') + '?download'} class="item" title={i.name} onClick={(e) => { onClick(i); e.preventDefault() }}>
+ <a class="item" title={i.name} onClick={withModifiers(() => onClick(i), ['prevent'])}>
  <Icon
  class="item-icon"
  style={{ fontSize: layout.value == 'grid' ? '42px' : '26px' }}
  type={'icon-' + i.iconType}
  />
+ {i.iconType == 'other' ? <div class={["item-icon__ext", i.ext.length > 7 ? 'item-icon__ext--sm' : i.ext.length > 4 ? 'item-icon__ext--md' : '']}>{i.ext}</div> : null}
  <div class="item-meta">
- <div class="item-name">{i.name}</div>
+ <div class="item-name">{i.name}
+ {
+ loginState.value == 1 && i.iconType == 'folder' && i.extra?.fid ? <div class="item-info" onClick={withModifiers(() => onShowInfo(i), ['stop', 'prevent'])}><InfoCircleOutlined /></div> : null
+ }
+ </div>
  <div class="item-ctime">{i.ctimeDisplay}</div>
  <div class="item-size">{i.sizeDisplay}</div>
  </div>
@@ -66,7 +92,7 @@ export default defineComponent({
  })}
  </Error>
  </div>
- </Spin>
+ </Spin >
  <div class="widget">
  <MediaPlayer meidaId={mediaId} />
  </div>
@@ -80,7 +106,7 @@ export default defineComponent({
  </a>
  </p>
  </footer>
- </div>
+ </div >
  )
  },
 })
diff --git a/packages/sharelist-web/src/views/manage/partial/disk.tsx b/packages/sharelist-web/src/views/manage/partial/disk.tsx
@@ -13,7 +13,7 @@ export default defineComponent({
  const createModifier = (data: IDrive, idx = -1) => {
  const updateData = (modifyData: IDrive) => {
  const saveData = [...config.drives]
- console.log(saveData, idx)
+ // console.log(saveData, idx)
  if (idx == -1) {
  saveData.push(modifyData)
  } else {

diff --git a/packages/sharelist-web/src/views/manage/partial/drive-modifier.tsx b/packages/sharelist-web/src/views/manage/partial/drive-modifier.tsx
@@ -55,15 +55,15 @@ const parseFields = (
  parseFields(i.fields, formState, defaultValues, formItemsNode, innerRule)
  }
  }
- } else {
+ } else if (i.type != 'hidden') {
  formItemsNode.push(
  <FormItem label={i.label} name={i.key} help={i.help}>
  <Input v-model={[formState[i.key], 'value']} />
  </FormItem>,
  )
  }
  }
-
+ console.log(formState)
  return [formItemsNode, innerRule]
 }
 export default defineComponent({
@@ -106,6 +106,8 @@ export default defineComponent({
  .validate()
  .then(() => {
  const { name, ...path } = toRaw(formState)
+ console.log('formState', formState, path)
+
  ctx.emit('update', { name, path })
  })
  .catch((err: any) => {

diff --git a/packages/sharelist-web/src/views/manage/partial/general.tsx b/packages/sharelist-web/src/views/manage/partial/general.tsx
@@ -36,6 +36,8 @@ export default defineComponent({
  { code: 'webdav_proxy', label: 'WebDAV 代理', type: 'boolean' },
  { code: 'webdav_user', label: 'WebDAV 用户名', type: 'string' },
  { code: 'webdav_pass', label: 'WebDAV 密码', type: 'string' },
+ { code: 'script', label: '自定义脚本', type: 'string' },
+ { code: 'style', label: '自定义样式', type: 'string' },
  ]
  const { config, setConfig } = useSetting()
 

diff --git a/packages/sharelist/app/controller/api.js b/packages/sharelist/app/controller/api.js
@@ -23,6 +23,18 @@ const getConfig = (app, raw = false) => {
  return config
 }
 
+const getCustomConfig = (app) => {
+ const ret = {}
+ const defaultConfigKey = app.sharelist.defaultConfigKey
+ const config = { ...app.sharelist.config }
+ for (let i of Object.keys(config)) {
+ if (!defaultConfigKey.includes(i)) {
+ ret[i] = config[i]
+ }
+ }
+ return ret
+}
+
 const getFilePath = (file, app) => {
  return path.join(
  app.appInfo.baseDir,
@@ -58,8 +70,19 @@ module.exports = {
  ctx.body = { data: getConfig(this.app, !!ctx.query.raw) }
  },
  async config(ctx, next) {
- const data = getConfig(this.app, !!ctx.query.raw)
- ctx.body = { status: 0, data: { title: data.title } }
+ const data = getCustomConfig(this.app)
+ ctx.body = { status: 0, data }
+ },
+ async configField(ctx, next) {
+ const data = getCustomConfig(this.app)
+ const key = ctx.query.key || ctx.params.field
+ const ret = key && data[key] ? data[key] : ''
+ if (ctx.query['content-type']) {
+ ctx.set('content-type', ctx.query['content-type'])
+ ctx.body = ret
+ } else {
+ ctx.body = { status: 0, data: ret }
+ }
  },
  async reload(ctx, next) {
  await this.app.sharelist.reload()

diff --git a/packages/sharelist/app/router.js b/packages/sharelist/app/router.js
@@ -4,13 +4,16 @@ module.exports = app => {
 
  router
  .get('/api/setting', auth, controller.api.setting)
+ .get('/api/configs', auth, controller.api.config)
  .post('/api/setting', auth, controller.api.updateSetting)
  .put('/api/cache/clear', auth, controller.api.clearCache)
  .put('/api/reload', auth, controller.api.reload)
 
  .post('/api/drive/list', controller.api.list)
  .post('/api/drive/get', controller.api.get)
  .get('/api/drive/get', controller.api.get)
+
+ .get('/api/config/:field', controller.api.configField)
  // .get('/api/drive/download', controller.api.download)
 
  .get('/api/drive/path', controller.api.list)

diff --git a/packages/sharelist/package/sharelist/config.js b/packages/sharelist/package/sharelist/config.js
@@ -48,7 +48,10 @@ const defaultConfig = {
  proxy_url: 'https://reruin.github.io/sharelist/redirect.html',
 }
 
-module.exports = (path) => {
+
+exports.defaultConfigKey = Object.keys(defaultConfig)
+
+exports.createConfig = (path) => {
  return createDB(
  path,
  { raw: true },