no message

This commit is contained in:
CN32479-詹红柱 2021-08-19 16:17:49 +08:00
parent 39263dd9be
commit 1efc3b67b2
12 changed files with 130 additions and 83 deletions

1
dist/css/app.7c24a282.css vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

4
dist/index.html vendored
View File

@ -1,4 +1,4 @@
<!DOCTYPE html><html lang="en" style="height: 100%;"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="favicon.ico"><link href="./static/css/bootstrap.css" rel="stylesheet"><link href="./static/css/style.css" rel="stylesheet"><link href="./static/css/index.css" rel="stylesheet"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0"><meta name="keywords" content="红隼书签, docschina, JavaScript, webpack, Node.js, Vue, React, Babel, Parcel, Rollup, RxJS, ECMAScript, Koa, Preact, PostCSS, 开源翻译, 开源技术文档, 中文文档, Web 前端中文文档, webpack 中文文档, doc.webpack-china.org, Node.js 中文文档, nodejs.cn, Vue.js 中文文档, vuefe.cn, React 中文文档, doc.react-china.org, Babel 中文文档, babeljs.cn, Parcel 中文文档, parceljs.io, Rollup 中文文档, rollupjs.cn, RxJS 中文文档, ECMAScript 中文文档, Koa 中文文档, koajs.cn, Preact 中文文档, Polymer, TypeScript, Element UI, iView UI, Vuetify, San, Lavas, Mint UI, Ant Design, ThinkJS, egg, Express, ESLint, 前端周刊, JavaScript Weekly, Node Weekly, Vue News, CSS Weekly, react status, Frontend Focus, Mobile Dev Weekly, Bitcoin Weekly, Golang Weekly"><meta name="description" content="红隼书签,深入挖掘国外前端新领域,为中国 Web 前端开发人员提供优质文档!!"><meta name="author" content="leehey, lizhihua, liqichang"><title>红隼书签-为中国 Web 前端开发人员提供优质网站导航</title><link href="css/app.7d81bd73.css" rel="preload" as="style"><link href="css/chunk-vendors.0d1c5105.css" rel="preload" as="style"><link href="js/app.d852d3ce.js" rel="preload" as="script"><link href="js/chunk-vendors.c88644cf.js" rel="preload" as="script"><link href="css/chunk-vendors.0d1c5105.css" rel="stylesheet"><link href="css/app.7d81bd73.css" rel="stylesheet"></head><body style="height:100%;margin: 0;"><noscript><strong>We're sorry but luotian-dev doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app" style="height: 100%;"></div><div id="mybookmark" style="height: 100%;display: none;opacity: 0;"></div><canvas id="canvas-complex" style="width:100vw;height:100vh;position: absolute;z-index:-99;top:0;opacity: 0.35;"></canvas><div class="demo-2"><div class="content"><div id="large-header" class="large-header"><canvas id="demo-canvas"></canvas></div></div></div><script src="./static/js/granim.min.js"></script><script src="./static/js/bg.js"></script><script>//
<!DOCTYPE html><html lang="en" style="height: 100%;"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="icon" href="favicon.ico"><link href="./static/css/bootstrap.css" rel="stylesheet"><link href="./static/css/style.css" rel="stylesheet"><link href="./static/css/index.css" rel="stylesheet"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=0"><meta name="keywords" content="红隼书签, docschina, JavaScript, webpack, Node.js, Vue, React, Babel, Parcel, Rollup, RxJS, ECMAScript, Koa, Preact, PostCSS, 开源翻译, 开源技术文档, 中文文档, Web 前端中文文档, webpack 中文文档, doc.webpack-china.org, Node.js 中文文档, nodejs.cn, Vue.js 中文文档, vuefe.cn, React 中文文档, doc.react-china.org, Babel 中文文档, babeljs.cn, Parcel 中文文档, parceljs.io, Rollup 中文文档, rollupjs.cn, RxJS 中文文档, ECMAScript 中文文档, Koa 中文文档, koajs.cn, Preact 中文文档, Polymer, TypeScript, Element UI, iView UI, Vuetify, San, Lavas, Mint UI, Ant Design, ThinkJS, egg, Express, ESLint, 前端周刊, JavaScript Weekly, Node Weekly, Vue News, CSS Weekly, react status, Frontend Focus, Mobile Dev Weekly, Bitcoin Weekly, Golang Weekly"><meta name="description" content="红隼书签,深入挖掘国外前端新领域,为中国 Web 前端开发人员提供优质文档!!"><meta name="author" content="leehey, lizhihua, liqichang"><title>红隼书签-为中国 Web 前端开发人员提供优质网站导航</title><link href="css/app.7c24a282.css" rel="preload" as="style"><link href="css/chunk-vendors.0d1c5105.css" rel="preload" as="style"><link href="js/app.47d659b8.js" rel="preload" as="script"><link href="js/chunk-vendors.c88644cf.js" rel="preload" as="script"><link href="css/chunk-vendors.0d1c5105.css" rel="stylesheet"><link href="css/app.7c24a282.css" rel="stylesheet"></head><body style="height:100%;margin: 0;"><noscript><strong>We're sorry but luotian-dev doesn't work properly without JavaScript enabled. Please enable it to continue.</strong></noscript><div id="app" style="height: 100%;"></div><div id="mybookmark" style="height: 100%;display: none;opacity: 0;"></div><canvas id="canvas-complex" style="width:100vw;height:100vh;position: absolute;z-index:-99;top:0;opacity: 0.35;"></canvas><div class="demo-2"><div class="content"><div id="large-header" class="large-header"><canvas id="demo-canvas"></canvas></div></div></div><script src="./static/js/granim.min.js"></script><script src="./static/js/bg.js"></script><script>//
var granimInstance = new Granim({
element: '#canvas-complex',
direction: 'left-right',
@ -18,4 +18,4 @@
]
}
}
});</script><script src="js/chunk-vendors.c88644cf.js"></script><script src="js/app.d852d3ce.js"></script></body></html>
});</script><script src="js/chunk-vendors.c88644cf.js"></script><script src="js/app.47d659b8.js"></script></body></html>

