Explorar o código

新增Vue3前端代码生成模板

RuoYi %!s(int64=4) %!d(string=hai) anos
pai
achega
5c90f0bbb7

+ 1 - 1
ruoyi-modules/ruoyi-gen/src/main/resources/vm/vue/index-tree.vue.vm

@@ -263,7 +263,7 @@
263 263
 </template>
264 264
 
265 265
 <script>
266
-import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName}, export${BusinessName} } from "@/api/${moduleName}/${businessName}";
266
+import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}";
267 267
 import Treeselect from "@riophae/vue-treeselect";
268 268
 import "@riophae/vue-treeselect/dist/vue-treeselect.css";
269 269
 

+ 0 - 1
ruoyi-modules/ruoyi-gen/src/main/resources/vm/vue/index.vue.vm

@@ -427,7 +427,6 @@ export default {
427 427
 #foreach ($column in $columns)
428 428
 #if($column.htmlType == "radio")
429 429
         $column.javaField: #if($column.javaType == "Integer" || $column.javaType == "Long")0#else"0"#end#if($foreach.count != $columns.size()),#end
430
-
431 430
 #elseif($column.htmlType == "checkbox")
432 431
         $column.javaField: []#if($foreach.count != $columns.size()),#end
433 432
 #else

+ 465 - 0
ruoyi-modules/ruoyi-gen/src/main/resources/vm/vue/v3/index-tree.vue.vm

@@ -0,0 +1,465 @@
1
+<template>
2
+  <div class="app-container">
3
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
4
+#foreach($column in $columns)
5
+#if($column.query)
6
+#set($dictType=$column.dictType)
7
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
8
+#set($parentheseIndex=$column.columnComment.indexOf("("))
9
+#if($parentheseIndex != -1)
10
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
11
+#else
12
+#set($comment=$column.columnComment)
13
+#end
14
+#if($column.htmlType == "input")
15
+      <el-form-item label="${comment}" prop="${column.javaField}">
16
+        <el-input
17
+          v-model="queryParams.${column.javaField}"
18
+          placeholder="请输入${comment}"
19
+          clearable
20
+          size="small"
21
+          @keyup.enter="handleQuery"
22
+        />
23
+      </el-form-item>
24
+#elseif(($column.htmlType == "select" || $column.htmlType == "radio") && "" != $dictType)
25
+      <el-form-item label="${comment}" prop="${column.javaField}">
26
+        <el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable size="small">
27
+          <el-option
28
+            v-for="dict in ${dictType}"
29
+            :key="dict.value"
30
+            :label="dict.label"
31
+            :value="dict.value"
32
+          />
33
+        </el-select>
34
+      </el-form-item>
35
+#elseif(($column.htmlType == "select" || $column.htmlType == "radio") && $dictType)
36
+      <el-form-item label="${comment}" prop="${column.javaField}">
37
+        <el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable size="small">
38
+          <el-option label="请选择字典生成" value="" />
39
+        </el-select>
40
+      </el-form-item>
41
+#elseif($column.htmlType == "datetime" && $column.queryType != "BETWEEN")
42
+      <el-form-item label="${comment}" prop="${column.javaField}">
43
+        <el-date-picker clearable size="small"
44
+          v-model="queryParams.${column.javaField}"
45
+          type="date"
46
+          value-format="YYYY-MM-DD"
47
+          placeholder="选择${comment}">
48
+        </el-date-picker>
49
+      </el-form-item>
50
+#elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
51
+      <el-form-item label="${comment}">
52
+        <el-date-picker
53
+          v-model="daterange${AttrName}"
54
+          size="small"
55
+          style="width: 240px"
56
+          value-format="YYYY-MM-DD"
57
+          type="daterange"
58
+          range-separator="-"
59
+          start-placeholder="开始日期"
60
+          end-placeholder="结束日期"
61
+        ></el-date-picker>
62
+      </el-form-item>
63
+#end
64
+#end
65
+#end
66
+      <el-form-item>
67
+	    <el-button type="primary" icon="Search" size="mini" @click="handleQuery">搜索</el-button>
68
+        <el-button icon="Refresh" size="mini" @click="resetQuery">重置</el-button>
69
+      </el-form-item>
70
+    </el-form>
71
+
72
+    <el-row :gutter="10" class="mb8">
73
+      <el-col :span="1.5">
74
+        <el-button
75
+          type="primary"
76
+          plain
77
+          icon="Plus"
78
+          size="mini"
79
+          @click="handleAdd"
80
+          v-hasPermi="['${moduleName}:${businessName}:add']"
81
+        >新增</el-button>
82
+      </el-col>
83
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
84
+    </el-row>
85
+
86
+    <el-table
87
+      v-loading="loading"
88
+      :data="${businessName}List"
89
+      row-key="${treeCode}"
90
+      default-expand-all
91
+      :tree-props="{children: 'children', hasChildren: 'hasChildren'}"
92
+    >
93
+#foreach($column in $columns)
94
+#set($javaField=$column.javaField)
95
+#set($parentheseIndex=$column.columnComment.indexOf("("))
96
+#if($parentheseIndex != -1)
97
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
98
+#else
99
+#set($comment=$column.columnComment)
100
+#end
101
+#if($column.pk)
102
+#elseif($column.list && $column.htmlType == "datetime")
103
+      <el-table-column label="${comment}" align="center" prop="${javaField}" width="180">
104
+        <template #default="scope">
105
+          <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span>
106
+        </template>
107
+      </el-table-column>
108
+#elseif($column.list && "" != $column.dictType)
109
+      <el-table-column label="${comment}" align="center" prop="${javaField}">
110
+        <template #default="scope">
111
+#if($column.htmlType == "checkbox")
112
+          <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/>
113
+#else
114
+          <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/>
115
+#end
116
+        </template>
117
+      </el-table-column>
118
+#elseif($column.list && "" != $javaField)
119
+#if(${foreach.index} == 1)
120
+      <el-table-column label="${comment}" prop="${javaField}" />
121
+#else
122
+      <el-table-column label="${comment}" align="center" prop="${javaField}" />
123
+#end
124
+#end
125
+#end
126
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
127
+        <template #default="scope">
128
+          <el-button
129
+            size="mini"
130
+            type="text"
131
+            icon="Edit"
132
+            @click="handleUpdate(scope.row)"
133
+            v-hasPermi="['${moduleName}:${businessName}:edit']"
134
+          >修改</el-button>
135
+          <el-button
136
+            size="mini"
137
+            type="text"
138
+            icon="Plus"
139
+            @click="handleAdd(scope.row)"
140
+            v-hasPermi="['${moduleName}:${businessName}:add']"
141
+          >新增</el-button>
142
+          <el-button
143
+            size="mini"
144
+            type="text"
145
+            icon="Delete"
146
+            @click="handleDelete(scope.row)"
147
+            v-hasPermi="['${moduleName}:${businessName}:remove']"
148
+          >删除</el-button>
149
+        </template>
150
+      </el-table-column>
151
+    </el-table>
152
+
153
+    <!-- 添加或修改${functionName}对话框 -->
154
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
155
+      <el-form ref="${businessName}Ref" :model="form" :rules="rules" label-width="80px">
156
+#foreach($column in $columns)
157
+#set($field=$column.javaField)
158
+#if($column.insert && !$column.pk)
159
+#if(($column.usableColumn) || (!$column.superColumn))
160
+#set($parentheseIndex=$column.columnComment.indexOf("("))
161
+#if($parentheseIndex != -1)
162
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
163
+#else
164
+#set($comment=$column.columnComment)
165
+#end
166
+#set($dictType=$column.dictType)
167
+#if("" != $treeParentCode && $column.javaField == $treeParentCode)
168
+        <el-form-item label="${comment}" prop="${treeParentCode}">
169
+          <tree-select
170
+            v-model:value="form.${treeParentCode}"
171
+            :options="${businessName}Options"
172
+            :objMap="{ value: '${treeCode}', label: '${treeName}', children: 'children' }"
173
+            placeholder="请选择${comment}"
174
+          />
175
+        </el-form-item>
176
+#elseif($column.htmlType == "input")
177
+        <el-form-item label="${comment}" prop="${field}">
178
+          <el-input v-model="form.${field}" placeholder="请输入${comment}" />
179
+        </el-form-item>
180
+#elseif($column.htmlType == "imageUpload")
181
+        <el-form-item label="${comment}">
182
+          <imageUpload v-model="form.${field}"/>
183
+        </el-form-item>
184
+#elseif($column.htmlType == "fileUpload")
185
+        <el-form-item label="${comment}">
186
+          <fileUpload v-model="form.${field}"/>
187
+        </el-form-item>
188
+#elseif($column.htmlType == "editor")
189
+        <el-form-item label="${comment}">
190
+          <editor v-model="form.${field}" :min-height="192"/>
191
+        </el-form-item>
192
+#elseif($column.htmlType == "select" && "" != $dictType)
193
+        <el-form-item label="${comment}" prop="${field}">
194
+          <el-select v-model="form.${field}" placeholder="请选择${comment}">
195
+            <el-option
196
+              v-for="dict in ${dictType}"
197
+              :key="dict.value"
198
+              :label="dict.label"
199
+              #if($column.javaType == "Integer" || $column.javaType == "Long"):value="parseInt(dict.value)"#else:value="dict.value"#end
200
+
201
+            ></el-option>
202
+          </el-select>
203
+        </el-form-item>
204
+#elseif($column.htmlType == "select" && $dictType)
205
+        <el-form-item label="${comment}" prop="${field}">
206
+          <el-select v-model="form.${field}" placeholder="请选择${comment}">
207
+            <el-option label="请选择字典生成" value="" />
208
+          </el-select>
209
+        </el-form-item>
210
+#elseif($column.htmlType == "checkbox" && "" != $dictType)
211
+        <el-form-item label="${comment}">
212
+          <el-checkbox-group v-model="form.${field}">
213
+            <el-checkbox
214
+              v-for="dict in ${dictType}"
215
+              :key="dict.value"
216
+              :label="dict.value">
217
+              {{dict.label}}
218
+            </el-checkbox>
219
+          </el-checkbox-group>
220
+        </el-form-item>
221
+#elseif($column.htmlType == "checkbox" && $dictType)
222
+        <el-form-item label="${comment}">
223
+          <el-checkbox-group v-model="form.${field}">
224
+            <el-checkbox>请选择字典生成</el-checkbox>
225
+          </el-checkbox-group>
226
+        </el-form-item>
227
+#elseif($column.htmlType == "radio" && "" != $dictType)
228
+        <el-form-item label="${comment}">
229
+          <el-radio-group v-model="form.${field}">
230
+            <el-radio
231
+              v-for="dict in ${dictType}"
232
+              :key="dict.value"
233
+              #if($column.javaType == "Integer" || $column.javaType == "Long"):label="parseInt(dict.value)"#else:label="dict.value"#end
234
+
235
+            >{{dict.label}}</el-radio>
236
+          </el-radio-group>
237
+        </el-form-item>
238
+#elseif($column.htmlType == "radio" && $dictType)
239
+        <el-form-item label="${comment}">
240
+          <el-radio-group v-model="form.${field}">
241
+            <el-radio label="1">请选择字典生成</el-radio>
242
+          </el-radio-group>
243
+        </el-form-item>
244
+#elseif($column.htmlType == "datetime")
245
+        <el-form-item label="${comment}" prop="${field}">
246
+          <el-date-picker clearable size="small"
247
+            v-model="form.${field}"
248
+            type="date"
249
+            value-format="YYYY-MM-DD"
250
+            placeholder="选择${comment}">
251
+          </el-date-picker>
252
+        </el-form-item>
253
+#elseif($column.htmlType == "textarea")
254
+        <el-form-item label="${comment}" prop="${field}">
255
+          <el-input v-model="form.${field}" type="textarea" placeholder="请输入内容" />
256
+        </el-form-item>
257
+#end
258
+#end
259
+#end
260
+#end
261
+      </el-form>
262
+      <template #footer>
263
+        <div class="dialog-footer">
264
+          <el-button type="primary" @click="submitForm">确 定</el-button>
265
+          <el-button @click="cancel">取 消</el-button>
266
+        </div>
267
+      </template>
268
+    </el-dialog>
269
+  </div>
270
+</template>
271
+
272
+<script setup name="${BusinessName}">
273
+import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}";
274
+
275
+const { proxy } = getCurrentInstance();
276
+#if(${dicts} != '')
277
+#set($dictsNoSymbol=$dicts.replace("'", ""))
278
+const { ${dictsNoSymbol} } = proxy.useDict(${dicts});
279
+#end
280
+
281
+const ${businessName}List = ref([]);
282
+const ${businessName}Options = ref([]);
283
+const open = ref(false);
284
+const loading = ref(true);
285
+const showSearch = ref(true);
286
+const title = ref("");
287
+#foreach ($column in $columns)
288
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
289
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
290
+const daterange${AttrName} = ref([]);
291
+#end
292
+#end
293
+
294
+const data = reactive({
295
+  form: {},
296
+  queryParams: {
297
+    #foreach ($column in $columns)
298
+#if($column.query)
299
+    $column.javaField: null#if($foreach.count != $columns.size()),#end
300
+#end
301
+#end
302
+  },
303
+  rules: {
304
+    #foreach ($column in $columns)
305
+#if($column.required)
306
+#set($parentheseIndex=$column.columnComment.indexOf("("))
307
+#if($parentheseIndex != -1)
308
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
309
+#else
310
+#set($comment=$column.columnComment)
311
+#end
312
+    $column.javaField: [
313
+      { required: true, message: "$comment不能为空", trigger: #if($column.htmlType == "select")"change"#else"blur"#end }
314
+    ]#if($foreach.count != $columns.size()),#end
315
+#end
316
+#end
317
+  }
318
+});
319
+
320
+const { queryParams, form, rules } = toRefs(data);
321
+
322
+/** 查询${functionName}列表 */
323
+function getList() {
324
+  loading.value = true;
325
+#foreach ($column in $columns)
326
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
327
+  queryParams.value.params = {};
328
+#break
329
+#end
330
+#end
331
+#foreach ($column in $columns)
332
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
333
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
334
+  if (null != daterange${AttrName} && '' != daterange${AttrName}) {
335
+    queryParams.value.params["begin${AttrName}"] = daterange${AttrName}.value[0];
336
+    queryParams.value.params["end${AttrName}"] = daterange${AttrName}.value[1];
337
+  }
338
+#end
339
+#end
340
+  list${BusinessName}(queryParams.value).then(response => {
341
+    ${businessName}List.value = proxy.handleTree(response.data, "${treeCode}", "${treeParentCode}");
342
+    loading.value = false;
343
+  });
344
+}
345
+
346
+/** 查询${functionName}下拉树结构 */
347
+async function getTreeselect() {
348
+  await list${BusinessName}().then(response => {
349
+    ${businessName}Options.value = [];
350
+    const data = { ${treeCode}: 0, ${treeName}: '顶级节点', children: [] };
351
+    data.children = proxy.handleTree(response.data, "${treeCode}", "${treeParentCode}");
352
+    ${businessName}Options.value.push(data);
353
+  });
354
+}
355
+	
356
+// 取消按钮
357
+function cancel() {
358
+  open.value = false;
359
+  reset();
360
+}
361
+
362
+// 表单重置
363
+function reset() {
364
+  form.value = {
365
+#foreach ($column in $columns)
366
+#if($column.htmlType == "radio")
367
+    $column.javaField: #if($column.javaType == "Integer" || $column.javaType == "Long")0#else"0"#end#if($foreach.count != $columns.size()),#end
368
+
369
+#elseif($column.htmlType == "checkbox")
370
+    $column.javaField: []#if($foreach.count != $columns.size()),#end
371
+#else
372
+    $column.javaField: null#if($foreach.count != $columns.size()),#end
373
+#end
374
+#end
375
+  };
376
+  proxy.resetForm("${businessName}Ref");
377
+}
378
+
379
+/** 搜索按钮操作 */
380
+function handleQuery() {
381
+  getList();
382
+}
383
+
384
+/** 重置按钮操作 */
385
+function resetQuery() {
386
+#foreach ($column in $columns)
387
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
388
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
389
+  daterange${AttrName}.value = [];
390
+#end
391
+#end
392
+  proxy.resetForm("queryRef");
393
+  handleQuery();
394
+}
395
+
396
+/** 新增按钮操作 */
397
+async function handleAdd(row) {
398
+  reset();
399
+  await getTreeselect();
400
+  if (row != null && row.${treeCode}) {
401
+    form.value.${treeParentCode} = row.${treeCode};
402
+  } else {
403
+    form.value.${treeParentCode} = 0;
404
+  }
405
+  open.value = true;
406
+  title.value = "添加${functionName}";
407
+}
408
+
409
+/** 修改按钮操作 */
410
+async function handleUpdate(row) {
411
+  reset();
412
+  await getTreeselect();
413
+  if (row != null) {
414
+    form.value.${treeParentCode} = row.${treeCode};
415
+  }
416
+  get${BusinessName}(row.${pkColumn.javaField}).then(response => {
417
+    form.value = response.data;
418
+#foreach ($column in $columns)
419
+#if($column.htmlType == "checkbox")
420
+    form.value.$column.javaField = form.value.${column.javaField}.split(",");
421
+#end
422
+#end
423
+    open.value = true;
424
+    title.value = "修改${functionName}";
425
+  });
426
+}
427
+
428
+/** 提交按钮 */
429
+function submitForm() {
430
+  proxy.#[[$]]#refs["${businessName}Ref"].validate(valid => {
431
+    if (valid) {
432
+#foreach ($column in $columns)
433
+#if($column.htmlType == "checkbox")
434
+      form.value.$column.javaField = form.value.${column.javaField}.join(",");
435
+#end
436
+#end
437
+      if (form.value.${pkColumn.javaField} != null) {
438
+        update${BusinessName}(form.value).then(response => {
439
+          proxy.#[[$modal]]#.msgSuccess("修改成功");
440
+          open.value = false;
441
+          getList();
442
+        });
443
+      } else {
444
+        add${BusinessName}(form.value).then(response => {
445
+          proxy.#[[$modal]]#.msgSuccess("新增成功");
446
+          open.value = false;
447
+          getList();
448
+        });
449
+      }
450
+    }
451
+  });
452
+}
453
+
454
+/** 删除按钮操作 */
455
+function handleDelete(row) {
456
+  proxy.#[[$modal]]#.confirm('是否确认删除${functionName}编号为"' + row.${pkColumn.javaField} + '"的数据项?').then(function() {
457
+    return del${BusinessName}(row.${pkColumn.javaField});
458
+  }).then(() => {
459
+    getList();
460
+    proxy.#[[$modal]]#.msgSuccess("删除成功");
461
+  }).catch(() => {});
462
+}
463
+
464
+getList();
465
+</script>

