panqihua
/
cloudnote_web
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

个人中心-我的上传、我的收藏

Browse Source 
笔记列表+表单校验
master
pan 4 years ago
parent 7aeb30bd07
commit 44f87a712a
9 changed files with 243 additions and 43 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 32
      components/center/collect.vue
  2. 31
      components/center/myupload.vue
  3. 89
      components/center/security.vue
  4. 80
      nuxt.config.js
  5. 1
      package.json
  6. 38
      pages/index/note.vue
  7. 6
      pages/index/upload.vue
  8. 4
      plugins/moment.js
  9. 5
      yarn.lock

32
components/center/collect.vue
Unescape View File

@ -1,9 +1,33 @@
<template>
<h1>我的收藏</h1>
<el-col :span="10">
<el-table :data="tableData" border>
<el-table-column align="center" prop="title" :label="$t('center.collect.form.title')" />
<el-table-column align="center" prop="time" :label="$t('center.collect.form.time')" />
</el-table>
<div class="block center mt1">
<el-pagination
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</el-col>
</template>
<script lang="ts">
export default {
name: 'collect'
}
import Vue from 'vue'
export default Vue.extend( {
name: 'collect',
data(){
return {
tableData: [{
title: '论文标题1',
time: this.$moment().format("YYYY-MM-DD")
}]
}
}
})
</script>

31
components/center/myupload.vue
Unescape View File

@ -1,9 +1,32 @@
<template>
<h1>我的上传</h1>
<el-col :span="10">
<el-table :data="tableData" border>
<el-table-column align="center" prop="title" :label="$t('center.myupload.form.title')" />
<el-table-column align="center" prop="time" :label="$t('center.myupload.form.time')" />
</el-table>
<div class="block center mt1">
<el-pagination
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</el-col>
</template>
<script lang="ts">
export default {
name: 'myupload'
}
import Vue from 'vue'
export default Vue.extend( {
name: 'myupload',
data(){
return {
tableData: [{
title: '论文标题1',
time: this.$moment().format("YYYY-MM-DD")
}]
}
}
})
</script>

89
components/center/security.vue
Unescape View File

