文章新增预览

ZR.Vue/src/views/system/article/manager.vue

@@ -10,7 +10,7 @@
         </el-col>
         <el-col :span="6">
           <el-form-item label="文章状态" prop="status">
-            <el-select v-model="queryParams.status" size="small" >
+            <el-select v-model="queryParams.status" size="small">
               <el-option v-for="item in statusOptions" :key="item.dictValue" :label="item.dictLabel" :value="item.dictValue"></el-option>
             </el-select>
           </el-form-item>
@@ -39,15 +39,17 @@
       <el-table-column prop="content" label="文章内容" :show-overflow-tooltip="true"> </el-table-column>
       <el-table-column sortable prop="status" align="center" label="状态" width="90">
         <template slot-scope="scope">
-          <el-tag size="mini" :type="scope.row.status == '2' ? 'danger' : 'success'" disable-transitions>{{ scope.row.status == '2' ? "草稿":"已发布" }}</el-tag>
+          <el-tag size="mini" :type="scope.row.status == '2' ? 'danger' : 'success'" disable-transitions>{{ scope.row.status == '2' ? "草稿":"已发布" }}
+          </el-tag>
         </template>
       </el-table-column>
 
       <el-table-column prop="createTime" label="创建时间" width="128" :show-overflow-tooltip="true"> </el-table-column>
-      <el-table-column label="操作" align="center" width="160">
+      <el-table-column label="操作" align="center" width="190">
         <template slot-scope="scope">
-          <!-- <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button> -->
+          <el-button size="mini" type="text" icon="el-icon-view" @click="handleView(scope.row)">查看</el-button>
-          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:update']">编辑</el-button>
+          <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" v-hasPermi="['system:article:update']">编辑
+          </el-button>
           <el-popconfirm title="确定删除吗？" @onConfirm="handleDelete(scope.row)" style="margin-left:10px">
             <el-button slot="reference" size="mini" type="text" icon="el-icon-delete" v-hasPermi="['system:article:delete']">删除</el-button>
           </el-popconfirm>
@@ -59,10 +61,10 @@
   </div>
 </template>
 <script>
-import { listArticle, delArticle } from "@/api/system/article.js";
+import { listArticle, delArticle } from '@/api/system/article.js'
 
 export default {
-  name: "articleindex",
+  name: 'articleindex',
   data() {
     return {
       // 遮罩层
@@ -70,10 +72,9 @@ export default {
       // 显示搜索条件
       showSearch: true,
       // 查询参数
-      queryParams: {
+      queryParams: {},
-      },
       // 弹出层标题
-      title: "",
+      title: '',
       // 是否显示弹出层
       open: false,
       // 表单参数
@@ -86,56 +87,62 @@ export default {
       total: 0,
       // 提交按钮是否显示
       btnSubmitVisible: true,
-    };
+			// 文章预览地址
+			previewUrl: ''
+    }
   },
   created() {
-    this.getList();
+    this.getList()
-    this.getDicts("sys_article_status").then((response) => {
+    this.getDicts('sys_article_status').then((response) => {
-      this.statusOptions = response.data;
+      this.statusOptions = response.data
-    });
+    })
+
+    this.getConfigKey('sys.article.preview.url').then((response) => {
+      this.previewUrl = response.data
+    })
   },
   methods: {
     // 查询数据
     getList() {
       listArticle(this.queryParams).then((res) => {
         if (res.code == 200) {
-          this.dataList = res.data.result;
+          this.dataList = res.data.result
-          this.total = res.data.totalNum;
+          this.total = res.data.totalNum
         }
-      });
+      })
     },
     /** 重置查询操作 */
     resetQuery() {
-      this.resetForm("queryForm");
+      this.resetForm('queryForm')
     },
     /** 搜索按钮操作 */
     handleQuery() {
-      this.getList();
+      this.getList()
     },
     /** 新增按钮操作 */
     handleAdd() {
-      this.$router.replace({ path: "/article/publish" });
+      this.$router.replace({ path: '/article/publish' })
     },
     /** 删除按钮操作 */
     handleDelete(row) {
       delArticle(row.cid).then((res) => {
         if (res.code == 200) {
-          this.msgSuccess("删除成功");
+          this.msgSuccess('删除成功')
-          this.handleQuery();
+          this.handleQuery()
         }
-      });
+      })
     },
     /** 修改按钮操作 */
     handleUpdate(row) {
-      this.$router.push({ path: "/article/publish", query: { cid: row.cid } });
+      this.$router.push({ path: '/article/publish', query: { cid: row.cid }})
     },
     // 详情
     handleView(row) {
-      this.open = true;
+			var link = `${this.previewUrl}${row.cid}`
-      this.title = "详情";
+			window.open(link)
     },
     handleImport() {},
