Skip to content

Commit

Permalink
feat: remove babel
Browse files Browse the repository at this point in the history
  • Loading branch information
caoli committed Oct 30, 2018
1 parent 57b6e2e commit 58014af
Show file tree
Hide file tree
Showing 14 changed files with 164 additions and 176 deletions.
30 changes: 0 additions & 30 deletions .babelrc

This file was deleted.

34 changes: 21 additions & 13 deletions app/model/article.ts
Original file line number Diff line number Diff line change
Expand Up @@ -4,32 +4,40 @@ import { JsonProperty } from '@hubcarl/json-typescript-mapper';

export default class Article {
@JsonProperty('id')
public id: string;
public id?: string;
@JsonProperty('title')
public title: string | undefined;
public title?: string;
@JsonProperty('summary')
public summary: string | undefined;
public summary?: string;
@JsonProperty('categoryId')
public categoryId: number | undefined;
public categoryId?: number;
@JsonProperty('tag')
public tag: string | undefined;
public tag?: string ;
@JsonProperty('categoryId')
public authorId: number | undefined;
public authorId?: number;
@JsonProperty('createTime')
public createTime: number | undefined;
public createTime?: number;
@JsonProperty('hits')
public hits: number;
public hits?: number;
@JsonProperty('url')
public url: string | undefined;
public url?: string;
@JsonProperty('status')
public status: number | undefined;
public status?: number;
@JsonProperty('content')
public content?: string;

// constructor must be init everyone JsonProperty
constructor() {
this.id = '';
this.title = undefined;
this.summary = undefined;
this.tag = undefined;
this.title = '';
this.summary = '';
this.categoryId = -1;
this.tag = '';
this.authorId = -1;
this.url = '';
this.status = 0;
this.hits = 0;
this.content = '';
this.createTime = Date.now();
}
}
4 changes: 0 additions & 4 deletions app/model/artilcedetail.ts

This file was deleted.

53 changes: 53 additions & 0 deletions app/web/component/MarkdownEditor/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
import 'font-awesome/css/font-awesome.min.css';
import 'simplemde/dist/simplemde.min.css';
import SimpleMDE from 'simplemde';
import Vue from 'vue';
import { Component, Prop, Watch } from 'vue-property-decorator';

@Component({
name: 'simplemde-md'
})
export default class MarkDownEditor extends Vue {
@Prop(String) id;
@Prop({ type: Boolean, default: false }) autofocus;
@Prop({ type: String, default: '' }) placeholder;
@Prop({ type: Number, default: 400 }) height;
@Prop({ type: Number, default: 10 }) zIndex;
@Prop({ type: Array }) toolbar;

simplemde: SimpleMDE = null;
hasChange: boolean = false;

// @Watch
// value(val) {
// if (val === this.simplemde.value() && !this.hasChange) return
// this.simplemde.value(val);
// }
mounted() {
this.simplemde = new SimpleMDE({
element: document.getElementById(this.id || 'markdown-editor-' + +new Date()),
autoDownloadFontAwesome: false,
autofocus: this.autofocus,
toolbar: this.toolbar,
spellChecker: false,
insertTexts: {
link: ['[', ']( )']
},
// hideIcons: ['guide', 'heading', 'quote', 'image', 'preview', 'side-by-side', 'fullscreen'],
placeholder: this.placeholder
});
// if (this.value) {
// this.simplemde.value(this.value)
// }
this.simplemde.codemirror.on('change', () => {
if (this.hasChange) {
this.hasChange = true;
}
this.$emit('input', this.simplemde.value());
});
}
destroyed() {
this.simplemde.toTextArea();
this.simplemde = null;
}
}
74 changes: 1 addition & 73 deletions app/web/component/MarkdownEditor/index.vue
Original file line number Diff line number Diff line change
Expand Up @@ -5,79 +5,7 @@
</div>
</template>

