消息管理更新

src/views/pcenter/index.vue

@@ -71,7 +71,10 @@
                 <el-col :span="24" class="infoTop"> <span>|</span><span>需求管理</span> </el-col>
               </span>
               <span v-else-if="columnName == '信息管理'">
-                <el-col :span="24" class="infoTop"> <span>|</span><span>信息管理</span> </el-col>
+                <el-col :span="24" class="infoTop" style="margin-bottom:0;"> <span>|</span><span>信息管理</span> </el-col>
+                <el-col :span="24">
+                  <infoAdmin></infoAdmin>
+                </el-col>
               </span>
               <span v-else-if="columnName == '人员管理'">
                 <el-col :span="24" class="infoTop"> <span>|</span><span>人员管理</span> </el-col>
@@ -105,6 +108,8 @@
 <script>
 import top from '@/layout/common/top.vue';
 import foot from '@/layout/common/foot.vue';
+import infoAdmin from './parts/infoAdmin.vue';
+
 import pinfo from '@/views/pcenter/pinfo.vue';
 import uppasswd from '@/views/pcenter/uppasswd.vue';
 import { mapState, createNamespacedHelpers } from 'vuex';
@@ -115,6 +120,7 @@ export default {
   components: {
     top,
     foot,
+    infoAdmin, //信息管理
     pinfo,
     uppasswd,
   },

src/views/pcenter/parts/infoAdmin.vue

@@ -0,0 +1,160 @@
+<template>
+  <div id="infoAdmin">
+    <el-row>
+      <el-col :span="24" class="style">
+        <span v-if="display == 'list'">
+          <el-col :span="24" class="top">
+            <el-button type="primary" size="mini" @click="add">添加</el-button>
+          </el-col>
+          <el-col :span="24" class="list">
+            <el-table :data="list" stripe style="width: 100%" border>
+              <el-table-column prop="title" label="标题" align="center"> </el-table-column>
+              <el-table-column prop="publish_time" label="发布时间" align="center"> </el-table-column>
+              <el-table-column prop="publish_unit" label="发布单位" align="center"> </el-table-column>
+              <el-table-column prop="publisher" label="发布人" align="center"> </el-table-column>
+              <el-table-column label="状态" align="center">
+                <template slot-scope="scope">
+                  <span>{{ scope.row.status == '0' ? '草稿' : scope.row.status == '1' ? '审核中' : scope.row.status == '2' ? '审核通过' : '未识别' }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column label="操作" align="center">
+                <template slot-scope="">
+                  <el-button size="mini" type="primary">编辑</el-button>
+                  <el-button size="mini" type="success">发布</el-button>
+                  <el-button size="mini" type="danger">删除</el-button>
+                  <!-- <el-button size="mini" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
+                  <el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button> -->
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-col>
+        </span>
+        <span v-else>
+          <el-col :span="24" class="top">
+            <el-button type="primary" size="mini" @click="back">返回</el-button>
+          </el-col>
+          <el-col :span="24" class="form">
+            <el-form :model="form" :rules="rules" ref="form" label-width="100px" class="demo-ruleForm">
+              <el-form-item label="选择栏目" prop="col_name">
+                <el-select v-model="form.col_name" placeholder="请选择栏目">
+                  <el-option v-for="(item, index) in column_list" :key="index" :label="item.name" :value="item.name"></el-option>
+                </el-select>
+              </el-form-item>
+              <el-form-item label="信息标题" prop="name">
+                <el-input v-model="form.name" placeholder="请输入信息标题"></el-input>
+              </el-form-item>
+              <el-col :span="24" style="text-align:center;">
+                <el-button type="primary" @click="submitDraft('form')">保存草稿</el-button>
+                <el-button type="success" @click="submitForm('form')">发布信息</el-button>
+                <el-button type="danger" @click="resetForm('form')">取消</el-button>
+              </el-col>
+            </el-form>
+          </el-col>
+        </span>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import { mapState, createNamespacedHelpers } from 'vuex';
+export default {
+  name: 'infoAdmin',
+  props: {},
+  components: {},
+  data: function() {
+    return {
+      display: 'list',
+      // 列表
+      list: [],
+      // 选择栏目
+      column_list: [
+        { name: '科技资讯' },
+        { name: '技术前沿' },
+        { name: '工作动态' },
+        { name: '通知通告' },
+        { name: '平台建设' },
+        { name: '项目成果' },
+        { name: '知识产权' },
+        { name: '科技支撑' },
+        { name: '超算联盟' },
+        { name: '国家网格' },
+        { name: '教学中心' },
+        { name: '创业基地' },
+        { name: '软件中心' },
+        { name: '专题研讨' },
+        { name: '技术问答' },
+        { name: '行业研究' },
+        { name: '科技培训' },
+        { name: '图片新闻' },
+        { name: '党建工作' },
+        { name: '学习园地' },
+        { name: '党风廉政' },
+      ],
+      // 发布
+      form: {},
+      // 规则
+      rules: {
+        col_name: [{ required: true, message: '请选择栏目', trigger: 'blur' }],
+        name: [{ required: true, message: '请输入信息标题', trigger: 'blur' }],
+      },
+    };
+  },
+  created() {},
+  methods: {
+    // 添加
+    add() {
+      this.display = 'detail';
+    },
+    // 返回
+    back() {
+      this.display = 'list';
+    },
+    // 保存草稿
+    submitDraft(formName) {
+      this.$refs[formName].validate(valid => {
+        if (valid) {
+          alert(this.form);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    // 提交
+    submitForm(formName) {
+      this.$refs[formName].validate(valid => {
+        if (valid) {
+          alert(this.form);
+        } else {
+          console.log('error submit!!');
+          return false;
+        }
+      });
+    },
+    // 取消
+    resetForm(formName) {
+      this.$refs[formName].resetFields();
+    },
+  },
+  computed: {
+    ...mapState(['user']),
+    pageTitle() {
+      return `${this.$route.meta.title}`;
+    },
+  },
+  metaInfo() {
+    return { title: this.$route.meta.title };
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.style {
+  padding: 0 20px;
+  .top {
+    text-align: right;
+    padding: 10px 0;
+  }
+}
+</style>