CRUD

4 years ago · 740d2b6226
15 changed files with 230 additions and 39 deletions
--- a/.gitignore
+++ b/.gitignore
@ -24,5 +24,4 @@ pnpm-debug.log*
				@@ -24,5 +24,4 @@ pnpm-debug.log*

 #LOOOO
 YuJian-Blog开发日志.md
-constant.js
 Test.http
--- a/Push时注意.md
+++ b/Push时注意.md
@ -0,0 +1,4 @@
				@@ -0,0 +1,4 @@
+# Git push 注意Server中的db/config.js文件
+
+## 敏感数据！！！！敏感数据！！！！敏感数据！！！！
+
--- a/README.md
+++ b/README.md
@ -3,4 +3,6 @@
				@@ -3,4 +3,6 @@
 ### 基于Vue和Express的全栈博客系统。

 - [x] 基础的博客前端搭建
- [ ] 基础的后端增删改查
+- [x] 基础的后端增删改查
+- [ ] 博客前端的数据获取
+- [ ] 实现富文本编辑
--- a/YuJian-Blog-Admin/src/api/article.js
+++ b/YuJian-Blog-Admin/src/api/article.js
@ -14,3 +14,18 @@ export function AddArticle(data) {
				@@ -14,3 +14,18 @@ export function AddArticle(data) {
    data
  });
 }
+
+export function DeleteArticle(id) {
+  return request({
+    url: `/article/list/${id}`,
+    method: "delete"
+  });
+}
+
+export function UpdataArticle(id, data) {
+  return request({
+    url: `/article/list/${id}`,
+    method: "put",
+    data
+  });
+}
--- a/YuJian-Blog-Admin/src/router/index.js
+++ b/YuJian-Blog-Admin/src/router/index.js
@ -46,10 +46,11 @@ export const constantRoutes = [
				@@ -46,10 +46,11 @@ export const constantRoutes = [
        meta: { title: 'ArticleCreate', icon: 'form' }
      },
      {
-        path: 'Edit',
+        path: ':id/Edit',
        name: 'ArticleEdit',
        component: () => import('@/views/Article/ArticleEdit'),
-        meta: { title: 'ArticleEdit', icon: 'edit' }
+        meta: { title: 'ArticleEdit', icon: 'edit' },
+        hidden: true
      }
    ]
  },
--- a/YuJian-Blog-Admin/src/views/Article/ArticleCreate.vue
+++ b/YuJian-Blog-Admin/src/views/Article/ArticleCreate.vue
@ -29,7 +29,17 @@ export default {
				@@ -29,7 +29,17 @@ export default {
  },
  methods: {
    createArticle() {
-      AddArticle(this.ArticleForm);
+      AddArticle(this.ArticleForm).then((res) => {
+        if (res.code === 0) {
+          this.$message({
+            message: res.msg,
+            type: "success",
+          });
+          this.$router.push("/Article/List");
+        } else {
+          this.$message.error(res.msg);
+        }
+      });
    },
  },
 };
--- a/YuJian-Blog-Admin/src/views/Article/ArticleEdit.vue
+++ b/YuJian-Blog-Admin/src/views/Article/ArticleEdit.vue
@ -1,9 +1,71 @@
				@@ -1,9 +1,71 @@
 <template>
-  <div>ArticleEdit</div>
+  <div class="CreateFather">
+    <el-form @submit.native.prevent="EditArticle" ref="form" :model="ArticleForm">
+      <el-form-item label="文章名称">
+        <el-input v-model="ArticleForm.title" class="ArticleTitleWidth"></el-input>
+      </el-form-item>
+      <el-form-item label="文章内容">
+        <el-input type="textarea" v-model="ArticleForm.content" style="width: 90%;"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" native-type="submit">保存修改</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
 </template>

 <script>
