tianyunperfect 2 роки тому
батько
коміт
a0baf5538a
2 змінених файлів з 257 додано та 3 видалено
  1. 219 0
      jinja2-demo/results/templates/vue_table.j2
  2. 38 3
      jinja2-demo/test.py

+ 219 - 0
jinja2-demo/results/templates/vue_table.j2

@@ -0,0 +1,219 @@
+<template>
+  <div class="app-container">
+    <el-form :inline="true" :model="param" class="demo-form-inline">
+      {% for table in table_objs -%}
+      {% if table['search'] == True -%}
+        <el-form-item label="{{ table['label'] }}">
+          <el-input v-model="param.{{ table['prop'] }}" placeholder="{{ table['label'] }}"/>
+        </el-form-item>
+      {% endif -%}
+      {% endfor -%}
+      <el-form-item>
+        <el-button type="primary" @click="queryList">查询</el-button>
+      </el-form-item>
+    </el-form>
+    <template>
+      <!--添加-->
+      <el-row>
+        <el-button @click="createOne()">添加</el-button>
+      </el-row>
+      <!--数据-->
+      <el-table
+          :data="tableData"
+          border
+          style="width: 100%"
+      >
+        {% for table in table_objs -%}
+        <el-table-column
+            prop="{{ table['prop'] }}"
+            label="{{ table['label'] }}"
+            width="{{ table['width'] }}"
+        />
+        {% endfor -%}
+        <el-table-column
+            fixed="right"
+            label="操作"
+            width="100"
+        >
+          <template slot-scope="scope">
+            <el-button
+                type="text"
+                size="small"
+                @click="editOne(scope.row)"
+            >编辑
+            </el-button>
+            <el-button
+                size="small"
+                type="text"
+                @click="deleteAlert(scope.row.id)"
+            >删除
+            </el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+
+      <!--编辑层-->
+      <el-dialog title="编辑" :visible.sync="dialogFormVisible">
+        <el-form :model="editNews">
+          {% for table in table_objs -%}
+          {% if table['edit'] == True -%}
+          <el-form-item label="{{ table['label'] }}" :label-width="formLabelWidth">
+            <el-input v-model="editNews.{{ table['prop'] }}" placeholder="{{ table['label'] }}"/>
+          </el-form-item>
+          {% endif -%}
+          {% endfor -%}
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogFormVisible = false">取 消</el-button>
+          <el-button type="primary" @click="saveOne">确 定</el-button>
+        </div>
+      </el-dialog>
+
+      <!--删除提示-->
+      <el-dialog
+          title="提示"
+          :visible.sync="dialogVisible"
+          width="30%"
+          :before-close="handleClose"
+      >
+        <span>真的要删吗?</span>
+        <div slot="footer" class="dialog-footer">
+          <el-button @click="dialogVisible = false">取 消</el-button>
+          <el-button type="primary" @click="deleteOne">确 定</el-button>
+        </div>
+      </el-dialog>
+
+      <!--分页-->
+      <div class="block">
+        <el-pagination
+            :current-page="param.page"
+            :page-sizes="[10, 20, 30, 40]"
+            :page-size="param.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+        />
+      </div>
+    </template>
+  </div>
+</template>
+
+<script>
+import {deleteOne, fetchList, fetchOne, saveOne} from '@/api/{{ table_name }}'
+
+export default {
+  name: "{{ table_name.capitalize() }}",
+  data() {
+    return {
+      tableData: [],
+      // 删除层隐藏
+      dialogVisible: false,
+      // 弹出层隐藏
+      dialogFormVisible: false,
+      // 弹出层内容
+      editNews: {
+        {% for table in table_objs -%}
+        {% if table['edit'] == True -%}
+        {{ table['prop'] }}: "",
+        {% endif -%}
+        {% endfor -%}
+      },
+      // 弹出层大小
+      formLabelWidth: '120px',
+      // 删除使用的id
+      id: '',
+      // 查询参数
+      param: {
+        {% for table in table_objs -%}
+        {% if table['search'] == True -%}
+        {{ table['prop'] }}: "",
+        {% endif -%}
+        {% endfor -%}
+        page: 1,
+        size: 10
+      },
+      // 查询返回总条数
+      total: 0
+    }
+  },
+  mounted() {
+    this.queryList()
+  },
+  methods: {
+    // 修改页面展示数据大小
+    handleSizeChange(val) {
+      this.param.size = val
+      this.queryList()
+    },
+    // 修改页码
+    handleCurrentChange(val) {
+      this.param.page = val
+      this.queryList()
+    },
+    // 点击编辑,从后台获取数据
+    editOne(row) {
+      console.log(row)
+      fetchOne(row.id).then(res => {
+        if (res.flag) {
+          this.editNews = res.data
+        }
+      })
+      this.dialogFormVisible = true
+    },
+    // 获取删除行的id
+    deleteAlert(id) {
+      this.id = id
+      this.dialogVisible = true
+    },
+    // 删除
+    deleteOne() {
+      deleteOne(this.id).then(res => {
+        if (res.flag) {
+          this.dialogFormVisible = false
+          this.queryList()
+        } else {
+          alert('删除失败')
+        }
+      })
+      this.dialogVisible = false
+    },
+    // 关闭提示框时,提示是否要关闭
+    handleClose(done) {
+      this.$confirm('确认关闭?')
+          .then(() => {
+            done()
+          })
+          .catch(() => {
+          })
+    },
+    // 点击添加按钮清空
+    createOne() {
+      this.editNews = {}
+      this.dialogFormVisible = true
+    },
+    // 点击确定后发送请求
+    saveOne() {
+      saveOne(this.editNews).then(res => {
+        if (res.flag) {
+          this.dialogFormVisible = false
+          this.queryList()
+        } else {
+          this.$message('添加失败')
+        }
+      })
+    },
+    // 获取数据
+    queryList() {
+      fetchList(this.param).then(res => {
+        if (res.flag) {
+          this.tableData = res.data.list
+          this.total = res.data.total
+        } else {
+          this.tableData = {}
+        }
+      })
+    }
+  }
+}
+</script>

+ 38 - 3
jinja2-demo/test.py

@@ -3,11 +3,46 @@ from jinja2 import Environment, PackageLoader
 env = Environment(loader=PackageLoader('results'))
 
 
-def write_file(j2_file, param):
+def write_file(j2_file, to_file, param):
     template = env.get_template(j2_file)
     content = template.render(**param)
-    with open('./test.conf', 'w') as fp:
+    with open(to_file, 'w') as fp:
         fp.write(content)
 
 
-write_file("test.j2", {"name": 'xiaoxiao1', "age": '18', "country": 'China'})
+# write_file("test.j2", './test.conf', {"name": 'xiaoxiao1', "age": '18', "country": 'China'})
+
+vue_obj = {
+    "table_name": "table2",
+    "table_objs": [
+        {
+            "prop": "name",
+            "label": "姓名",
+            "width": "150",
+            "search": True,
+            "edit": True
+        },
+        {
+            "prop": "age",
+            "label": "年龄",
+            "width": "150",
+            "search": True,
+            "edit": True
+        },
+        {
+            "prop": "date",
+            "label": "日期",
+            "width": "150",
+            "search": True,
+            "edit": False
+        },
+        {
+            "prop": "email",
+            "label": "email地址",
+            "width": "300",
+            "search": False,
+            "edit": True
+        }
+    ]
+}
+write_file("vue_table.j2", "./test.vue", vue_obj)