@ -1,25 +1,28 @@
<template>
<el-form ref="form" :model="form" label-width="100px">
<el-form-item :label="$t('center.security.oldpwd')">
<el-col :span="4">
<el-input type="password" :placeholder="$t('center.security.input_oldpwd',{oldpwd:$t('center.security.oldpwd')})"/>
</el-col>
</el-form-item>
<el-form-item :label="$t('center.security.newpwd')">
<el-col :span="4">
<el-input type="password" :placeholder="$t('center.security.input_newpwd',{newpwd:$t('center.security.newpwd')})"/>
</el-col>
</el-form-item>
<el-form-item :label="$t('center.security.confirmpwd')">
<el-col :span="4">
<el-input type="password" :placeholder="$t('center.security.input_confirmpwd',{newpwd:$t('center.security.newpwd')})"/>
</el-col>
</el-form-item>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-form-item :label="$t('center.security.oldpwd')" prop="oldpwd">
<el-col :span="4">
<el-input v-model="form.oldpwd" show-password type="password"
:placeholder="$t('center.security.input_oldpwd',{oldpwd:$t('center.security.oldpwd')})"/>
</el-col>
</el-form-item>
<el-form-item :label="$t('center.security.newpwd')" prop="newpwd">
<el-col :span="4">
<el-input v-model="form.newpwd" show-password type="password"
:placeholder="$t('center.security.input_newpwd',{newpwd:$t('center.security.newpwd')})"/>
</el-col>
</el-form-item>
<el-form-item :label="$t('center.security.confirmpwd')" prop="confirmpwd">
<el-col :span="4">
<el-input v-model="form.confirmpwd" show-password type="password"
:placeholder="$t('center.security.input_confirmpwd',{newpwd:$t('center.security.newpwd')})"/>
</el-col>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">{{$t('submit')}}</el-button>
</el-form-item>
</el-form>
<el-form-item>
<el-button type="primary" @click="onSubmit">{{$t('button.submit')}}</el-button>
</el-form-item>
</el-form>
</template>
<script lang="ts">
@ -27,13 +30,51 @@
export default Vue.extend({
name: 'security',
data(){
data() {
return {
form:{}
form: {
oldpwd: '',
newpwd: '',
confirmpwd: ''
},
rules: {
oldpwd: [
{
required: true,
message: this.$t('center.security.input_oldpwd', { oldpwd: this.$t('center.security.oldpwd') }),
trigger: 'blur'
},
{ min: 3, max: 5, message: this.$t('center.security.rules.password',{min:3,max:5}), trigger: 'blur' }
],
newpwd: [
{
required: true,
message: this.$t('center.security.input_newpwd', { newpwd: this.$t('center.security.newpwd') }),
trigger: 'blur'
},
{ min: 3, max: 5, message: this.$t('center.security.rules.password',{min:3,max:5}), trigger: 'blur' }
],
confirmpwd: [
{
required: true,
message: this.$t('center.security.input_confirmpwd', { newpwd: this.$t('center.security.newpwd') }),
trigger: 'blur'
},
{ min: 3, max: 5, message: this.$t('center.security.rules.password',{min:3,max:5}), trigger: 'blur' }
]
}
}
},
methods:{
onSubmit(){
methods: {
onSubmit() {
this.$refs.form.validate((valid: boolean)=>{
if (valid) {
this.$alert(this.$t('center.security.tip.ok').toString())
} else {
console.log('error submit!!');
return false;
}
})
}
}

80
nuxt.config.js
Unescape View File

@ -32,12 +32,12 @@ export default {
/*
** Global CSS
*/
css: ['element-ui/lib/theme-chalk/index.css'],
css: ['element-ui/lib/theme-chalk/index.css','postcss/docs/api/assets/styles.min.css'],
/*
** Plugins to load before mounting the App
** https://nuxtjs.org/guide/plugins
*/
plugins: ['@/plugins/element-ui','@/plugins/vue-cookies','@/plugins/global'],
plugins: ['@/plugins/element-ui','@/plugins/vue-cookies','@/plugins/global','@/plugins/moment'],
/*
** Auto import components
** See https://nuxtjs.org/api/configuration-components
@ -99,12 +99,28 @@ export default {
"login": "登录",
"register": "注册"
},
"action": "操作",
"app_name": "云笔记",
"button": {
"cancel": "取消",
"del": "删除",
"edit": "编辑",
"ok": "確定",
"submit": "提交"
},
"center": {
"collect": {
"form": {
"time": "收藏时间",
"title": "论文标题"
},
"name": "我的收藏"
},
"myupload": {
"form": {
"time": "上传时间",
"title": "论文标题"
},
"name": "我的上传"
},
"security": {
@ -114,7 +130,13 @@ export default {
"input_oldpwd": "请输入{oldpwd}",
"name": "帐号安全",
"newpwd": "新密码",
"oldpwd": "原密码"
"oldpwd": "原密码",
"rules": {
"password": "长度在 {min} 到 {max} 个字符之间"
},
"tip": {
"ok": "密码修改成功"
}
}
},
"choose_lang": "选择语言",
@ -128,7 +150,16 @@ export default {
"note": "笔记列表",
"upload": "本地上传论文"
},
"submit": "提交",
"note": {
"table": {
"note_name": "笔记名称",
"paper_name": "论文标题"
},
"tip": {
"confirm_del": "此操作将永久删除该笔记，是否继续？"
}
},
"tip": "提示",
"unknown_error": "未知错误",
"upload": {
"form": {
@ -149,6 +180,9 @@ export default {
"upload": "点击上传",
"upload_tip": "只能上传txt",
"year": "学位年度"
},
"tip": {
"ok": "论文上传成功"
}
},
"user": "帐号",
@ -168,12 +202,28 @@ export default {
"login": "登录",
"register": "注册"
},
"action": "",
"app_name": "cloudnote",
"button": {
"cancel": "",
"del": "",
"edit": "",
"ok": "",
"submit": ""
},
"center": {
"collect": {
"form": {
"time": "",
"title": ""
},
"name": "我的收藏"
},
"myupload": {
"form": {
"time": "",
"title": ""
},
"name": "我的上传"
},
"security": {
@ -183,7 +233,13 @@ export default {
"input_oldpwd": "",
"name": "帐号安全",
"newpwd": "",
"oldpwd": ""
"oldpwd": "",
"rules": {
"password": ""
},
"tip": {
"ok": ""
}
}
},
"choose_lang": "language",
@ -197,7 +253,16 @@ export default {
"note": "note list",
"upload": "本地上传论文"
},
"submit": "提交",
"note": {
"table": {
"note_name": "",
"paper_name": ""
},
"tip": {
"confirm_del": ""
}
},
"tip": "",
"unknown_error": "未知错误",
"upload": {
"form": {
@ -218,6 +283,9 @@ export default {
"upload": "点击上传",
"upload_tip": "只能上传txt",
"year": "学位年度"
},
"tip": {
"ok": ""
}
},
"user": "帐号",

1
package.json
Unescape View File

@ -27,6 +27,7 @@
"@nuxtjs/axios": "^5.11.0",
"@nuxtjs/pwa": "^3.0.0-beta.20",
"element-ui": "^2.13.2",
"moment": "^2.27.0",
"nuxt": "^2.13.0",
"nuxt-i18n": "^6.13.1",
"vue-cookies": "^1.7.2"

38
pages/index/note.vue
Unescape View File

@ -1,11 +1,45 @@
<template>
<h1>笔记列表</h1>
<el-col :span="10">
<el-table :data="tableData" border>
<el-table-column align="center" prop="note_name" :label="$t('note.table.note_name')" />
<el-table-column align="center" prop="paper_name" :label="$t('note.table.paper_name')" />
<el-table-column align="center" :label="$t('action')">
<template slot-scope="scope">
<el-button>{{$t('button.edit')}}</el-button>
<el-button type="danger" @click="del">{{$t('button.del')}}</el-button>
</template>
</el-table-column>
</el-table>
<div class="block center mt1">
<el-pagination
layout="prev, pager, next"
:total="1000">
</el-pagination>
</div>
</el-col>
</template>
<script lang="ts">
import Vue from 'vue'
export default Vue.extend({
name: 'note'
name: 'note',
data(){
return {
tableData:[{
note_name:'笔记',
paper_name: '《论文》'
}]
}
},
methods:{
del(){
this.$confirm(this.$t('note.tip.confirm_del').toString(),this.$t('tip').toString(),{
confirmButtonText:this.$t('button.ok').toString(),
cancelButtonText:this.$t('button.cancel').toString()
})
}
}
})
</script>

6
pages/index/upload.vue
Unescape View File

@ -72,7 +72,7 @@
</el-form-item>
<el-form-item>
<el-button type="primary" @click="onSubmit">{{$t('submit')}}</el-button>
<el-button type="primary" @click="onSubmit">{{$t('button.submit')}}</el-button>
</el-form-item>
</el-form>
</template>
@ -140,11 +140,11 @@
},
//确认移除论文
beforeRemove(file: { name: string }, fileList: any) {
return this.$confirm(this.$t('upload.form.remove',{file:file.name}))
return this.$confirm(this.$t('upload.form.remove',{file:file.name}).toString())
},
//提交论文
onSubmit(){
this.$alert(this.$t('upload.tip.ok').toString())
}
}
})

4
plugins/moment.js
Unescape View File

@ -0,0 +1,4 @@
import Vue from 'vue'
import moment from 'moment'
Vue.prototype.$moment = moment

5
yarn.lock
Unescape View File

@ -6720,6 +6720,11 @@ mkdirp@^1.0.4:
resolved "https://registry.npm.taobao.org/mkdirp/download/mkdirp-1.0.4.tgz?cache=0&sync_timestamp=1587535418745&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmkdirp%2Fdownload%2Fmkdirp-1.0.4.tgz#3eb5ed62622756d79a5f0e2a221dfebad75c2f7e"
integrity sha1-PrXtYmInVteaXw4qIh3+utdcL34=
moment@^2.27.0:
version "2.27.0"
resolved "https://registry.npm.taobao.org/moment/download/moment-2.27.0.tgz?cache=0&sync_timestamp=1592517925956&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fmoment%2Fdownload%2Fmoment-2.27.0.tgz#8bff4e3e26a236220dfe3e36de756b6ebaa0105d"
integrity sha1-i/9OPiaiNiIN/j423nVrbrqgEF0=
move-concurrently@^1.0.1:
version "1.0.1"
resolved "https://registry.npm.taobao.org/move-concurrently/download/move-concurrently-1.0.1.tgz#be2c005fda32e0b29af1f05d7c4b33214c701f92"

Write Preview
Loading…
Cancel
Save