+import { mapGetters } from "vuex";
+import { UpdataArticle } from "@/api/article";
+
 export default {
-  name: 'ArticleEdit'
-}
+  name: "ArticleEdit",
+  data() {
+    return {
+      ArticleForm: {
+        title: "",
+        content: "",
+      },
+    };
+  },
+  computed: {
+    ...mapGetters(["article"]),
+  },
+  methods: {
+    fetchArticle() {
+      // console.log(this.$route.params.id);
+      this.ArticleForm.title = this.article[this.$route.params.id].title;
+      this.ArticleForm.content = this.article[this.$route.params.id].content;
+      // this.ArticleForm = this.article[this.$route.params.id];
+    },
+    EditArticle() {
+      UpdataArticle(
+        this.article[this.$route.params.id].id,
+        this.ArticleForm
+      ).then((res) => {
+        if (res.code === 0) {
+          this.$message({
+            message: res.msg,
+            type: "success",
+          });
+          this.$router.push("/Article/List");
+        } else {
+          this.$message.error(res.msg);
+        }
+      });
+    },
+  },
+  created() {
+    this.fetchArticle();
+  },
+};
 </script>
+<style scoped>
+.CreateFather {
+  margin: 30px 0px 0px 30px;
+  width: 100%;
+}
+.ArticleTitleWidth {
+  width: 500px;
+}
+</style>
--- a/YuJian-Blog-Admin/src/views/Article/ArticleList.vue
+++ b/YuJian-Blog-Admin/src/views/Article/ArticleList.vue
@ -2,7 +2,8 @@
				@@ -2,7 +2,8 @@
  <div class="ListFather">
    <el-table
      :data="ArticleData.filter(data => !search || data.title.toLowerCase().includes(search.toLowerCase()))"
-      style="width: 100%">
+      style="width: 100%"
+    >
      <el-table-column label="文章标题" prop="title"></el-table-column>
      <el-table-column label="文章作者" prop="author"></el-table-column>
      <el-table-column align="right">
@ -21,6 +22,7 @@
				@@ -21,6 +22,7 @@

 <script>
 import { mapGetters } from "vuex";
