Преглед на файлове

游戏里的特征写好了

李志伟 преди 3 години
родител
ревизия
47e9acdd31
променени са 3 файла, в които са добавени 121 реда и са изтрити 47 реда
  1. 99
    1
      src/components/GameCharacter/edit.vue
  2. 12
    40
      src/components/GameCharacter/index.vue
  3. 10
    6
      src/views/gameManage/edit.vue

+ 99
- 1
src/components/GameCharacter/edit.vue Целия файл

@@ -1,7 +1,105 @@
1 1
 <template>
2
-  <div>特征编辑</div>
2
+  <div style="padding: 20px">
3
+    <h2 style="text-align: center">
4
+      特征实例{{ characterId ? "编辑" : "添加" }}
5
+    </h2>
6
+    <el-form ref="form" :model="form" label-width="150px" size="mini">
7
+      <el-form-item label="实例名称:">
8
+        <el-input
9
+          v-model="form.name"
10
+          placeholder="请输入实例名(必填)"
11
+        />
12
+      </el-form-item>
13
+      <el-form-item label="实例图片:">
14
+        <UploadImage :icon="form.thumb" @handleChange="handleChange" @handleDeleteIcon="handleDeleteIcon" />
15
+      </el-form-item>
16
+      <el-form-item label="实例描述:">
17
+        <el-input v-model="form.desc" type="textarea" />
18
+      </el-form-item>
19
+      <el-form-item>
20
+        <el-button type="primary" @click="onSubmit">确定</el-button>
21
+        <el-button @click="$router.go(-1)">返回</el-button>
22
+      </el-form-item>
23
+    </el-form>
24
+  </div>
3 25
 </template>
4 26
 <script>
27
+import { getGameCharacterDetail, UpdateGameCharacter, saveGameCharacter } from '@/api/gameCharacter'
28
+import UploadImage from '@/components/UploadImage/index.vue'
29
+export default {
30
+  components: {
31
+    UploadImage
32
+  },
33
+  props: {
34
+    gameId: String,
35
+    characterId: String
36
+  },
37
+  data() {
38
+    return {
39
+      form: {
40
+        gameId: undefined,
41
+        name: undefined,
42
+        thumb: undefined,
43
+        desc: undefined,
44
+        characterId: undefined
45
+      }
46
+    }
47
+  },
48
+  watch: {
49
+    characterId: function() {
50
+      if (this.characterId) {
51
+        getGameCharacterDetail(this.characterId).then((res) => {
52
+          this.form = res.data
53
+        })
54
+      } else {
55
+        this.form = {
56
+          name: undefined,
57
+          thumb: undefined,
58
+          desc: undefined,
59
+          characterId: undefined
60
+        }
61
+      }
62
+    },
63
+    gameId: function() {
64
+      console.log(this.gameId)
65
+      if (this.gameId) {
66
+        this.form.gameId = this.gameId
67
+      }
68
+    }
69
+  },
70
+  methods: {
71
+    onSubmit() {
72
+      this.form.characterId = this.characterId
73
+      if (this.form.name) {
74
+        if (this.characterId) {
75
+          if (!this.form.thumb) {
76
+            this.form.thumb = ''
77
+          }
78
+          UpdateGameCharacter(this.form, this.characterId).then((res) => {
79
+            this.$message('修改实例成功')
80
+            // 告诉父页面实例表需要刷新
81
+            this.$emit('handleRefreshGameCharacter', true)
82
+          })
83
+        } else {
84
+          saveGameCharacter(this.form).then((res) => {
85
+            this.$message('添加实例成功')
86
+            // 告诉父页面实例表需要刷新
87
+            this.$emit('handleRefreshGameCharacter', true)
88
+            this.$emit('handleEditGameCharacter', res.data.characterId)
89
+          })
90
+        }
91
+      } else {
92
+        this.$message('请输入实例名')
93
+      }
94
+    },
95
+    handleChange(val) {
96
+      this.form.thumb = val
97
+    },
98
+    handleDeleteIcon() {
99
+      this.form.thumb = ''
100
+    }
101
+  }
102
+}
5 103
 </script>
6 104
 <style>
7 105
 </style>

+ 12
- 40
src/components/GameCharacter/index.vue Целия файл

@@ -1,33 +1,11 @@
1 1
 <template>
2 2
   <div class="body" style="font-size:14px">
3
-    <el-card class="box-card">
4
-      实例名称:<el-input
5
-        v-model="name"
6
-        size="mini"
7
-        style="width: 200px; margin-right: 20px"
8
-      />
9
-      创建时间:
10
-      <el-date-picker
11
-        v-model="daterange"
12
-        size="mini"
13
-        type="daterange"
14
-        range-separator="至"
15
-        start-placeholder="开始日期"
16
-        end-placeholder="结束日期"
17
-        value-format="yyyy-MM-dd"
18
-        style="margin-right: 20px"
19
-        @change="dateChange"
20
-      />
21
-
22
-      <el-button type="primary" size="mini" @click="onSearch">查询</el-button>
23
-      <el-button size="mini" @click="onReset">重置</el-button>
24
-      <el-button type="primary" size="mini" @click="handleAdd">添加特征库</el-button>
25
-    </el-card>
3
+    <el-button type="primary" size="mini" style="float: right; margin-bottom: 20px;" @click="handleAdd">添加特征</el-button>
26 4
     <el-table stripe :data="tableData" border style="width: 100%">