+ 567 - 0
ruoyi-modules/ruoyi-gen/src/main/resources/vm/vue/v3/index.vue.vm

@@ -0,0 +1,567 @@
1
+<template>
2
+  <div class="app-container">
3
+    <el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
4
+#foreach($column in $columns)
5
+#if($column.query)
6
+#set($dictType=$column.dictType)
7
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
8
+#set($parentheseIndex=$column.columnComment.indexOf("("))
9
+#if($parentheseIndex != -1)
10
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
11
+#else
12
+#set($comment=$column.columnComment)
13
+#end
14
+#if($column.htmlType == "input")
15
+      <el-form-item label="${comment}" prop="${column.javaField}">
16
+        <el-input
17
+          v-model="queryParams.${column.javaField}"
18
+          placeholder="请输入${comment}"
19
+          clearable
20
+          size="small"
21
+          @keyup.enter="handleQuery"
22
+        />
23
+      </el-form-item>
24
+#elseif(($column.htmlType == "select" || $column.htmlType == "radio") && "" != $dictType)
25
+      <el-form-item label="${comment}" prop="${column.javaField}">
26
+        <el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable size="small">
27
+          <el-option
28
+            v-for="dict in ${dictType}"
29
+            :key="dict.value"
30
+            :label="dict.label"
31
+            :value="dict.value"
32
+          />
33
+        </el-select>
34
+      </el-form-item>
35
+#elseif(($column.htmlType == "select" || $column.htmlType == "radio") && $dictType)
36
+      <el-form-item label="${comment}" prop="${column.javaField}">
37
+        <el-select v-model="queryParams.${column.javaField}" placeholder="请选择${comment}" clearable size="small">
38
+          <el-option label="请选择字典生成" value="" />
39
+        </el-select>
40
+      </el-form-item>
41
+#elseif($column.htmlType == "datetime" && $column.queryType != "BETWEEN")
42
+      <el-form-item label="${comment}" prop="${column.javaField}">
43
+        <el-date-picker clearable size="small"
44
+          v-model="queryParams.${column.javaField}"
45
+          type="date"
46
+          value-format="YYYY-MM-DD"
47
+          placeholder="选择${comment}">
48
+        </el-date-picker>
49
+      </el-form-item>
50
+#elseif($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
51
+      <el-form-item label="${comment}">
52
+        <el-date-picker
53
+          v-model="daterange${AttrName}"
54
+          size="small"
55
+          style="width: 240px"
56
+          value-format="YYYY-MM-DD"
57
+          type="daterange"
58
+          range-separator="-"
59
+          start-placeholder="开始日期"
60
+          end-placeholder="结束日期"
61
+        ></el-date-picker>
62
+      </el-form-item>
63
+#end
64
+#end
65
+#end
66
+      <el-form-item>
67
+        <el-button type="primary" icon="Search" size="mini" @click="handleQuery">搜索</el-button>
68
+        <el-button icon="Refresh" size="mini" @click="resetQuery">重置</el-button>
69
+      </el-form-item>
70
+    </el-form>
71
+
72
+    <el-row :gutter="10" class="mb8">
73
+      <el-col :span="1.5">
74
+        <el-button
75
+          type="primary"
76
+          plain
77
+          icon="Plus"
78
+          size="mini"
79
+          @click="handleAdd"
80
+          v-hasPermi="['${moduleName}:${businessName}:add']"
81
+        >新增</el-button>
82
+      </el-col>
83
+      <el-col :span="1.5">
84
+        <el-button
85
+          type="success"
86
+          plain
87
+          icon="Edit"
88
+          size="mini"
89
+          :disabled="single"
90
+          @click="handleUpdate"
91
+          v-hasPermi="['${moduleName}:${businessName}:edit']"
92
+        >修改</el-button>
93
+      </el-col>
94
+      <el-col :span="1.5">
95
+        <el-button
96
+          type="danger"
97
+          plain
98
+          icon="Delete"
99
+          size="mini"
100
+          :disabled="multiple"
101
+          @click="handleDelete"
102
+          v-hasPermi="['${moduleName}:${businessName}:remove']"
103
+        >删除</el-button>
104
+      </el-col>
105
+      <el-col :span="1.5">
106
+        <el-button
107
+          type="warning"
108
+          plain
109
+          icon="Download"
110
+          size="mini"
111
+          @click="handleExport"
112
+          v-hasPermi="['${moduleName}:${businessName}:export']"
113
+        >导出</el-button>
114
+      </el-col>
115
+      <right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
116
+    </el-row>
117
+
118
+    <el-table v-loading="loading" :data="${businessName}List" @selection-change="handleSelectionChange">
119
+      <el-table-column type="selection" width="55" align="center" />
120
+#foreach($column in $columns)
121
+#set($javaField=$column.javaField)
122
+#set($parentheseIndex=$column.columnComment.indexOf("("))
123
+#if($parentheseIndex != -1)
124
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
125
+#else
126
+#set($comment=$column.columnComment)
127
+#end
128
+#if($column.pk)
129
+      <el-table-column label="${comment}" align="center" prop="${javaField}" />
130
+#elseif($column.list && $column.htmlType == "datetime")
131
+      <el-table-column label="${comment}" align="center" prop="${javaField}" width="180">
132
+        <template #default="scope">
133
+          <span>{{ parseTime(scope.row.${javaField}, '{y}-{m}-{d}') }}</span>
134
+        </template>
135
+      </el-table-column>
136
+#elseif($column.list && "" != $column.dictType)
137
+      <el-table-column label="${comment}" align="center" prop="${javaField}">
138
+        <template #default="scope">
139
+#if($column.htmlType == "checkbox")
140
+          <dict-tag :options="${column.dictType}" :value="scope.row.${javaField} ? scope.row.${javaField}.split(',') : []"/>
141
+#else
142
+          <dict-tag :options="${column.dictType}" :value="scope.row.${javaField}"/>
143
+#end
144
+        </template>
145
+      </el-table-column>
146
+#elseif($column.list && "" != $javaField)
147
+      <el-table-column label="${comment}" align="center" prop="${javaField}" />
148
+#end
149
+#end
150
+      <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
151
+        <template #default="scope">
152
+          <el-button
153
+            size="mini"
154
+            type="text"
155
+            icon="Edit"
156
+            @click="handleUpdate(scope.row)"
157
+            v-hasPermi="['${moduleName}:${businessName}:edit']"
158
+          >修改</el-button>
159
+          <el-button
160
+            size="mini"
161
+            type="text"
162
+            icon="Delete"
163
+            @click="handleDelete(scope.row)"
164
+            v-hasPermi="['${moduleName}:${businessName}:remove']"
165
+          >删除</el-button>
166
+        </template>
167
+      </el-table-column>
168
+    </el-table>
169
+    
170
+    <pagination
171
+      v-show="total>0"
172
+      :total="total"
173
+      v-model:p:page="queryParams.pageNum"
174
+      v-model:p:limit="queryParams.pageSize"
175
+      @pagination="getList"
176
+    />
177
+
178
+    <!-- 添加或修改${functionName}对话框 -->
179
+    <el-dialog :title="title" v-model="open" width="500px" append-to-body>
180
+      <el-form ref="${businessName}Ref" :model="form" :rules="rules" label-width="80px">
181
+#foreach($column in $columns)
182
+#set($field=$column.javaField)
183
+#if($column.insert && !$column.pk)
184
+#if(($column.usableColumn) || (!$column.superColumn))
185
+#set($parentheseIndex=$column.columnComment.indexOf("("))
186
+#if($parentheseIndex != -1)
187
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
188
+#else
189
+#set($comment=$column.columnComment)
190
+#end
191
+#set($dictType=$column.dictType)
192
+#if($column.htmlType == "input")
193
+        <el-form-item label="${comment}" prop="${field}">
194
+          <el-input v-model="form.${field}" placeholder="请输入${comment}" />
195
+        </el-form-item>
196
+#elseif($column.htmlType == "imageUpload")
197
+        <el-form-item label="${comment}">
198
+          <imageUpload v-model="form.${field}"/>
199
+        </el-form-item>
200
+#elseif($column.htmlType == "fileUpload")
201
+        <el-form-item label="${comment}">
202
+          <fileUpload v-model="form.${field}"/>
203
+        </el-form-item>
204
+#elseif($column.htmlType == "editor")
205
+        <el-form-item label="${comment}">
206
+          <editor v-model="form.${field}" :min-height="192"/>
207
+        </el-form-item>
208
+#elseif($column.htmlType == "select" && "" != $dictType)
209
+        <el-form-item label="${comment}" prop="${field}">
210
+          <el-select v-model="form.${field}" placeholder="请选择${comment}">
211
+            <el-option
212
+              v-for="dict in ${dictType}"
213
+              :key="dict.value"
214
+              :label="dict.label"
215
+              #if($column.javaType == "Integer" || $column.javaType == "Long"):value="parseInt(dict.value)"#else:value="dict.value"#end
216
+
217
+            ></el-option>
218
+          </el-select>
219
+        </el-form-item>
220
+#elseif($column.htmlType == "select" && $dictType)
221
+        <el-form-item label="${comment}" prop="${field}">
222
+          <el-select v-model="form.${field}" placeholder="请选择${comment}">
223
+            <el-option label="请选择字典生成" value="" />
224
+          </el-select>
225
+        </el-form-item>
226
+#elseif($column.htmlType == "checkbox" && "" != $dictType)
227
+        <el-form-item label="${comment}">
228
+          <el-checkbox-group v-model="form.${field}">
229
+            <el-checkbox
230
+              v-for="dict in ${dictType}"
231
+              :key="dict.value"
232
+              :label="dict.value">
233
+              {{dict.label}}
234
+            </el-checkbox>
235
+          </el-checkbox-group>
236
+        </el-form-item>
237
+#elseif($column.htmlType == "checkbox" && $dictType)
238
+        <el-form-item label="${comment}">
239
+          <el-checkbox-group v-model="form.${field}">
240
+            <el-checkbox>请选择字典生成</el-checkbox>
241
+          </el-checkbox-group>
242
+        </el-form-item>
243
+#elseif($column.htmlType == "radio" && "" != $dictType)
244
+        <el-form-item label="${comment}">
245
+          <el-radio-group v-model="form.${field}">
246
+            <el-radio
247
+              v-for="dict in ${dictType}"
248
+              :key="dict.value"
249
+              #if($column.javaType == "Integer" || $column.javaType == "Long"):label="parseInt(dict.value)"#else:label="dict.value"#end
250
+
251
+            >{{dict.label}}</el-radio>
252
+          </el-radio-group>
253
+        </el-form-item>
254
+#elseif($column.htmlType == "radio" && $dictType)
255
+        <el-form-item label="${comment}">
256
+          <el-radio-group v-model="form.${field}">
257
+            <el-radio label="1">请选择字典生成</el-radio>
258
+          </el-radio-group>
259
+        </el-form-item>
260
+#elseif($column.htmlType == "datetime")
261
+        <el-form-item label="${comment}" prop="${field}">
262
+          <el-date-picker clearable size="small"
263
+            v-model="form.${field}"
264
+            type="date"
265
+            value-format="YYYY-MM-DD"
266
+            placeholder="选择${comment}">
267
+          </el-date-picker>
268
+        </el-form-item>
269
+#elseif($column.htmlType == "textarea")
270
+        <el-form-item label="${comment}" prop="${field}">
271
+          <el-input v-model="form.${field}" type="textarea" placeholder="请输入内容" />
272
+        </el-form-item>
273
+#end
274
+#end
275
+#end
276
+#end
277
+#if($table.sub)
278
+        <el-divider content-position="center">${subTable.functionName}信息</el-divider>
279
+        <el-row :gutter="10" class="mb8">
280
+          <el-col :span="1.5">
281
+            <el-button type="primary" icon="Plus" size="mini" @click="handleAdd${subClassName}">添加</el-button>
282
+          </el-col>
283
+          <el-col :span="1.5">
284
+            <el-button type="danger" icon="Delete" size="mini" @click="handleDelete${subClassName}">删除</el-button>
285
+          </el-col>
286
+        </el-row>
287
+        <el-table :data="${subclassName}List" :row-class-name="row${subClassName}Index" @selection-change="handle${subClassName}SelectionChange" ref="${subclassName}">
288
+          <el-table-column type="selection" width="50" align="center" />
289
+          <el-table-column label="序号" align="center" prop="index" width="50"/>
290
+#foreach($column in $subTable.columns)
291
+#set($javaField=$column.javaField)
292
+#set($parentheseIndex=$column.columnComment.indexOf("("))
293
+#if($parentheseIndex != -1)
294
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
295
+#else
296
+#set($comment=$column.columnComment)
297
+#end
298
+#if($column.pk || $javaField == ${subTableFkclassName})
299
+#elseif($column.list && "" != $javaField)
300
+          <el-table-column label="$comment" prop="${javaField}">
301
+            <template #default="scope">
302
+              <el-input v-model="scope.row.$javaField" placeholder="请输入$comment" />
303
+            </template>
304
+          </el-table-column>
305
+#end
306
+#end
307
+        </el-table>
308
+#end
309
+      </el-form>
310
+      <template #footer>
311
+        <div class="dialog-footer">
312
+          <el-button type="primary" @click="submitForm">确 定</el-button>
313
+          <el-button @click="cancel">取 消</el-button>
314
+        </div>
315
+      </template>
316
+    </el-dialog>
317
+  </div>
318
+</template>
319
+
320
+<script setup name="${BusinessName}">
321
+import { list${BusinessName}, get${BusinessName}, del${BusinessName}, add${BusinessName}, update${BusinessName} } from "@/api/${moduleName}/${businessName}";
322
+
323
+const { proxy } = getCurrentInstance();
324
+#if(${dicts} != '')
325
+#set($dictsNoSymbol=$dicts.replace("'", ""))
326
+const { ${dictsNoSymbol} } = proxy.useDict(${dicts});
327
+#end
328
+
329
+const ${businessName}List = ref([]);
330
+#if($table.sub)
331
+const ${subclassName}List = ref([]);
332
+#end
333
+const open = ref(false);
334
+const loading = ref(true);
335
+const showSearch = ref(true);
336
+const ids = ref([]);
337
+#if($table.sub)
338
+const checked${subClassName} = ref([]);
339
+#end
340
+const single = ref(true);
341
+const multiple = ref(true);
342
+const total = ref(0);
343
+const title = ref("");
344
+#foreach ($column in $columns)
345
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
346
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
347
+const daterange${AttrName} = ref([]);
348
+#end
349
+#end
350
+
351
+const data = reactive({
352
+  form: {},
353
+  queryParams: {
354
+    pageNum: 1,
355
+    pageSize: 10,
356
+    #foreach ($column in $columns)
357
+#if($column.query)
358
+    $column.javaField: null#if($foreach.count != $columns.size()),#end
359
+#end
360
+#end
361
+  },
362
+  rules: {
363
+    #foreach ($column in $columns)
364
+#if($column.required)
365
+#set($parentheseIndex=$column.columnComment.indexOf("("))
366
+#if($parentheseIndex != -1)
367
+#set($comment=$column.columnComment.substring(0, $parentheseIndex))
368
+#else
369
+#set($comment=$column.columnComment)
370
+#end
371
+    $column.javaField: [
372
+      { required: true, message: "$comment不能为空", trigger: #if($column.htmlType == "select")"change"#else"blur"#end }
373
+    ]#if($foreach.count != $columns.size()),#end
374
+#end
375
+#end
376
+  }
377
+});
378
+
379
+const { queryParams, form, rules } = toRefs(data);
380
+
381
+/** 查询${functionName}列表 */
382
+function getList() {
383
+  loading.value = true;
384
+#foreach ($column in $columns)
385
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
386
+  queryParams.value.params = {};
387
+#break
388
+#end
389
+#end
390
+#foreach ($column in $columns)
391
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
392
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
393
+  if (null != daterange${AttrName} && '' != daterange${AttrName}) {
394
+    queryParams.value.params["begin${AttrName}"] = daterange${AttrName}.value[0];
395
+    queryParams.value.params["end${AttrName}"] = daterange${AttrName}.value[1];
396
+  }
397
+#end
398
+#end
399
+  list${BusinessName}(queryParams.value).then(response => {
400
+    ${businessName}List.value = response.rows;
401
+    total.value = response.total;
402
+    loading.value = false;
403
+  });
404
+}
405
+
406
+// 取消按钮
407
+function cancel() {
408
+  open.value = false;
409
+  reset();
410
+}
411
+
412
+// 表单重置
413
+function reset() {
414
+  form.value = {
415
+#foreach ($column in $columns)
416
+#if($column.htmlType == "radio")
417
+    $column.javaField: #if($column.javaType == "Integer" || $column.javaType == "Long")0#else"0"#end#if($foreach.count != $columns.size()),#end
418
+#elseif($column.htmlType == "checkbox")
419
+    $column.javaField: []#if($foreach.count != $columns.size()),#end
420
+#else
421
+    $column.javaField: null#if($foreach.count != $columns.size()),#end
422
+#end
423
+#end
424
+  };
425
+#if($table.sub)
426
+  ${subclassName}List.value = [];
427
+#end
428
+  proxy.resetForm("${businessName}Ref");
429
+}
430
+
431
+/** 搜索按钮操作 */
432
+function handleQuery() {
433
+  queryParams.value.pageNum = 1;
434
+  getList();
435
+}
436
+
437
+/** 重置按钮操作 */
438
+function resetQuery() {
439
+#foreach ($column in $columns)
440
+#if($column.htmlType == "datetime" && $column.queryType == "BETWEEN")
441
+#set($AttrName=$column.javaField.substring(0,1).toUpperCase() + ${column.javaField.substring(1)})
442
+  daterange${AttrName}.value = [];
443
+#end
444
+#end
445
+  proxy.resetForm("queryRef");
446
+  handleQuery();
447
+}
448
+
449
+// 多选框选中数据
450
+function handleSelectionChange(selection) {
451
+  ids.value = selection.map(item => item.${pkColumn.javaField});
452
+  single.value = selection.length != 1;
453
+  multiple.value = !selection.length;
454
+}
455
+
456
+/** 新增按钮操作 */
457
+function handleAdd() {
458
+  reset();
459
+  open.value = true;
460
+  title.value = "添加${functionName}";
461
+}
462
+
463
+/** 修改按钮操作 */
464
+function handleUpdate(row) {
465
+  reset();
466
+  const ${pkColumn.javaField} = row.${pkColumn.javaField} || ids.value
467
+  get${BusinessName}(${pkColumn.javaField}).then(response => {
468
+    form.value = response.data;
469
+#foreach ($column in $columns)
470
+#if($column.htmlType == "checkbox")
471
+    form.value.$column.javaField = form.value.${column.javaField}.split(",");
472
+#end
473
+#end
474
+#if($table.sub)
475
+    ${subclassName}List.value = response.data.${subclassName}List;
476
+#end
477
+    open.value = true;
478
+    title.value = "修改${functionName}";
479
+  });
480
+}
481
+
482
+/** 提交按钮 */
483
+function submitForm() {
484
+  proxy.#[[$]]#refs["${businessName}Ref"].validate(valid => {
485
+    if (valid) {
486
+#foreach ($column in $columns)
487
+#if($column.htmlType == "checkbox")
488
+      form.value.$column.javaField = form.value.${column.javaField}.join(",");
489
+#end
490
+#end
491
+#if($table.sub)
492
+      form.value.${subclassName}List = ${subclassName}List.value;
493
+#end
494
+      if (form.value.${pkColumn.javaField} != null) {
495
+        update${BusinessName}(form.value).then(response => {
496
+          proxy.#[[$modal]]#.msgSuccess("修改成功");
497
+          open.value = false;
498
+          getList();
499
+        });
500
+      } else {
501
+        add${BusinessName}(form.value).then(response => {
502
+          proxy.#[[$modal]]#.msgSuccess("新增成功");
503
+          open.value = false;
504
+          getList();
505
+        });
506
+      }
507
+    }
508
+  });
509
+}
510
+
511
+/** 删除按钮操作 */
512
+function handleDelete(row) {
513
+  const ${pkColumn.javaField}s = row.${pkColumn.javaField} || ids.value;
514
+  proxy.#[[$modal]]#.confirm('是否确认删除${functionName}编号为"' + ${pkColumn.javaField}s + '"的数据项?').then(function() {
515
+    return del${BusinessName}(${pkColumn.javaField}s);
516
+  }).then(() => {
517
+    getList();
518
+    proxy.#[[$modal]]#.msgSuccess("删除成功");
519
+  }).catch(() => {});
520
+}
521
+
522
+#if($table.sub)
523
+/** ${subTable.functionName}序号 */
524
+function row${subClassName}Index({ row, rowIndex }) {
525
+  row.index = rowIndex + 1;
526
+}
527
+
528
+/** ${subTable.functionName}添加按钮操作 */
529
+function handleAdd${subClassName}() {
530
+  let obj = {};
531
+#foreach($column in $subTable.columns)
532
+#if($column.pk || $column.javaField == ${subTableFkclassName})
533
+#elseif($column.list && "" != $javaField)
534
+  obj.$column.javaField = "";
535
+#end
536
+#end
537
+  ${subclassName}List.value.push(obj);
538
+}
539
+
540
+/** ${subTable.functionName}删除按钮操作 */
541
+function handleDelete${subClassName}() {
542
+  if (checked${subClassName}.value.length == 0) {
543
+    proxy.#[[$modal]]#.msgError("请先选择要删除的${subTable.functionName}数据");
544
+  } else {
545
+    const ${subclassName}s = ${subclassName}List.value;
546
+    const checked${subClassName}s = checked${subClassName}.value;
547
+    ${subclassName}List.value = ${subclassName}s.filter(function(item) {
548
+      return checked${subClassName}s.indexOf(item.index) == -1
549
+    });
550
+  }
551
+}
552
+
553
+/** 复选框选中数据 */
554
+function handle${subClassName}SelectionChange(selection) {
555
+  checked${subClassName}.value = selection.map(item => item.index)
556
+}
557
+
558
+#end
559
+/** 导出按钮操作 */
560
+function handleExport() {
561
+  proxy.download('${moduleName}/${businessName}/export', {
562
+    ...queryParams.value
563
+  }, `${businessName}_#[[${new Date().getTime()}]]#.xlsx`)
564
+}
565
+
566
+getList();
567
+</script>

+ 1 - 0
ruoyi-modules/ruoyi-gen/src/main/resources/vm/vue/v3/readme.txt

@@ -0,0 +1 @@
1
+如果使用的是RuoYi-Cloud-Vue3前端,那么需要覆盖一下此目录的模板index.vue.vm、index-tree.vue.vm文件到上级vue目录。