+import { DeleteArticle } from "@/api/article";

 export default {
  name: "ArticleList",
@ -34,18 +36,32 @@ export default {
				@@ -34,18 +36,32 @@ export default {
    ...mapGetters(["article"]),
  },
  methods: {
-
+    fetchArticle() {
+      this.$store.dispatch("article/getArticle").then(() => {
+        this.ArticleData = this.article;
+      });
+    },
    handleEdit(index, row) {
-      console.log(index, row);
+      // console.log(row.id);
+      this.$router.push(`/Article/${index}/Edit`);
    },
    handleDelete(index, row) {
-      console.log(index, row);
+      DeleteArticle(row.id).then((res) => {
+        if (res.code === 0) {
+          this.$message({
+            message: res.msg,
+            type: "success",
+          });
+          this.fetchArticle();
+        } else {
+          this.$message.error("文章修改失败");
+        }
+      });
+      // console.log(row.id);
    },
  },
  mounted() {
-    this.$store.dispatch("article/getArticle").then(() => {
-      this.ArticleData = this.article;
-    });
+    this.fetchArticle();
  },
 };
 </script>
--- a/YuJian-Blog-Server/Test.http
+++ b/YuJian-Blog-Server/Test.http
@ -1,9 +1,9 @@
				@@ -1,9 +1,9 @@
@url = http://127.0.0.1:5000/
 ###
-POST {{ url }}article/create
+put {{ url }}/article/list/10
 Content-Type: application/json

 {
-  "username": "sam",
-  "password": "123456"
+  "title": "sam",
+  "content": "123456"
 }
--- a/YuJian-Blog-Server/db/config.js
+++ b/YuJian-Blog-Server/db/config.js
@ -1,7 +0,0 @@
				@@ -1,7 +0,0 @@
-module.exports = {
-  host: "host",
-  port: "port",
-  user: "user",
-  password: "password",
-  database: "database000"
-}
--- a/YuJian-Blog-Server/package-lock.json
+++ b/YuJian-Blog-Server/package-lock.json
@ -14,9 +14,9 @@
				@@ -14,9 +14,9 @@
      }
    },
    "array-flatten": {
-      "version": "1.1.1",
-      "resolved": "https://registry.npm.taobao.org/array-flatten/download/array-flatten-1.1.1.tgz?cache=0&sync_timestamp=1574313384951&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Farray-flatten%2Fdownload%2Farray-flatten-1.1.1.tgz",
-      "integrity": "sha1-ml9pkFGx5wczKPKgCJaLZOopVdI="
+      "version": "2.1.1",
+      "resolved": "https://registry.npm.taobao.org/array-flatten/download/array-flatten-2.1.1.tgz?cache=0&sync_timestamp=1574313384951&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Farray-flatten%2Fdownload%2Farray-flatten-2.1.1.tgz",
+      "integrity": "sha1-Qmu52oQJDBg42BLIFQryCoMx4pY="
    },
    "async": {
      "version": "1.5.2",
@ -152,18 +152,18 @@
				@@ -152,18 +152,18 @@
      "integrity": "sha1-Qa4u62XvpiJorr/qg6x9eSmbCIc="
    },
    "express": {
-      "version": "4.17.1",
-      "resolved": "https://registry.npm.taobao.org/express/download/express-4.17.1.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fexpress%2Fdownload%2Fexpress-4.17.1.tgz",
-      "integrity": "sha1-RJH8OGBc9R+GKdOcK10Cb5ikwTQ=",
+      "version": "5.0.0-alpha.8",
+      "resolved": "https://registry.npm.taobao.org/express/download/express-5.0.0-alpha.8.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fexpress%2Fdownload%2Fexpress-5.0.0-alpha.8.tgz",
+      "integrity": "sha1-ud06Vo6reR4zkdtH+earkeYbE/4=",
      "requires": {
        "accepts": "~1.3.7",
-        "array-flatten": "1.1.1",
+        "array-flatten": "2.1.1",
        "body-parser": "1.19.0",
        "content-disposition": "0.5.3",
        "content-type": "~1.0.4",
        "cookie": "0.4.0",
        "cookie-signature": "1.0.6",
-        "debug": "2.6.9",
+        "debug": "3.1.0",
        "depd": "~1.1.2",
        "encodeurl": "~1.0.2",
        "escape-html": "~1.0.3",
@ -174,10 +174,11 @@
				@@ -174,10 +174,11 @@
        "methods": "~1.1.2",
        "on-finished": "~2.3.0",
        "parseurl": "~1.3.3",
-        "path-to-regexp": "0.1.7",
+        "path-is-absolute": "1.0.1",
        "proxy-addr": "~2.0.5",
        "qs": "6.7.0",
        "range-parser": "~1.2.1",
+        "router": "2.0.0-alpha.1",
        "safe-buffer": "5.1.2",
        "send": "0.17.1",
        "serve-static": "1.14.1",
@ -186,6 +187,16 @@
				@@ -186,6 +187,16 @@
        "type-is": "~1.6.18",
        "utils-merge": "1.0.1",
        "vary": "~1.1.2"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npm.taobao.org/debug/download/debug-3.1.0.tgz",
+          "integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        }
      }
    },
    "express-jwt": {
@ -437,6 +448,11 @@
				@@ -437,6 +448,11 @@
      "resolved": "https://registry.npm.taobao.org/parseurl/download/parseurl-1.3.3.tgz",
      "integrity": "sha1-naGee+6NEt/wUT7Vt2lXeTvC6NQ="
    },
+    "path-is-absolute": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npm.taobao.org/path-is-absolute/download/path-is-absolute-1.0.1.tgz",
+      "integrity": "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
+    },
    "path-to-regexp": {
      "version": "0.1.7",
      "resolved": "https://registry.npm.taobao.org/path-to-regexp/download/path-to-regexp-0.1.7.tgz",
@ -491,6 +507,35 @@
				@@ -491,6 +507,35 @@
        "util-deprecate": "~1.0.1"
      }
    },