27 5
       <el-table-column prop="name" label="实例名称" />
28 6
       <el-table-column prop="thumb" label="实例图片">
29 7
         <template slot-scope="scope">
30
-          <el-image :src="scope.row.icon" style="width: 100px; height: 100px" />
8
+          <el-image :src="scope.row.thumb" style="width: 100px; height: 100px" />
31 9
         </template>
32 10
       </el-table-column>
33 11
       <el-table-column prop="createDate" label="创建时间">
@@ -67,42 +45,36 @@ export default {
67 45
       startDate: undefined
68 46
     }
69 47
   },
70
-  mounted() {
71
-    this.onSearch()
48
+  watch: {
49
+    gameId() {
50
+      if (this.gameId) {
51
+        this.onSearch()
52
+      }
53
+    }
72 54
   },
73 55
   methods: {
74 56
     handleAdd() {
75
-      this.$emit('handleAddGameCharcter', true)
57
+      this.$emit('handleAddGameCharacter', true)
76 58
     },
77 59
     handleEdit(row) {
78
-      this.$emit('handleEditGameCharcter', row.characterId)
60
+      this.$emit('handleEditGameCharacter', row.characterId)
79 61
     },
80 62
     handleDelete(row) {
81 63
       deleteGameCharacter(row.characterId).then(() => {
82 64
         // 让父组件给右边编辑特征页面一个空的characterId
83 65
         // 防止当前特征正在编辑时删除了右边再次进行保存会报错
84 66
         this.$message('删除特征成功')
85
-        this.$emit('handleCloseGameCharcter', true)
67
+        this.$emit('handleCloseGameCharacter', true)
86 68
         this.onSearch()
87 69
       })
88 70
     },
89 71
     onSearch() {
90 72
       getGameCharacterList({
91
-        gameId: this.gameId,
92
-        name: this.name,
93
-        startDate: this.startDate,
94
-        endDate: this.endDate
73
+        gameId: this.gameId
95 74
       }).then((res) => {
96 75
         this.tableData = res.data.records
97 76
       })
98 77
     },
99
-    onReset() {
100
-      this.name = ''
101
-      this.daterange = ''
102
-      this.startDate = ''
103
-      this.endDate = ''
104
-      this.onSearch()
105
-    },
106 78
     dateChange(val) {
107 79
       this.startDate = this.daterange[0]
108 80
       this.endDate = this.daterange[1]

+ 10
- 6
src/views/gameManage/edit.vue Целия файл

@@ -40,14 +40,15 @@
40 40
         <el-row :gutter="20" style="padding-top: 20px">
41 41
           <el-col :span="13">
42 42
             <GameCharacter
43
+              ref="GameCharacter"
43 44
               :gameId='gameId'
44
-              @handleAddGameCharcter='characterId = undefined'
45
-              @handleCloseGameCharcter='characterId = undefined'
46
-              @handleEditGameCharcter='handleEditGameCharcter'
45
+              @handleAddGameCharacter='characterId = undefined'
46
+              @handleCloseGameCharacter='characterId = undefined'
47
+              @handleEditGameCharacter='handleEditGameCharacter'
47 48
             />
48 49
           </el-col>
49 50
           <el-col :span="11">
50
-            <GameCharacterEdit :characterId='characterId'/>
51
+            <GameCharacterEdit :characterId='characterId' :gameId='gameId' @handleRefreshGameCharacter='handleRefreshGameCharacter' @handleEditGameCharacter='handleEditGameCharacter' />
51 52
           </el-col>
52 53
         </el-row>
53 54
       </el-tab-pane>
@@ -152,9 +153,12 @@ export default {
152 153
 
153 154
     // 特征页面方法
154 155
     // 改变编辑特征页面的初始值
155
-    handleEditGameCharcter(val) {
156
+    handleEditGameCharacter(val) {
156 157
       this.characterId = val
157 158
     },
159
+    handleRefreshGameCharacter() {
160
+      this.$refs.GameCharacter.onSearch()
161
+    },
158 162
 
159 163
     handleEdit(val) {
160 164
       this.questionId = val
@@ -163,7 +167,7 @@ export default {
163 167
       this.questionId = undefined
164 168
     },
165 169
     handleRefresh() {
166
-      this.$refs.questionList.onSearch()
170
+      this.$refs.GameCharacter.onSearch()
167 171
     }
168 172
   }
169 173
 }