<script>
import 'font-awesome/css/font-awesome.min.css'
import 'simplemde/dist/simplemde.min.css'
import SimpleMDE from 'simplemde'
export default {
name: 'simplemde-md',
props: {
value: String,
id: {
type: String
},
autofocus: {
type: Boolean,
default: false
},
placeholder: {
type: String,
default: ''
},
height: {
type: Number,
default: 400
},
zIndex: {
type: Number,
default: 10
},
toolbar: {
type: Array
}
},
data() {
return {
simplemde: null,
hasChange: false
}
},
watch: {
value(val) {
if (val === this.simplemde.value() && !this.hasChange) return
this.simplemde.value(val)
}
},
mounted() {
this.simplemde = new SimpleMDE({
element: document.getElementById(this.id || 'markdown-editor-' + +new Date()),
autoDownloadFontAwesome: false,
autofocus: this.autofocus,
toolbar: this.toolbar,
spellChecker: false,
insertTexts: {
link: ['[', ']( )']
},
// hideIcons: ['guide', 'heading', 'quote', 'image', 'preview', 'side-by-side', 'fullscreen'],
placeholder: this.placeholder
})
if (this.value) {
this.simplemde.value(this.value)
}
this.simplemde.codemirror.on('change', () => {
if (this.hasChange) {
this.hasChange = true
}
this.$emit('input', this.simplemde.value())
})
},
destroyed() {
this.simplemde.toTextArea()
this.simplemde = null
}
}
</script>
<script lang="ts" src="./index.ts"></script>

<style scoped>
.simplemde-container>>>.CodeMirror {
Expand Down
4 changes: 4 additions & 0 deletions app/web/page/admin/home/router/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ export default function createRouter() {
path: '/article/add',
component: () => import('../view/write/index.vue')
},
{
path: '/article/edit/:id',
component: () => import('../view/write/index.vue')
},
{
path: '/article/detail/:id',
component: () => import('../view/detail/index.vue')
Expand Down
3 changes: 3 additions & 0 deletions app/web/page/admin/home/view/detail/index.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,4 +14,7 @@ export default class Detail extends Vue {
const { id } = route.params;
return store.dispatch('getArticle', { id });
}
destroyed() {
this.$store.state.admin.article = null;
}
}
13 changes: 10 additions & 3 deletions app/web/page/admin/home/view/detail/index.vue
Original file line number Diff line number Diff line change
@@ -1,10 +1,17 @@
<template>
<div style="font-size: 24px; text-align: center" v-if="article">
<div class="content" v-if="article">
<h1>{{article.title}}</h1>
<iframe :src="article.url" frameborder="0" width="100%" height="600"></iframe>
<iframe v-if="article.url" :src="article.url" frameborder="0" width="100%" height="600"></iframe>
<div class="marktext" v-else v-html="article.content"></div>
</div>
</template>
<style>
.content {
font-size: 24px;
text-align: center
}
.content .marktext {
margin-top: 24px;
}
</style>
<script lang="ts" src="./index.ts"></script>
14 changes: 8 additions & 6 deletions app/web/page/admin/home/view/list/index.ts
Original file line number Diff line number Diff line change
@@ -1,10 +1,7 @@
import { Vue, Component, Emit } from 'vue-property-decorator';
import {
State,
Getter,
Action,
Mutation,
namespace
Action
} from 'vuex-class';

@Component
Expand Down Expand Up @@ -47,7 +44,11 @@ export default class List extends Vue {
}

write() {
this.$router.push('/article/add');
this.$router.push(`/article/add`);
}

edit(id) {
this.$router.push(`/article/edit/${id}`);
}

handleSelectionChange(val: number) {
Expand All @@ -67,7 +68,8 @@ export default class List extends Vue {
}

handleEdit(index: number, row: any) {
this.$message(`你点击了编辑操作 index:${index}, id:${row.id}`);
console.log(row);
this.edit(row.id);
}

handleDelete(index: number, row: any) {
Expand Down
55 changes: 55 additions & 0 deletions app/web/page/admin/home/view/write/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,55 @@
import Vue from 'vue';
import { Getter, Action } from 'vuex-class';
import { Component, Prop, Watch } from 'vue-property-decorator';
import Article from '../../../../../../model/article';

@Component({
components: {
MarkdownEditor: () => import('component/MarkdownEditor/index.vue')
}
})
export default class Write extends Vue {
@Getter('article') article?: Article;
@Action('saveArticle') saveArticle;
@Action('getArticle') getArticle;
text: string = '';

isShowEditor: boolean = false;

async submit(status) {
const showdown = await import('showdown');
const converter = new showdown.Converter();
const article = {
...this.article,
status,
content : converter.makeHtml(this.text),
};
const result = await this.saveArticle(article);
if (result.status === 200 ) {
this.$message(`添加成功`);
this.article = {};
} else {
this.$message(`添加失败: ${JSON.stringify(result)}`);
}
}

@Watch('article')
onArticleChanged(val: string, oldVal: string) {
if (this.article) {
// need html to markdown
this.text = this.article.content || '';
}
}

mounted() {
this.isShowEditor = true;
const { id } = this.$route.params;
if (id) {
this.getArticle({ id });
}
}

destroyed() {
this.$store.state.admin.article = {};
}
}
Loading

0 comments on commit 58014af

Please sign in to comment.