1

src/router/index.js

@@ -30,6 +30,11 @@ export default new Router({
           component: () => import('../views/government/index.vue'),
           meta: { title: '科技政务' },
         },
+        {
+          path: '/government/detail',
+          component: () => import('../views/government/detail.vue'),
+          meta: { title: '科技政务信息管理' },
+        },
         {
           path: '/policy',
           component: () => import('../views/policy/index.vue'),

src/views/government/detail.vue

@@ -0,0 +1,148 @@
+<template>
+  <div id="detail">
+    <el-row>
+      <el-col :span="24" class="main">
+        <breadcrumb :breadcrumbTitle="this.$route.meta.title"></breadcrumb>
+        <el-col :span="24" class="container">
+          <el-col :span="24" class="add">
+            <el-button type="primary" size="mini" @click="back()">返回</el-button>
+          </el-col>
+          <el-col :span="24" v-if="loading">
+            <data-form :data="form" :fields="Fields" :rules="{}" @save="turnSave">
+              <template #options="{item}">
+                <template v-if="item.model == 'column_id'">
+                  <el-option v-for="(item, index) in columnList" :key="index" :label="item.name" :value="item.id"></el-option>
+                </template>
+              </template>
+              <template #custom="{item,form}">
+                <template v-if="item.model == 'picture'">
+                  <upload :limit="1" :data="form.picture" type="picture" :url="'/files/links/upload'" @upload="uploadSuccess"></upload>
+                </template>
+                <template v-else-if="item.model == 'content'">
+                  <wang-editor v-model="form.content" placeholder="请输入信息内容"></wang-editor>
+                </template>
+              </template>
+            </data-form>
+          </el-col>
+        </el-col>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import WangEditor from '@c/frame/wang-editor.vue';
+import upload from '@c/frame/uploadone.vue';
+import breadcrumb from '@c/common/breadcrumb.vue';
+import dataForm from '@c/frame/form.vue';
+import { mapState, createNamespacedHelpers } from 'vuex';
+const { mapActions: mapColumn } = createNamespacedHelpers('column');
+const { mapActions: mapNews } = createNamespacedHelpers('news');
+export default {
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+  name: 'detail',
+  props: {},
+  components: {
+    breadcrumb,
+    dataForm,
+    WangEditor,
+    upload,
+  },
+  data: function() {
+    return {
+      form: {},
+      Fields: [
+        { label: '信息标题', model: 'title' },
+        { label: '来源', model: 'orgin' },
+        { label: '所属栏目', model: 'column_id', type: 'select' },
+        { label: '信息图片', model: 'picture', custom: true },
+        { label: '信息内容', model: 'content', custom: true },
+      ],
+      loading: true,
+      // 栏目列表
+      columnList: [],
+    };
+  },
+  async created() {
+    await this.searchcol();
+    await this.search();
+  },
+  methods: {
+    ...mapColumn({ colquery: 'query' }),
+    ...mapNews({ newfetch: 'fetch', newcreate: 'create', newupdate: 'update' }),
+    // 查询详情
+    async search() {
+      if (this.id) {
+        this.loading = false;
+        const res = await this.newfetch(this.id);
+        if (this.$checkRes(res)) {
+          this.$set(this, `form`, res.data);
+        }
+        this.loading = true;
+      }
+    },
+    // 保存信息
+    async turnSave({ data }) {
+      if (data.id) {
+        const res = await this.newupdate(data);
+        if (this.$checkRes(res)) {
+          this.$message({
+            message: '修改成功',
+            type: 'success',
+          });
+          this.back();
+        } else {
+          this.$message({
+            message: res.errmsg,
+            type: 'error',
+          });
+        }
+      } else {
+        const res = await this.newcreate(data);
+        if (this.$checkRes(res)) {
+          this.$message({
+            message: '添加成功',
+            type: 'success',
+          });
+          this.back();
+        } else {
+          this.$message({
+            message: res.errmsg,
+            type: 'error',
+          });
+        }
+      }
+    },
+    // 返回
+    back() {
+      this.form = {};
+      this.$router.push({ path: '/government' });
+    },
+    // 查询栏目
+    async searchcol() {
+      let res = await this.colquery();
+      if (res.errcode == 0) {
+        this.$set(this, `columnList`, res.data);
+      }
+    },
+    // 上传图片
+    uploadSuccess({ type, data }) {
+      this.$set(this.form, `${type}`, data.uri);
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    id() {
+      return this.$route.query.id;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.add {
+  text-align: right;
+}
+</style>

src/views/government/index.vue

@@ -28,17 +28,26 @@
               信息列表
             </el-col>
             <el-col :span="18" class="btn">
-              <el-button type="primary" size="mini" @click="newdialog = true"><i class="el-icon-plus"></i></el-button>
+              <el-button type="primary" size="mini" @click="addnews()"><i class="el-icon-plus"></i></el-button>
             </el-col>
             <el-col :span="24">
-              <data-table :fields="newfields" :opera="newopera" :data="newslist" :total="total" @edit="newtoEdit" @delete="newtoDelete"></data-table>
+              <data-table
+                :fields="newfields"
+                :opera="newopera"
+                :data="newslist"
+                @query="searchnews"
+                :toFormat="toFormat"
+                :total="total"
+                @edit="newtoEdit"
+                @delete="newtoDelete"
+              ></data-table>
             </el-col>
           </el-col>
         </el-col>
       </el-col>
     </el-row>
     <el-dialog :visible.sync="coldialog" title="栏目" @close="coltoClose" width="30%">
-      <data-form :data="colform" :fields="turnBedRoomFields" :rules="{}" @save="turnSave">
+      <data-form :data="colform" :fields="colFields" :rules="{}" @save="turnSave">
         <template #options="{item}">
           <template v-if="item.model === 'site'">
             <el-option label="图片新闻" value="tpxw"></el-option>
@@ -97,7 +106,7 @@ export default {
       column: [],
       coldialog: false,
       colform: {},
-      turnBedRoomFields: [
+      colFields: [
         { label: '名称', model: 'name' },
         { label: '所在位置', model: 'site', type: 'select' },
       ],
@@ -115,16 +124,18 @@ export default {
         },
       ],
       newfields: [
-        { label: '名称', model: 'title' },
-        { label: '所属栏目', model: 'column_name' },
+        { label: '名称', prop: 'title', showTip: true },
+        { label: '信息来源', prop: 'orgin' },
+        { label: '所属栏目', prop: 'column_id', format: true },
       ],
       newslist: [],
       total: 0,
       column_id: '',
     };
   },
-  created() {
-    this.searchcolumn();
+  async created() {
+    await this.searchcolumn();
+    await this.searchnews();
   },
   methods: {
     ...mapColumn({ colquery: 'query', colfetch: 'fetch', coldelete: 'delete', colcreate: 'create', colupdate: 'update' }),
@@ -195,25 +206,39 @@ export default {
       this.$set(this, `column_id`, data.id);
       this.searchnews();
     },
+    // 查询信息
     async searchnews({ skip = 0, limit = 10 } = {}) {
       let res = await this.newquery({ skip, limit, column_id: this.column_id });
       if (this.$checkRes(res)) {
-        for (const val of res.data) {
-          let result = await this.colfetch(val.column_id);
-          val.column_name = result.data.name;
-        }
-        console.log(res.data);
         this.$set(this, `newslist`, res.data);
         this.$set(this, `total`, res.total);
       }
     },
+    // 过滤栏目
+    toFormat({ model, value }) {
+      if (model == 'column_id') {
+        const res = this.column.find(f => f.id == value);
+        if (res) return res.name;
+      }
+    },
+    // 添加信息
+    addnews() {
+      this.$router.push({ path: 'government/detail' });
+    },
     // 修改信息
     newtoEdit({ data }) {
-      console.log(data);
+      this.$router.push({ path: 'government/detail', query: { id: data.id } });
     },
     // 删除信息
-    newtoDelete({ data }) {
-      console.log(data);
+    async newtoDelete({ data }) {
+      const res = await this.newdelete(data.id);
+      if (this.$checkRes(res)) {
+        this.$message({
+          message: '刪除成功',
+          type: 'success',
+        });
+        this.searchnews();
+      }
     },
   },
   computed: {