+    "router": {
+      "version": "2.0.0-alpha.1",
+      "resolved": "https://registry.npm.taobao.org/router/download/router-2.0.0-alpha.1.tgz",
+      "integrity": "sha1-kYghO5ciFeA++DDgrHeDeHAIX20=",
+      "requires": {
+        "array-flatten": "2.1.1",
+        "debug": "3.1.0",
+        "methods": "~1.1.2",
+        "parseurl": "~1.3.2",
+        "path-to-regexp": "0.1.7",
+        "setprototypeof": "1.1.0",
+        "utils-merge": "1.0.1"
+      },
+      "dependencies": {
+        "debug": {
+          "version": "3.1.0",
+          "resolved": "https://registry.npm.taobao.org/debug/download/debug-3.1.0.tgz",
+          "integrity": "sha1-W7WgZyYotkFJVmuhaBnmFRjGcmE=",
+          "requires": {
+            "ms": "2.0.0"
+          }
+        },
+        "setprototypeof": {
+          "version": "1.1.0",
+          "resolved": "https://registry.npm.taobao.org/setprototypeof/download/setprototypeof-1.1.0.tgz",
+          "integrity": "sha1-0L2FU2iHtv58DYGMuWLZ2RxU5lY="
+        }
+      }
+    },
    "safe-buffer": {
      "version": "5.1.2",
      "resolved": "https://registry.npm.taobao.org/safe-buffer/download/safe-buffer-5.1.2.tgz",
--- a/YuJian-Blog-Server/package.json
+++ b/YuJian-Blog-Server/package.json
@ -14,7 +14,7 @@
				@@ -14,7 +14,7 @@
    "boom": "^7.3.0",
    "cors": "^2.8.5",
    "crypto": "^1.0.1",
-    "express": "^4.17.1",
+    "express": "^5.0.0-alpha.8",
    "express-jwt": "^5.3.3",
    "express-validator": "^6.5.0",
    "jsonwebtoken": "^8.5.1",
--- a/YuJian-Blog-Server/router/article.js
+++ b/YuJian-Blog-Server/router/article.js
@ -1,5 +1,10 @@
				@@ -1,5 +1,10 @@
 const express = require("express");
-const { GetArticleList, AddArticle } = require("../service/article");
+const {
+  GetArticleList,
+  AddArticle,
+  DeleteArticle,
+  UpdataArticle,
+} = require("../service/article");
 const Result = require("../models/Result");

 const router = express.Router();
@ -28,4 +33,22 @@ router.post("/create", async (req, res) => {
				@@ -28,4 +33,22 @@ router.post("/create", async (req, res) => {
  }
 });

+router.delete("/list/:id", async (req, res) => {
+  await DeleteArticle(req.params.id).then(() => {
+    new Result("文章删除成功").success(res);
+  });
+});
+
+router.put("/list/:id", async (req, res) => {
+  await UpdataArticle(req.params.id, req.body.title, req.body.content).then(
+    (response) => {
+      if (!response.errno) {
+        new Result("文章更新成功").success(res);
+      } else {
+        new Result("文章更新失败").fail(res);
+      }
+    }
+  );
+});
+
 module.exports = router;
--- a/YuJian-Blog-Server/service/article.js
+++ b/YuJian-Blog-Server/service/article.js
@ -5,12 +5,24 @@ function GetArticleList() {
				@@ -5,12 +5,24 @@ function GetArticleList() {
  return querySql(sql);
 }

-function AddArticle(title, content, author){
-  const sql = `INSERT INTO admin_article VALUES (NULL, '${title}', '${content}', 'YuJian', NULL);`
+function AddArticle(title, content, author) {
+  const sql = `INSERT INTO admin_article VALUES (NULL, '${title}', '${content}', 'YuJian', NULL);`;
+  return querySql(sql);
+}
+
+function DeleteArticle(id) {
+  const sql = `DELETE FROM admin_article WHERE admin_article.id = ${id}`;
+  return querySql(sql);
+}
+
+function UpdataArticle(id, title, content) {
+  const sql = `UPDATE admin_article SET title = '${title}', content = '${content}' WHERE admin_article.id = ${id};`;
  return querySql(sql);
 }

 module.exports = {
  GetArticleList,
-  AddArticle
+  AddArticle,
+  DeleteArticle,
+  UpdataArticle
 };
--- a/YuJian-Blog-Server/utils/constant.js
+++ b/YuJian-Blog-Server/utils/constant.js
@ -0,0 +1,9 @@
				@@ -0,0 +1,9 @@
+module.exports = {
+  CODE_SUCCESS: 0,
+  CODE_ERROR: -1,
+  CODE_TOKEN_EXPIRED: -2,
+  DebugMode: 1,
+  PWD_SALT: "PWD_SALT",
+  PRIVATE_KEY: "PRIVATE_KEY",
+  JWT_EXPIRED: 60 * 60,
+};