游戏列表管理

src/api/game.js

@@ -42,3 +42,37 @@ export function delJump(data) {
     data
   })
 }
+
+/* -------------------------------------- */
+// 获取游戏列表
+export function getallGame(params) {
+  return requestMp({
+    url: '/game-list',
+    method: 'get',
+    params
+  })
+}
+// 添加游戏
+export function addGame(data) {
+  return requestMp({
+    url: '/game-list',
+    method: 'post',
+    data
+  })
+}
+// 修改游戏
+export function updateGame(data) {
+  return requestMp({
+    url: '/game-list',
+    method: 'put',
+    data
+  })
+}
+// 删除游戏
+export function delGame(data) {
+  return requestMp({
+    url: '/game-list',
+    method: 'delete',
+    data
+  })
+}

src/router/admin.js

@@ -43,6 +43,14 @@ const adminRouter = {
         title: '跳转列表',
       },
     },
+    {
+      path: 'game-list',
+      component: () => import('@/views/admin/game-list'), // Parent router-view
+      name: 'adminGameList',
+      meta: {
+        title: '游戏列表',
+      },
+    },
   ],
 }
 

src/views/ad/edit.vue

@@ -536,8 +536,8 @@ export default {
     }
 
     if (!hasAd) {
-      // 默认选择第一个平台
+      // 默认选择微信6001
-      this.adForm.channelid = this.platformList[0].platform_id
+      this.adForm.channelid = 6001
       this.changePlatform(this.adForm.channelid)
       // 默认选择第一个游戏
       this.adForm.gameid = this.gameList[0] ? this.gameList[0].game_id : ''
@@ -686,6 +686,7 @@ export default {
       })
       if (!location.message || location.message.length === 0) {
         this.locationList = []
+        this.targetList = {}
         return
       }
 

src/views/admin/game-list.vue