2
dist/js/app.47d659b8.js vendored Normal file

File diff suppressed because one or more lines are too long

1
dist/js/app.47d659b8.js.map vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -5,10 +5,8 @@ export const saveObject = (className, params) => {
const Todo = AV.Object.extend(className)
const user = AV.User.current()
var todo = new Todo()
for (var i in params) {
todo.set(i, params[i])
}
todo.set(user, user)
todo.set('formDatas', params.formDatas)
todo.set('user', user)
todo.save().then((res) => {
resolve(res)
}, (error) => {

View File

@ -72,7 +72,7 @@
<!-- 新增/修改弹窗 -->
<Dialog class="my-dialog" v-model="isDetailVisible" @closeViews="closeViews" :detail="detail" :selectType="activeIndex" @fresh="search" />
<!-- 登录弹窗 -->
<Login v-model="isLoginVisible" @closeViews="closeLoginViews" @setUser="setUsername"/>
<Login v-model="isLoginVisible" @closeViews="closeLoginViews" @setUser="setUsername" />
</template>
<script>
import { reactive, toRefs } from '@vue/reactivity'
@ -82,22 +82,11 @@ import Dialog from './components/Dialog.vue'
import Login from './components/Login.vue'
import gsap from 'gsap'
import { ElMessage, ElMessageBox } from 'element-plus'
import { importBookmark, exportBookmark, getRemoteList } from './components/utils.js'
import { saveObject, getObject } from './Api/common.js'
import { exportBookmark, walkBookmarksTree } from './components/utils.js'
import Cookie from 'js-cookie'
import Api from './Api/user.js'
var rowData = []
function getData(fn = () => {}) {
//
if (localStorage.getItem('BOOKMARK')) {
console.log('持久化数据')
rowData = JSON.parse(localStorage.getItem('BOOKMARK'))
} else {
localStorage.setItem('BOOKMARK', JSON.stringify(myData))
rowData = myData
}
fn()
}
getData()
export default {
components: { Dialog, Login },
name: 'kestrel-bookmark',
@ -114,10 +103,10 @@ export default {
const data = reactive({
activeIndex: 0,
data: rowData,
bookMark: rowData[0].children,
data: [],
bookMark: [],
searchVal: '',
allData: flatten(rowData),
allData: [],
isDetailVisible: false,
isLoginVisible: false,
detail: {},
@ -125,18 +114,59 @@ export default {
username: '未登录'
}
})
/*
**数据来源
1.未登录 缓存无数据 取默认
2.未登录 缓存有数据 取缓存
3.已登录 系统无数据 取默认
4.已登录 系统有数据 取系统数据
*/
const getBookmarkList = (fn = () => {}) => {
if (Cookie.get('userInfo')) {
data.userInfo = JSON.parse(Cookie.get('userInfo'))
}
if (!data.userInfo.objectId) {
if (localStorage.getItem('BOOKMARK')) {
rowData = JSON.parse(localStorage.getItem('BOOKMARK'))
} else {
localStorage.setItem('BOOKMARK', JSON.stringify(myData))
rowData = JSON.parse(JSON.stringify(myData))
}
data.data = rowData
data.bookMark = rowData[0].children
data.allData = flatten(rowData)
fn()
} else {
//
getObject('BOOKMARK').then((res) => {
if (res.length > 0) {
rowData = JSON.parse(res[0].attributes.formDatas)
} else {
localStorage.setItem('BOOKMARK', JSON.stringify(myData))
rowData = JSON.parse(JSON.stringify(myData))
}
}).catch(() => {
localStorage.setItem('BOOKMARK', JSON.stringify(myData))
rowData = JSON.parse(JSON.stringify(myData))
}).finally(() => {
fn()
data.data = rowData
data.bookMark = rowData[0].children
data.allData = flatten(rowData)
})
}
}
//
const setUsername = () => {
if (Cookie.get('userInfo')) {
data.userInfo = JSON.parse(Cookie.get('userInfo'))
} else {
data.userInfo = {username: '未登录'}
data.userInfo = { username: '未登录' }
}
getBookmarkList()
}
setUsername()
getRemoteList()
//
watch(
() => data.searchVal,
@ -181,14 +211,14 @@ export default {
const closeViews = (v) => (data.isDetailVisible = v)
const closeLoginViews = (v) => (data.isLoginVisible = v)
//
//
const search = async () => {
await getData(() => {
await getBookmarkList(() => {
data.data = rowData
data.bookMark = rowData[data.activeIndex].children
})
}
//
//
const deleteClick = (row) => {
const myData = JSON.parse(localStorage.getItem('BOOKMARK'))
const delDetail = Object.assign(row, {
@ -217,13 +247,12 @@ export default {
}).then(() => {
const params = { username: '', password: '' }
Api.logout(params.username, params.password).then((res) => {
console.log(res)
Cookie.remove('userInfo')
setUsername()
})
ElMessage({
type: 'success',
message: '删除成功!'
message: '已退出登录'
})
})
}
@ -232,6 +261,38 @@ export default {
data.userInfo.objectId ? LoginOut() : handleUserLogin()
}
//
const importBookmark = () => {
if (data.userInfo.objectId) {
const file = document.getElementById('file')
file.dispatchEvent(new MouseEvent('click'))
const mybookmark = document.getElementById('mybookmark')
document.getElementById('file').addEventListener('change', function () {
var file = document.getElementById('file').files[0]
var reader = new FileReader()
reader.readAsText(file, 'utf-8')
reader.onload = function () {
mybookmark.innerHTML = reader.result
const formDatas = JSON.stringify(walkBookmarksTree(mybookmark))
if (formDatas) {
const params = { formDatas: formDatas }
saveBookmarkList(params)
}
}
})
} else {
ElMessage.warning('请先登录')
}
}
//
const saveBookmarkList = (params) => {
saveObject('BOOKMARK', params).then((res) => {
ElMessage.success('导入成功')
getBookmarkList()
})
}
return {
deleteClick,
...toRefs(data),

View File

@ -112,7 +112,6 @@ export default {
}
} else {
//
console.log('---?')
if (v.type === formData.type) {
v.children.push(formData)
ElMessage.success('新增成功')

View File

@ -1,6 +1,6 @@
<template>
<el-dialog custom-class="my-dialog" title="用户登录" :visible="isLoginVisible" width="400px">
<el-form status-icon ref="refruleForm" :rules="rules" :model="ruleForm" label-width="80px" size="small">
<el-form status-icon ref="refruleForm" :rules="rules" :model="ruleForm" label-width="60px" size="small">
<el-row>
<el-col :span="24">
<el-form-item label="邮箱" prop="email">
@ -50,7 +50,7 @@ export default {
// :rules
const rules = {
password: [{ required: true, message: '请输入密码', trigger: 'blur' }],
email: [{type: 'email', required: true, message: '请输入邮箱', trigger: 'blur' }]
email: [{type: 'email', required: true, message: '请输入正确的邮箱', trigger: 'blur' }]
}
const refruleForm = ref(null)
//
@ -60,18 +60,22 @@ export default {
const formData = { ...form.ruleForm }
Api.login(formData.email, formData.password)
.then((res) => {
// token
Cookie.set('userInfo', JSON.stringify(res))
context.emit('setUser')
ElMessage.success('登录成功')
closeViews()
})
.catch(() => {
Api.register(formData.email, formData.password).then((res) => {
Cookie.set('userInfo', JSON.stringify(res))
context.emit('setUser')
ElMessage.success('注册成功')
closeViews()
})
.catch((err) => {
if (err.code === 210) {
ElMessage.error('账号或密码不正确')
} else if (err.code === 211) {
Api.register(formData.email, formData.password).then((res) => {
Cookie.set('userInfo', JSON.stringify(res))
context.emit('setUser')
ElMessage.success('注册成功')
closeViews()
})
}
})
}
})

View File

@ -1,7 +1,5 @@
import {saveObject, getObject} from '../Api/common.js'
import { ElMessage } from 'element-plus'
function walkBookmarksTree(root) {
// 格式化浏览器书签
export function walkBookmarksTree(root) {
const result = []
// 深度优先遍历
const walk = (node, list) => {
@ -29,7 +27,7 @@ function walkBookmarksTree(root) {
// 文件夹
if (isDir) {
child = {
name: item.tagName === 'DT' ? item.querySelector('h3') ? item.querySelector('h3').innerText : '' : '',
type: item.tagName === 'DT' ? item.querySelector('h3') ? item.querySelector('h3').innerText : '' : '',
folder: true,
children: []
}
@ -38,7 +36,7 @@ function walkBookmarksTree(root) {
const _item = item.querySelector('a')
if (_item) {
child = {
name: _item?.innerText,
title: _item?.innerText,
url: _item?.href
}
}
@ -49,33 +47,27 @@ function walkBookmarksTree(root) {
}
}
walk(root, result)
return result
const myBookmark = result.filter(v => v.folder)
return flagBrowerList(myBookmark)
}
// 导入
export function importBookmark() {
const file = document.getElementById('file')
file.dispatchEvent(new MouseEvent('click'))
const mybookmark = document.getElementById('mybookmark')
document.getElementById('file').addEventListener('change', function () {
var file = document.getElementById('file').files[0]
var reader = new FileReader()
reader.readAsText(file, 'utf-8')
reader.onload = function () {
mybookmark.innerHTML = reader.result
console.log(walkBookmarksTree(mybookmark))
const formDatas = localStorage.getItem('BOOKMARK')
const params = {formDatas: formDatas}
console.log(params)
saveObject('BOOKMARK', params).then(res => {
console.log('导入成功', res)
ElMessage.success('导入成功')
})
// const myData = walkBookmarksTree(mybookmark)
// myData && localStorage.setItem('BOOKMARK', myData)
// 降维书签数据
const flagBrowerList = v => {
const res = []
const flatten = (v) => {
for (let i = 0; i < v.length; i++) {
if (v[i].folder) {
flatten(v[i].children)
const result = v[i]
result.children = result.children.filter(v => !v.folder)
res.push(result)
}
}
})
}
flatten(v)
return res
}
// 导出数据为JSON下载
export function exportBookmark() {
if (localStorage.getItem('BOOKMARK')) {
@ -95,10 +87,3 @@ export function exportBookmark() {
this.$message.warning('暂无可导出数据')
}
}
// 获取远程书签
export const getRemoteList = () => {
getObject('BOOKMARK').then(res => {
console.log('获取书签', res)
})
}