更新

src/api/device/yxw.js

@@ -2,18 +2,18 @@ import request from '@/utils/request'
 
 // 分页
 export function getYxwPage(data) {
-    return request({
-        url: `/device/yunxiaowei/pageList`,
-        method: 'post',
-        data: data
-    })
+  return request({
+    url: `/device/yunxiaowei/pageList`,
+    method: 'post',
+    data: data
+  })
 }
 
 // 新增设备号
-export function getYxwAdd(data){
-    return request({
-        url: `/device/yunxiaowei/add`,
-        method: 'post',
-        data: data
-    })
-}
+export function getYxwAdd(data) {
+  return request({
+    url: `/device/yunxiaowei/add`,
+    method: 'post',
+    data: data
+  })
+}

src/api/music/blog.js

@@ -1,6 +1,6 @@
 import request from '@/utils/request'
 
-// 分页
+// 播客分页
 export function getPage(query) {
   return request({
     url: `/podcast/page`,
@@ -17,3 +17,12 @@ export function getCategories(query) {
     params: query
   })
 }
+
+// 播客节目分页
+export function getProgrammePage(query){
+  return request({
+    url: `/podcast/programme/page`,
+    method: 'get',
+    params: query
+  })
+}

src/api/project/list.js

@@ -0,0 +1,28 @@
+import request from '@/utils/request'
+
+// 分页
+export function page(query) {
+  return request({
+    url: `/project/page`,
+    method: 'get',
+    params: query
+  })
+}
+
+// 新增
+export function add(data) {
+  return request({
+    url: `/project/add`,
+    method: 'post',
+    data: data
+  })
+}
+
+// 编辑
+export function edit(data) {
+  return request({
+    url: `/project/edit`,
+    method: 'post',
+    data: data
+  })
+}

src/components/Upload/index.vue

@@ -1,7 +1,8 @@
 <template>
   <div>
-    <el-upload v-if="type === 'file' ? true : hideUpload" :action="action" :headers="headers" :data="data" :show-file-list="false"
-      :list-type="type === 'file' ? '':'picture-card'" :before-upload="beforeUpload" :on-success="onSuccess">
+    <el-upload v-if="type === 'file' ? true : hideUpload" :action="action" :headers="headers" :data="data"
+      :show-file-list="false" :list-type="type === 'file' ? '':'picture-card'" :before-upload="beforeUpload"
+      :on-success="onSuccess" :on-change="handleChange">
       <el-button v-if="type === 'file'" type="primary" style="margin:0">上传文件</el-button>
       <i v-else slot="default" class="el-icon-plus" />
     </el-upload>
@@ -30,19 +31,20 @@ export default {
     // 隐藏删除按钮
     disabled: {
       type: Boolean,
-      default: true
+      default: false
     }
   },
   data() {
     return {
       // 额外参数
       data: {
-        multipartFile: ''
+        multipartFile: ""
       },
       // 请求头
-      headers: { Authorization: "Bearer " + getToken() },
+      headers: {
+        Authorization: "Bearer " + getToken()},
       // 上传地址
-      action: process.env.VUE_APP_BASE_API + "/system/file/picture/upload",
+      action: '',
       // 隐藏上传按钮
       hideUpload: true,
       // 图片
@@ -62,8 +64,15 @@ export default {
       this.newUrl = this.url
       this.hideUpload = false
     }
+
+    this.action = this.type === 'image' ?
+      `${process.env.VUE_APP_BASE_API}/system/file/picture/upload` :
+      `${process.env.VUE_APP_BASE_API}/system/file/file/upload`
   },
   methods: {
+    handleChange(file) {
+      console.log(file);
+    },
     // 上传服务器之前提交文件
     beforeUpload(file) {
       this.data.multipartFile = file

src/router/index.js

@@ -311,6 +311,23 @@ export const dynamicRoutes = [{
         activeMenu: '/channel/official'
       }
     }]
+  },
+  // 项目管理
+  // 项目列表
+  {
+    path: '/project',
+    component: Layout,
+    hidden: true,
+    permissions: ['project:list:list'],
+    children: [{
+      path: 'list/detail',
+      component: () => import('@/views/project/list/detail'),
+      name: 'detail',
+      meta: {
+        title: `详情页`,
+        activeMenu: '/project/list'
+      }
+    }]
   }
 ]
 

src/views/device/init/detail.vue

@@ -0,0 +1,74 @@
+<template>
+  <div class="app-container">
+    <el-form label-width="100px" size="small">
+      <!-- 宣传位新增 -->
+      <div v-if="isShow === 'first'">
+        <el-form-item label="展示类型：">
+          <el-select v-model="form.type" placeholder="请选择展示类型" />
+        </el-form-item>
+        <el-form-item label="图片/视频：">
+          <el-upload class="avatar-uploader" :multiple="false" :show-file-list="false" action="">
+            <el-image v-if="form.img" :src="form.img" class="avatar" />
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+      </div>
+      <!-- 商品管理新增 -->
+      <div v-else>
+        <el-form-item label="商品名称：">
+          <el-input v-model="form.name" placeholder="请输入商品名称" />
+        </el-form-item>
+        <el-form-item label="网址：">
+          <el-input v-model="form.url" placeholder="请输入网址" />
+        </el-form-item>
+        <el-form-item label="图片/视频：">
+          <el-upload class="avatar-uploader" :multiple="false" :show-file-list="false" action="">
+            <el-image v-if="form.img" :src="form.img" class="avatar" />
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload>
+        </el-form-item>
+        <el-form-item label="上线时间：">
+          <el-date-picker v-model="form.onlineTime" type="datetimerange" start-placeholder="开始日期" end-placeholder="结束日期" />
+        </el-form-item>
+      </div>
+      <!-- 按钮 -->
+      <el-form-item>
+        <el-button @click="getCancel">取消</el-button>
+        <el-button type="primary" @click="getSubmit">提交</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      isShow: '',
+      form: {}
+    }
+  },
+  mounted() {
+    this.isShow = this.$route.query.active
+  },
+  methods: {
+    // 取消
+    getCancel() {
+      this.$message.info('已取消！')
+      this.$tab.closeOpenPage('/device/init')
+    },
+
+    // 提交
+    getSubmit() {
+      this.$message.success('提交成功！')
+      this.$tab.closeOpenPage('/device/init')
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-form {
+  width: 500px;
+}
+</style>

src/views/device/init/index.vue

@@ -0,0 +1,190 @@
+<template>
+  <div class="app-container">
+    <el-tabs v-model="tabActive">
+      <!-- 宣传位管理页 -->
+      <el-tab-pane label="宣传位管理" name="first">
+        <!-- 搜索 -->
+        <el-form inline label-width="100px" size="mini">
+          <el-form-item label="展示类型：">
+            <el-select v-model="searchFrom.type" clearable />
+          </el-form-item>
+          <el-form-item label="创建时间：">
+            <el-date-picker v-model="searchFrom.date" type="date" placeholder="选择创建时间" clearable />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search">搜索</el-button>
+            <el-button icon="el-icon-plus" @click="getDetail">新增</el-button>
+          </el-form-item>
+        </el-form>
+        <!-- 表格 -->
+        <el-table :data="tableData.first" v-loading="loading">
+          <el-table-column label="ID" prop="id" align="center" />
+          <el-table-column label="宣传图" align="center">
+            <template slot-scope="scope">
+              <el-image :src="scope.row.img" :preview-src-list="[scope.row.img]" />
+            </template>
+          </el-table-column>
+          <el-table-column label="展示类型" prop="type" align="center" />
+          <el-table-column label="展示状态" align="center">
+            <template slot-scope="scope">
+              <span>{{ state.first[scope.row.state] }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="创建时间" prop="createDate" align="center" />
+          <el-table-column label="操作" align="center">
+            <template slot-scope="scope">
+              <el-button v-if="scope.row.state === 0" type="text" @click="getChange(scope.row)">停用</el-button>
+              <div v-else>
+                <el-button type="text" @click="getChange(scope.row)">启用</el-button>
+                <el-button type="delete" @click="getDelete">删除</el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+
+      <!-- 商品管理页 -->
+      <el-tab-pane label="商品管理" name="second">
+        <!-- 搜索表单 -->
+        <el-form inline label-width="100px" size="mini">
+          <el-form-item label="商品名称：">
+            <el-select v-model="searchFrom.name" clearable />
+          </el-form-item>
+          <el-form-item label="展示状态：">
+            <el-select v-model="searchFrom.state" clearable />
+          </el-form-item>
+          <el-form-item>
+            <el-button type="primary" icon="el-icon-search">搜索</el-button>
+            <el-button icon="el-icon-plus" @click="getDetail">新增</el-button>
+          </el-form-item>
+        </el-form>
+        <!-- 表格 -->
+        <el-table :data="tableData.second" v-loading="loading">
+          <el-table-column label="ID" prop="id" align="center" />
+          <el-table-column label="商品名称" prop="name" align="center" />
+          <el-table-column label="商品图" align="center">
+            <template slot-scope="scope">
+              <el-image :src="scope.row.img" :preview-src-list="[scope.row.img]" />
+            </template>
+          </el-table-column>
+          <el-table-column label="网址" align="center" show-overflow-tooltip>
+            <template slot-scope="scope">
+              <el-link :href="scope.row.url" :underline="false">{{ scope.row.url }}</el-link>
+            </template>
+          </el-table-column>
+          <el-table-column label="展示状态" align="center">
+            <template slot-scope="scope">
+              <span>{{ state.second[scope.row.state] }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="上线时间" prop="onlineTime" align="center" show-overflow-tooltip />
+          <el-table-column label="创建时间" prop="createDate" align="center" />
+          <el-table-column label="操作" align="center">
+            <template slot-scope="scope">
+              <div v-if="scope.row.state === 1">
+                <el-button type="text" @click="getDetail(scope.row.id)">编辑</el-button>
+                <el-button type="text">上线</el-button>
+                <el-button type="delete">删除</el-button>
+              </div>
+              <div v-else>
+                <el-button type="text">下线</el-button>
+                <el-button v-if="scope.row.top" type="text">取消置顶</el-button>
+                <el-button v-else type="text">置顶</el-button>
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-tab-pane>
+    </el-tabs>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      // 遮罩层
+      loading: true,
+      // 选中的标签页
+      tabActive: 'first',
+      // 表格数据
+      tableData: {
+        'first': [{
+          id: 419448339824642,
+          img: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+          type: '图片',
+          state: 1,
+          createDate: '2020-09-14 15:27:15'
+        }],
+        'second': [{
+          id: 429999083749378,
+          name: '原子唱机',
+          img: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
+          url: 'https://item.m.jd.com/product/100002126446.html',
+          state: 1,
+          top: true,
+          onlineTime: ['2021-12-24 11:24:24', '2023-01-04 11:24:24'],
+          createDate: '2021-12-24 11:25:29'
+        }]
+      },
+      // 展示状态
+      state: {
+        'first': {
+          0: '已启用',
+          1: '已停用',
+        },
+        'second': {
+          0: '已上线',
+          1: '已下线'
+        }
+      },
+      // 搜索表单
+      searchFrom: {
+        type: '',
+        date: '',
+        name: '',
+        state: ''
+      }
+    }
+  },
+  mounted() {
+    this.loading = false
+    this.getList()
+  },
+  methods: {
+    // 新增 / 编辑
+    getDetail(id){
+      this.$router.push({
+        path: `/device/init/detail`,
+        query:{
+          id: id,
+          active: this.tabActive
+        }
+      })
+    },
+    // 启用 / 停用
+    getChange(row) {
+      const title = row.state == 0 ? '停用' : '启用'
+      this.$confirm(`确定要${title}?`, {
+        type: 'warning'
+      }).then(() => {
+
+      }).catch(() => { })
+    },
+    // 删除
+    getDelete() {
+      this.$confirm('确定要删除?', {
+        type: 'warning'
+      }).then(() => {
+
+      }).catch(() => { })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.el-image {
+  width: 120px;
+}
+</style>

src/views/device/list/mixin/index.js

@@ -0,0 +1,19 @@
+const mixin = {
+  data() {
+    return {
+      // 使用分类列表
+      deviceTypeOptions: [{
+        value: 0,
+        label: '音响'
+      }, {
+        value: 1,
+        label: '耳机'
+      }, {
+        value: 3,
+        label: '穿戴'
+      }],
+    }
+  }
+}
+
+export default mixin

src/views/device/pages/index.vue

@@ -0,0 +1,31 @@
+<template>
+  <div class="app-container">
+    <el-form>
+      <el-form-item>
+        <el-button icon="el-icon-plus">新增分类</el-button>
+      </el-form-item>
+    </el-form>
+
+    <el-table>
+      <el-table-column label="ID" align="center" />
+      <el-table-column label="名称" align="center" />
+      <el-table-column label="操作">
+        <template>
+          <el-button type="text">编辑</el-button>
+          <el-button type="text">关联设备</el-button>
+          <el-button type="delete">删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+  </div>
+</template>
+
+<script>
+export default {
+  
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/views/music/blog/detail.vue

@@ -1,119 +1,161 @@
 <template>
   <div class="app-container">
     <el-form label-width="100px" size="small">
-      <div>
-        <el-row>
-          <el-col :span="12">
-            <el-form-item label="播客封面：">
-              <imageUpload />
-            </el-form-item>
-          </el-col>
-          <el-col :span="12">
-            <el-form-item label="播客名称：">
-              <el-input placeholder="请输入播客名称" />
-            </el-form-item>
-            <el-form-item label="播客分类：">
-              <el-select placeholder="请选择播客分类">
-                <el-option />
-              </el-select>
-            </el-form-item>
-            <el-form-item label="资源平台：">
-              <el-input disabled />
-            </el-form-item>
-          </el-col>
-        </el-row>
-        <el-form-item label="音乐简介：">
-          <el-input type="textarea" rows="4" placeholder="请输入音乐简介" />
-        </el-form-item>
-        <el-form-item label="付费类型：">
-          <el-select placeholder="请选择付费类型">
-            <el-option />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="原价：">
-          <el-input placeholder="请输入原价" />
-        </el-form-item>
-        <el-form-item label="折扣价：">
-          <el-input placeholder="请输入折扣价" />
-        </el-form-item>
-        <el-form-item label="标签分类：">
-          <el-select placeholder="请选择标签分类">
-            <el-option />
-          </el-select>
-        </el-form-item>
-        <el-form-item label="关联节目：">
-          <el-button type="primary" @click="dialogVisible = true">关联</el-button>
-          <el-button disabled>解除关联</el-button>
-          <el-table>
-            <el-table-column label="ID" align="center"></el-table-column>
-            <el-table-column label="节目名称" align="center"></el-table-column>
-            <el-table-column label="当前状态" align="center"></el-table-column>
-            <el-table-column label="操作" align="center">
-              <template>
-                <el-button>解除关联</el-button>
-              </template>
-            </el-table-column>
-          </el-table>
-        </el-form-item>
-        <el-form-item>
-          <el-button @click="getCancel">取消</el-button>
-          <el-button type="primary" @click="getSubmit">提交</el-button>
-        </el-form-item>
-      </div>
+      <!-- <el-row>
+        <el-col :span="12">
+          <el-form-item label="播客封面：">
+            <imageUpload />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="播客名称：">
+            <el-input placeholder="请输入播客名称" />
+          </el-form-item>
+          <el-form-item label="播客分类：">
+            <el-select placeholder="请选择播客分类">
+              <el-option />
+            </el-select>
+          </el-form-item>
+          <el-form-item label="资源平台：">
+            <el-input disabled />
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="音乐简介：">
+        <el-input type="textarea" rows="4" placeholder="请输入音乐简介" />
+      </el-form-item>
+      <el-form-item label="付费类型：">
+        <el-select placeholder="请选择付费类型">
+          <el-option />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="原价：">
+        <el-input placeholder="请输入原价" />
+      </el-form-item>
+      <el-form-item label="折扣价：">
+        <el-input placeholder="请输入折扣价" />
+      </el-form-item>
+      <el-form-item label="标签分类：">
+        <el-select placeholder="请选择标签分类">
+          <el-option />
+        </el-select>
+      </el-form-item> -->
+      <el-form-item label="关联节目：" style="width: 1000px">
+        <el-button type="primary" @click="getPage">关联</el-button>
+        <el-button @click="getDelete">解除关联</el-button>
+        <el-table :data="tableData1" height="229px" @selection-change="selectionChange">
+          <el-table-column type="selection" align="center" />
+          <el-table-column prop="id" label="节目ID" align="center" width="150px" />
+          <el-table-column prop="name" label="节目名称" align="center" show-overflow-tooltip />
+          <el-table-column prop="platformId" label="资源平台" align="center" width="100px" />
+          <el-table-column prop="status" label="当前状态" align="center" width="100px"
+            :formatter="statusFormatter" />
+        </el-table>
+      </el-form-item>
+      <el-form-item>
+        <el-button @click="getCancel">取消</el-button>
+        <el-button type="primary" @click="getSubmit">提交</el-button>
+      </el-form-item>
     </el-form>
 
     <!-- 关联弹窗 -->
     <el-dialog :visible.sync="dialogVisible" title="关联节目" width="1000px">
-      <el-form inline size="mini">
+      <el-form :model="form2" inline size="mini">
         <el-form-item label="ID：">
-          <el-input placeholder="请输入节目ID" />
+          <el-input v-model="form2.id" placeholder="请输入节目ID" />
         </el-form-item>
         <el-form-item label="节目名称：">
-          <el-input placeholder="请输入节目名称" />
+          <el-input v-model="form2.name" placeholder="请输入节目名称" />
         </el-form-item>
         <el-form-item>
           <el-button icon="el-icon-search" type="primary">搜索</el-button>
         </el-form-item>
       </el-form>
-      <el-table>
-        <el-table-column type="selection" />
-        <el-table-column label="ID" align="center" />
-        <el-table-column label="节目名称" align="center" />
-        <el-table-column label="当前状态" align="center" />
+      <el-table :data="tableData2" v-loading="loading" :row-key="getRowKey"
+        @selection-change="handleSelectionChange" @toggleRowSelection="handleToggleRowSelection">
+        <el-table-column type="selection" reserve-selection align="center" />
+        <el-table-column prop="id" label="节目ID" align="center" width="150px"/>
+        <el-table-column prop="name" label="节目名称" align="center" show-overflow-tooltip/>
+        <el-table-column prop="platformId" label="资源平台" align="center" width="100px"/>
+        <el-table-column prop="status" label="当前状态" align="center" width="100px" :formatter="statusFormatter" />
       </el-table>
-      <!-- <pagination
-        v-show="total>0"
-        :total="total"
-        :page.sync="form.pageNum"
-        :limit.sync="form.pageSize"
-        @pagination="getList"
-      />-->
-      <div slot="footer">
-        <el-button>取消</el-button>
-        <el-button type="primary">关联</el-button>
-      </div>
+      <pagination v-show="total>0" :total="total" :page.sync="form2.pageNum" :limit.sync="form2.pageSize"
+        @pagination="getPage" />
     </el-dialog>
   </div>
 </template>
 
 <script>
+import { getProgrammePage } from '@/api/music/blog'
+import { statusMixin } from '../mixin/index'
 import imageUpload from "@/components/Upload/index";
 export default {
+  mixins: [statusMixin],
   components: {
     imageUpload,
   },
   data() {
     return {
-      //   弹窗
+      // 遮罩层
+      loading: true,
+      // 表单
+      form2: {
+        pageNum: 1,
+        pageSize: 10
+      },
+      // 弹窗
       dialogVisible: false,
+      // 列表
+      tableData1: [],
+      tableData2: [],
+      total: 0,
+      // 解除关联
+      delete_list: []
     };
   },
   methods: {
+    // 关联
+    getPage() {
+      this.loading = true
+      this.dialogVisible = true,
+        getProgrammePage(this.form2).then(res => {
+          if (res.code === 0) {
+            console.log(res.data);
+            this.tableData2 = res.data.records
+            this.total = res.data.total
+            this.loading = false
+          }
+        })
+    },
+
+    // 多选
+    handleSelectionChange(e) {
+      this.tableData1 = e;
+    },
+    getRowKey(row) {
+      return row.id;
+    },
+    selectionChange(e) {
+      this.delete_list = e
+    },
+    // 解除关联
+    getDelete() {
+      this.delete_list.map(i => {
+        let index = this.tableData1.findIndex(j => j.id === i.id)
+        this.tableData1.splice(index, 1)
+        this.tableData2
+      })
+    },
+
     getCancel() {
       this.$tab.closeOpenPage("/music/blog");
-      this.$refs.form.resetFields();
     },
-    getSubmit() {},
+    getSubmit() { },
+
+    // 字典翻译
+    statusFormatter(row) {
+      return this.selectDictLabel(this.statusOptions, row.status)
+    }
   },
 };
 </script>

src/views/music/mixin/index.js

@@ -0,0 +1,32 @@
+const statusMixin = {
+  data() {
+    return {
+      statusOptions: [{
+        value: 1,
+        label: '正常'
+      }, {
+        value: 2,
+        label: '下架'
+      }]
+    }
+  }
+}
+
+const chargingMixin = {
+  data(){
+    return{ 
+      chargingOptions: [{
+        value: 1,
+        label: '免费'
+      },{
+        value: 2,
+        label: '收费'
+      }]
+    }
+  }
+}
+
+export {
+  statusMixin,
+  chargingMixin
+}

src/views/project/list/detail.vue

@@ -0,0 +1,211 @@
+<template>
+  <div class="app-container">
+    <el-form class="form" :model="form_create" label-width="100px" size="small">
+      <el-form-item label="项目名称：">
+        <el-input v-model="form_create.name" placeholder="请输入项目名称"></el-input>
+      </el-form-item>
+      <el-form-item label="图标：">
+        <Upload :url="form_create.pic" @success="getUpload" @delete="getUpload" />
+        <span style="fontSize:12px; color:#909399">图片规格为256*256，大小在1MB以内的PNG图片</span>
+      </el-form-item>
+      <el-form-item v-if="this.$route.query.key === 'edit'" label="版本管理：" style="width:1000px">
+        <el-button type="primary" icon="el-icon-plus" @click="dialogVisible_create = true">新增</el-button>
+        <el-table :data="tableData_version">
+          <el-table-column type="index" label="序号" align="center" />
+          <el-table-column label="应用名称" align="center" />
+          <el-table-column label="最新版本" align="center" />
+          <el-table-column label="更新内容" align="center" />
+          <el-table-column label="系统类型" align="center" />
+          <el-table-column label="更新时间" align="center" />
+          <el-table-column label="当前状态" align="center" />
+          <el-table-column label="操作" align="center">
+            <template slot-scope="scope">
+              <!-- <el-button type="text">上架</el-button>
+              <el-button type="text">下架</el-button> -->
+              <el-button type="text">发布</el-button>
+              <el-button type="text" @click="dialogVisible_update = true">更新</el-button>
+              <el-dropdown @command="getCommand" style="margin-left: 10px">
+                <el-button type="text">更多</el-button>
+                <el-dropdown-menu slot="dropdown">
+                  <el-dropdown-item command="edit">编辑</el-dropdown-item>
+                  <el-dropdown-item command="copy">复制下载地址</el-dropdown-item>
+                  <el-dropdown-item command="history">查看版本记录</el-dropdown-item>
+                </el-dropdown-menu>
+              </el-dropdown>
+            </template>
+          </el-table-column>
+        </el-table>
+      </el-form-item>
+    </el-form>
+    <div class="form-btn">
+      <el-button size="small" @click="getCancel">取消</el-button>
+      <el-button type="primary" size="small" @click="getSubmit">确定</el-button>
+    </div>
+    <!-- 新增 -->
+    <el-dialog :visible.sync="dialogVisible_create" title="新增" width="500px">
+      <el-form label-width="100px">
+        <el-form-item label="应用名称：">
+          <el-input placeholder="请输入应用名称" />
+        </el-form-item>
+        <el-form-item label="系统类别：">
+          <el-select placeholder="请选择系统类别">
+            <el-option />
+          </el-select>
+        </el-form-item>
+        <el-form-item label="应用Logo：">
+          <Upload />
+        </el-form-item>
+        <el-form-item label="版本号：">
+          <el-input placeholder="请输入版本号" />
+        </el-form-item>
+        <el-form-item label="更新内容：">
+          <el-input type="textarea" rows="4" placeholder="请输入更新内容" />
+        </el-form-item>
+        <el-form-item label="安装包：">
+          <Upload type="file" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button>取消</el-button>
+        <el-button type="primary">确定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 更新版本 -->
+    <el-dialog :visible.sync="dialogVisible_update" title="更新版本" width="500px">
+      <el-form label-width="100px">
+        <el-form-item label="版本号：">
+          <el-input placeholder="请输入版本号" />
+        </el-form-item>
+        <el-form-item label="更新内容：">
+          <el-input type="textarea" rows="4" placeholder="请输入更新内容" />
+        </el-form-item>
+        <el-form-item label="安装包：">
+          <Upload type="file" />
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button>取消</el-button>
+        <el-button type="primary">确定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 编辑 -->
+    <el-dialog :visible.sync="dialogVisible_edit" title="编辑" width="500px">
+      <el-form label-width="100px">
+        <el-form-item label="应用名称：">
+          <el-input placeholder="请输入应用名称" />
+        </el-form-item>
+        <el-form-item label="应用Logo：">
+          <Upload />
+        </el-form-item>
+      </el-form>
+      <div slot="footer">
+        <el-button>取消</el-button>
+        <el-button type="primary">确定</el-button>
+      </div>
+    </el-dialog>
+
+    <!-- 版本记录 -->
+    <el-dialog :visible.sync="dialogVisible_history" title="版本记录" width="1000px">
+      <el-table :data="tableData_history">
+        <el-table-column label="序号" align="center" type="index" />
+        <el-table-column label="版本号" align="center" />
+        <el-table-column label="更新内容" align="center" />
+        <el-table-column label="安装包大小" align="center" />
+        <el-table-column label="创建时间" align="center" />
+        <el-table-column label="当前状态" align="center" />
+        <el-table-column label="操作" align="center">
+          <template>
+            <el-button>下架</el-button>
+            <el-button>上架</el-button>
+            <el-button>编辑</el-button>
+            <el-button>发布</el-button>
+            <el-button>删除</el-button>
+            <el-button>复制下载链接</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import { add, edit } from '@/api/project/list'
+import Upload from '@/components/Upload'
+export default {
+  components: {
+    Upload
+  },
+  data() {
+    return {
+      // 表单
+      form_create: {},
+      // 列表
+      tableData_version: [{
+        name: '测试'
+      }],
+      tableData_history: [{
+        version: 0.1
+      }],
+      // 弹窗
+      dialogVisible_create: false,
+      dialogVisible_update: false,
+      dialogVisible_edit: false,
+      dialogVisible_history: false
+    }
+  },
+  mounted() {
+    if (this.$route.query.row) {
+      this.form_create = this.$route.query.row
+    }
+  },
+  methods: {
+    // 更多
+    getCommand(e) {
+      if (e === 'edit') {
+        this.dialogVisible_edit = true
+      } else if (e === 'copy') {
+
+      } else {
+        this.dialogVisible_history = true
+      }
+    },
+
+    // 上传图标
+    getUpload(e) {
+      this.form_create.pic = e
+    },
+
+    // 确定
+    getSubmit() {
+      if (this.$route.query.row) {
+        edit(this.form_create).then(res => {
+          if (res.code === 0) {
+            this.$message.success('修改成功！')
+            this.getCancel()
+          }
+        })
+      } else {
+        add(this.form_create).then(res => {
+          if (res.code === 0) {
+            this.$message.success('新增成功！')
+            this.getCancel()
+          }
+        })
+      }
+    },
+    
+    // 取消
+    getCancel(){
+      this.$tab.closeOpenPage("/project/list");
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.form {
+  width: 500px;
+}
+</style>

src/views/project/list/index.vue

@@ -0,0 +1,96 @@
+<template>
+  <div class="app-container">
+    <!-- 搜索 -->
+    <el-form inline label-width="100px" size="mini">
+      <el-form-item label="项目名称：">
+        <el-input v-model="form.name" placeholder="请输入项目名称" />
+      </el-form-item>
+      <el-form-item label="当前状态：">
+        <el-select v-model="form.status" placeholder="请选择当前状态">
+          <el-option />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" icon="el-icon-search" @click="getSearch">搜索</el-button>
+        <el-button icon="el-icon-refresh" @click="getRefresh">重置</el-button>
+        <el-button type="primary" icon="el-icon-plus" plain @click="getDetail()">新增</el-button>
+      </el-form-item>
+    </el-form>
+    <!-- 列表 -->
+    <el-table :data="tableData">
+      <el-table-column prop="name" label="项目名称" align="center" />
+      <el-table-column label="创建时间" align="center" />
+      <el-table-column label="创建人" align="center" />
+      <el-table-column label="当前状态" align="center" />
+      <el-table-column label="操作" align="center">
+        <template slot-scope="scope">
+          <el-button type="text" @click="getDetail(scope.row, 'edit')">管理</el-button>
+          <el-button type="text">下架</el-button>
+          <el-button type="text">上架</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <pagination v-show="total>0" :total="total" :page.sync="form.pageNum" :limit.sync="form.pageSize"
+      @pagination="getList" />
+  </div>
+</template>
+
+<script>
+import { page } from '@/api/project/list'
+export default {
+  data() {
+    return {
+      // 表单
+      form: {
+        pageNum: 1,
+        pageSize: 10
+      },
+      total: 0,
+      // 列表
+      tableData: [{
+        name: '猫王',
+        createTime: '',
+      }]
+    }
+  },
+  mounted() {
+    this.getList()
+  },
+  methods: {
+    // 列表
+    getList() {
+      page(this.form).then(res => {
+        if (res.code === 0) {
+          this.tableData = res.data.records
+          this.total = res.data.total
+        }
+      })
+    },
+
+    // 搜索
+    getSearch() {
+
+    },
+
+    // 重置
+    getRefresh() {
+
+    },
+
+    // 新增 / 管理
+    getDetail(row, key) {
+      this.$router.push({
+        path: `/project/list/detail`,
+        query: {
+          row: row,
+          key: key
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+</style>