@@ -0,0 +1,430 @@
+<template>
+  <div class="app-container">
+    <!-- filter -->
+    <el-form
+      ref="filterForm"
+      :inline="true"
+      :model="filterForm"
+      class="filter"
+    >
+      <el-form-item
+        label="平台"
+        prop="platform_id"
+      >
+        <el-select
+          v-model="filterForm.platform_id"
+          placeholder="请选择平台"
+          class="w100"
+        >
+          <el-option
+            label="所有"
+            :value="''"
+          />
+          <el-option
+            v-for="(item, index) in platformList"
+            :key="index"
+            :label="item.platform_name"
+            :value="item.platform_id"
+          />
+        </el-select>
+      </el-form-item>
+      <el-form-item>
+        <el-button
+          type="primary"
+          @click="search"
+        >查询</el-button>
+        <el-button @click="resetForm('filterForm')">
+          重置
+        </el-button>
+      </el-form-item>
+    </el-form>
+    <!-- toolbar -->
+    <div class="toolbar clearfix">
+      <div class="l fl">
+        <el-button
+          type="primary"
+          @click="addInfo"
+        >新增</el-button>
+      </div>
+      <div class="r fr">
+        <el-button
+          type="primary"
+          @click="refreshData"
+        >刷新</el-button>
+      </div>
+    </div>
+    <!-- table -->
+    <el-table
+      v-loading="isLoaded"
+      :data="tableData"
+      style="width: 100%"
+      class="table mgt-20 mgb-20"
+      @row-click="rowClick"
+    >
+      <el-table-column
+        prop="game_name"
+        label="游戏名称"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        prop="platform_id"
+        label="平台ID"
+        show-overflow-tooltip
+        :formatter="formPlatform"
+      />
+      <el-table-column
+        prop="appid"
+        label="AppID"
+        show-overflow-tooltip
+      />
+      <el-table-column
+        label="操作"
+        fixed="right"
+        width="120"
+      >
+        <template slot-scope="scope">
+          <el-button
+            type="text"
+            size="small"
+            @click.stop="editInfo(scope.row)"
+          >编辑</el-button>
+          <el-button
+            type="text"
+            size="small"
+            @click.stop="delInfo(scope.row)"
+          >删除</el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- pagination -->
+    <el-pagination
+      :hide-on-single-page="true"
+      :current-page="currentPage"
+      :page-sizes="[10, 20, 50, 100]"
+      :page-size="pageSize"
+      layout="total, sizes, prev, pager, next, jumper"
+      :total="total"
+      class="al-r"
+      @size-change="sizeChange"
+      @current-change="pageChange"
+    />
+    <!-- modal - edit -->
+    <el-dialog
+      title="编辑游戏跳转信息"
+      :visible.sync="modalVisible"
+      :before-close="closeModal"
+    >
+      <el-form
+        ref="modalForm"
+        :model="modalForm"
+        :rules="modalRules"
+        label-width="100px"
+      >
+        <el-form-item
+          label="平台"
+          prop="platform_id"
+        >
+          <el-select
+            v-model="modalForm.platform_id"
+            placeholder="请选择平台"
+            class="w100"
+          >
+            <el-option
+              v-for="(item, index) in platformList"
+              :key="index"
+              :label="item.platform_name"
+              :value="item.platform_id"
+            />
+          </el-select>
+        </el-form-item>
+        <el-form-item
+          label="游戏名称"
+          prop="game_name"
+        >
+          <el-input v-model="modalForm.game_name"></el-input>
+        </el-form-item>
+        <el-form-item
+          label="AppID"
+          prop="appid"
+        >
+          <el-input v-model="modalForm.appid" />
+        </el-form-item>
+
+      </el-form>
+      <div slot="footer">
+        <el-button @click="closeModal">取 消</el-button>
+        <el-button
+          type="primary"
+          @click="saveEdit"
+        >确 定</el-button>
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {getGameList, getallGame, addGame, updateGame, delGame} from '@/api/game'
+import {Promise} from 'q'
+
+export default {
+  name: 'adminGameList',
+  data() {
+    return {
+      // common
+      isLoaded: false,
+      isNew: false,
+      gameList: [],
+      allGame: [],
+      platformList: [],
+      // filter
+      filterForm: {
+        platform_id: '',
+      },
+
+      // table
+      tableData: [],
+      showName: {
+        platform: {},
+      },
+      // page
+      total: 0,
+      currentPage: 1,
+      pageSize: 10,
+
+      //modal
+      modalVisible: false,
+      modalForm: {},
+      defaultInfo: {
+        platform_id: 6001,
+        game_name: '',
+        appid: '',
+      },
+      modalOpt: {
+        game: {},
+        platform: {},
+      },
+      modalRules: {
+        platform_id: [{required: true, message: '请选择平台', trigger: 'blur'}],
+        game_name: [
+          {required: true, message: '请填写游戏名称', trigger: 'blur'},
+        ],
+        appid: [{required: true, message: '请填写AppID', trigger: 'blur'}],
+      },
+    }
+  },
+  async mounted() {
+    const allGame = await this.getGameList()
+    this.allGame = allGame.gameList
+
+    // 获取所有平台
+    this.platformList = this.allGame.map(item => {
+      return `${item.platform_id}-${item.platform_name}`
+    })
+    this.platformList = [...new Set(this.platformList)]
+    this.platformList = this.platformList.map(item => {
+      const platform = item.split('-')
+      this.showName.platform[platform[0]] = platform[1]
+      return {
+        platform_id: parseInt(platform[0]),
+        platform_name: platform[1],
+      }
+    })
+
+    this.getData()
+  },
+  methods: {
+    // common
+    getGameList(params) {
+      return new Promise((resolve, reject) => {
+        getGameList(params)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
+    getallGame(params) {
+      return new Promise((resolve, reject) => {
+        getallGame(params)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
+    addGame(data) {
+      return new Promise((resolve, reject) => {
+        addGame(data)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
+    updateGame(data) {
+      return new Promise((resolve, reject) => {
+        updateGame(data)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
+    delGame(data) {
+      return new Promise((resolve, reject) => {
+        delGame(data)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
+    resetForm(formName) {
+      this.$refs[formName].resetFields()
+    },
+    clearValidate(formName) {
+      this.$refs[formName].clearValidate()
+    },
+    validate(formName) {
+      return new Promise((resolve, reject) => {
+        this.$refs[formName].validate(valid => {
+          resolve(valid)
+        })
+      })
+    },
+    // filter
+    search() {
+      this.currentPage = 1
+      this.getData()
+    },
+
+    // toolbar
+    refreshData() {
+      this.currentPage = 1
+      this.getData()
+    },
+    addInfo() {
+      this.isNew = true
+      this.modalForm = JSON.parse(JSON.stringify(this.defaultInfo))
+      this.openModal()
+    },
+    // table
+    async getData() {
+      try {
+        this.isLoaded = true
+        const params = {}
+        if (this.filterForm.platform_id)
+          params.platform_id = this.filterForm.platform_id
+
+        params.currentPage = this.currentPage
+        params.pageSize = this.pageSize
+        const data = await this.getallGame(params)
+        this.tableData = data.result.map(item => {
+          item.t_game_name = [item.t_game_name]
+          return item
+        })
+        this.total = data.total
+        this.isLoaded = false
+      } catch (err) {
+        console.log(err)
+      }
+    },
+    rowClick(row, column, event) {
+      this.viewInfo(row)
+    },
+    editInfo(row) {
+      this.rowClick(row)
+    },
+    delInfo(row) {
+      const self = this
+      this.$confirm(`是否删除选中的游戏跳转信息`, '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning',
+      })
+        .then(async () => {
+          await self.delGame({_id: row._id})
+          this.$message.success('删除成功！')
+          this.getData()
+        })
+        .catch(err => {
+          console.log(err)
+          this.$message.info('已取消删除！')
+        })
+    },
+    formPlatform(row, column, cellValue, index) {
+      return `${this.showName.platform[cellValue]}`
+    },
+    // pagination
+    sizeChange(val) {
+      this.pageSize = val
+      this.getData()
+    },
+    pageChange(val) {
+      this.currentPage = val
+      this.getData()
+    },
+    // modal
+    closeModal() {
+      this.modalVisible = false
+      this.clearValidate('modalForm')
+    },
+    openModal() {
+      this.modalVisible = true
+      this.modalOpt.game = this.allGame.filter(item => {
+        return item.platform_id === this.modalForm.platform_id
+      })
+    },
+    viewInfo(data) {
+      this.isNew = false
+      this.modalForm = JSON.parse(JSON.stringify(data))
+      this.openModal()
+    },
+    async saveEdit() {
+      try {
+        const valid = await this.validate('modalForm')
+        if (!valid) {
+          this.$message.error('请按要求填写表单')
+          return
+        }
+
+        // 整理数据
+        const info = JSON.parse(JSON.stringify(this.modalForm))
+
+        if (this.isNew) {
+          // 新增
+          const result = await this.addGame(info)
+        } else {
+          // 修改
+          const result = await this.updateGame(info)
+        }
+        this.$message.success('操作成功！')
+        this.closeModal()
+        this.getData()
+      } catch (err) {
+        console.log(err)
+      }
+    },
+  },
+}
+</script>

src/views/admin/jump.vue

@@ -209,22 +209,15 @@
                         class="w100"
                         multiple
                         filterable
-                        allow-create
                     >
                         <el-option
-                            v-for="(item, index) in modalOpt.game"
+                            v-for="(item, index) in modalOpt.target"
                             :key="index"
-                            :label="item.game"
+                            :label="item.game_name"
-                            :value="item.game"
+                            :value="item.game_name"
                         />
                     </el-select>
                 </el-form-item>
-                <el-form-item
-                    label="目标AppID"
-                    prop="t_appid"
-                >
-                    <el-input v-model="modalForm.t_appid" />
-                </el-form-item>
                 <el-form-item
                     label="特征码"
                     prop="ad_uid"
@@ -256,6 +249,7 @@ import {
   addJump,
   updateJump,
   delJump,
+  getallGame,
 } from '@/api/game'
 import {Promise} from 'q'
 
@@ -290,7 +284,7 @@ export default {
       modalVisible: false,
       modalForm: {},
       defaultInfo: {
-        platform_id: '',
+        platform_id: 6001,
         game_id: '',
         t_game_name: [],
         t_appid: '',
@@ -298,7 +292,8 @@ export default {
         link: '',
       },
       modalOpt: {
-        game: {},
+        game: [],
+        target: [],
         platform: {},
       },
       modalRules: {
@@ -307,9 +302,6 @@ export default {
         t_game_name: [
           {required: true, message: '请填写跳转游戏的名称', trigger: 'blur'},
         ],
-        t_appid: [
-          {required: true, message: '请填写跳转游戏的AppID', trigger: 'blur'},
-        ],
       },
     }
   },
@@ -349,6 +341,19 @@ export default {
           })
       })
     },
+    getallGame(params) {
+      return new Promise((resolve, reject) => {
+        getallGame(params)
+          .then(res => {
+            const data = res.data
+            resolve(data)
+          })
+          .catch(err => {
+            reject(err)
+            console.log(err)
+          })
+      })
+    },
     getJumpList(params) {
       return new Promise((resolve, reject) => {
         getJumpList(params)
@@ -503,6 +508,17 @@ export default {
     },
     openModal() {
       this.modalVisible = true
+
+      this.modalOpt.game = this.allGame.filter(item => {
+        return item.platform_id === this.modalForm.platform_id
+      })
+      this.getTargetList()
+    },
+    async getTargetList() {
+      const data = await this.getallGame({
+        platform_id: this.modalForm.platform_id,
+      })
+      this.modalOpt.target = data.result
     },
     viewInfo(data) {
       this.isNew = false
@@ -520,10 +536,20 @@ export default {
         // 整理数据
         const info = JSON.parse(JSON.stringify(this.modalForm))
         const games = info.t_game_name
-        const appids = info.t_appid.split(',')
+        const appids = []
         const ad_uids = info.ad_uid.split(',')
         const links = info.link.split(',')
 
+        const tempAppIdList = {}
+        this.modalOpt.target.map(item => {
+            tempAppIdList[item.game_name] = item.appid
+        })
+
+        games.map(item => {
+            appids.push(tempAppIdList[item])
+        })
+
+
         if (this.isNew) {
           // 新增
           const submitArr = []
@@ -558,9 +584,11 @@ export default {
     },
     changeOpt() {
       this.modalForm.game_id = ''
+      this.modalForm.t_game_name = ''
       this.modalOpt.game = this.allGame.filter(item => {
         return item.platform_id === this.modalForm.platform_id
       })
+      this.getTargetList()
     },
   },
 }