-    handleExport() {},
+    handleExport() {}
-  },
+  }
-};
+}
 </script>

document/admin-mysql.sql

@@ -679,8 +679,9 @@ insert into sys_config values(1, '主框架页-默认皮肤样式名称',     's
 insert into sys_config values(2, '用户管理-账号初始密码',         'sys.user.initPassword',         '123456',        'Y', 'admin', sysdate(), '', null, '初始化密码 123456' );
 insert into sys_config values(3, '主框架页-侧边栏主题',           'sys.index.sideTheme',           'theme-dark',    'Y', 'admin', sysdate(), '', null, '深色主题theme-dark，浅色主题theme-light' );
 insert into sys_config values(4, '账号自助-验证码开关',           'sys.account.captchaOnOff',      'true',          'Y', 'admin', sysdate(), '', null, '是否开启验证码功能（off、关闭，1、动态验证码 2、动态gif泡泡 3、泡泡 4、静态验证码）');
-INSERT INTO `sys_config`(`configId`, `configName`, `configKey`, `configValue`, `configType`, `create_by`, `create_time`, `update_by`, `update_time`, `remark`) VALUES (5, '本地文件上传访问域名', 'sys.file.uploadurl', 'http://localhost:8888', 'Y', '', '2022-04-10 10:11:27', '', NULL, NULL);
+INSERT INTO `sys_config`(`configId`, `configName`, `configKey`, `configValue`, `configType`, `create_by`, `create_time`, `update_by`, `update_time`, `remark`) VALUES (5, '本地文件上传访问域名', 'sys.file.uploadurl', 'http://localhost:8888', 'Y', '', sysdate(), '', NULL, NULL);
-INSERT INTO `sys_config`(`configId`, `configName`, `configKey`, `configValue`, `configType`, `create_by`, `create_time`, `update_by`, `update_time`, `remark`) VALUES (6, '开启注册功能', 'sys.account.register', 'true', 'Y', 'admin', '2022-04-14 00:00:00', 'admin', NULL, NULL);
+INSERT INTO `sys_config`(`configId`, `configName`, `configKey`, `configValue`, `configType`, `create_by`, `create_time`, `update_by`, `update_time`, `remark`) VALUES (6, '开启注册功能', 'sys.account.register', 'true', 'Y', 'admin', sysdate(), 'admin', NULL, NULL);
+INSERT INTO `sys_config`(`configId`, `configName`, `configKey`, `configValue`, `configType`, `create_by`, `create_time`, `update_by`, `update_time`, `remark`) VALUES (7, '文章预览地址', 'sys.article.preview.url', 'http://www.izhaorui.cn/article/details/', 'Y', 'admin', sysdate(), '', NULL, NULL);
 
 -- ----------------------------
 -- 18、代码生成业务表

document/admin-sqlserver.sql

@@ -699,6 +699,7 @@ insert into sys_config values('主框架页-侧边栏主题',           'sys.ind
 insert into sys_config values('账号自助-验证码开关',           'sys.account.captchaOnOff',      '1',          'Y', 'admin', GETDATE(), '', null, '开启验证码功能（off、关闭，1、动态验证码 2、动态gif泡泡 3、泡泡 4、静态验证码）');
 INSERT INTO sys_config VALUES('本地文件上传访问域名', 		   'sys.file.uploadurl', 			'http://localhost:8888', 'Y', 'admin', GETDATE(), '', NULL, NULL);
 INSERT INTO sys_config VALUES('开启注册功能', 		   		   'sys.account.register', 		 	'true', 		'Y', 'admin', GETDATE(), '', NULL, NULL);
+INSERT INTO sys_config VALUES('文章预览地址', 		   		   'sys.article.preview.url', 		 	'http://www.izhaorui.cn/article/details/', 		'Y', 'admin', GETDATE(), '', NULL, NULL);
 
 GO