ylyx-cli 1.0.0

package/templates/vue-app/files/src/views/features/401.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="errPage-container">
+    <el-button icon="arrow-left" class="pan-back-btn" @click="back"> 返回 </el-button>
+    <el-row>
+      <el-col :span="12">
+        <h1 class="text-jumbo text-ginormous">Oops!</h1>
+        <h2>你没有权限去该页面</h2>
+        <h6>如有不满请联系你领导</h6>
+        <ul class="list-unstyled">
+          <li>或者你可以去:</li>
+          <li class="link-type">
+            <router-link to="/dashboard"> 回首页 </router-link>
+          </li>
+        </ul>
+      </el-col>
+      <el-col :span="12">
+        <img :src="errGif" width="313" height="428" alt="Girl has dropped her ice cream." />
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import errGif from '@/assets/401_images/401.gif';
+
+export default {
+  name: 'Page401',
+  data() {
+    return {
+      errGif: errGif + '?' + +new Date(),
+    };
+  },
+  methods: {
+    back() {
+      if (this.$route.query.noGoBack) {
+        this.$router.push({ path: '/dashboard' });
+      } else {
+        this.$router.go(-1);
+      }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.errPage-container {
+  width: 800px;
+  max-width: 100%;
+  margin: 100px auto;
+  .pan-back-btn {
+    background: #008489;
+    color: #fff;
+    border: none !important;
+  }
+  .pan-gif {
+    margin: 0 auto;
+    display: block;
+  }
+  .pan-img {
+    display: block;
+    margin: 0 auto;
+    width: 100%;
+  }
+  .text-jumbo {
+    font-size: 60px;
+    font-weight: 700;
+    color: #484848;
+  }
+  .list-unstyled {
+    font-size: 14px;
+    li {
+      padding-bottom: 5px;
+    }
+    a {
+      color: #008489;
+      text-decoration: none;
+      &:hover {
+        text-decoration: underline;
+      }
+    }
+  }
+}
+</style>

package/templates/vue-app/files/src/views/features/404.vue

@@ -0,0 +1,226 @@
+<template>
+  <div class="wscn-http404-container">
+    <div class="wscn-http404">
+      <div class="pic-404">
+        <img class="pic-404__parent" src="@/assets/404_images/404.png" alt="404" />
+        <img class="pic-404__child left" src="@/assets/404_images/404_cloud.png" alt="404" />
+        <img class="pic-404__child mid" src="@/assets/404_images/404_cloud.png" alt="404" />
+        <img class="pic-404__child right" src="@/assets/404_images/404_cloud.png" alt="404" />
+      </div>
+      <div class="bullshit">
+        <div class="bullshit__oops">OOPS!</div>
+        <div class="bullshit__headline">{{ message }}</div>
+        <div class="bullshit__info">
+          请检查您输入的网址是否正确，请点击以下按钮返回主页或者发送错误报告
+        </div>
+        <a href="/" class="bullshit__return-home">返回首页</a>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Page404',
+  computed: {
+    message() {
+      return '网管说这个页面你不能进......';
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss" scoped>
+.wscn-http404-container {
+  transform: translate(-50%, -50%);
+  position: absolute;
+  top: 40%;
+  left: 50%;
+}
+.wscn-http404 {
+  position: relative;
+  width: 1200px;
+  padding: 0 50px;
+  overflow: hidden;
+  .pic-404 {
+    position: relative;
+    float: left;
+    width: 600px;
+    overflow: hidden;
+    &__parent {
+      width: 100%;
+    }
+    &__child {
+      position: absolute;
+      &.left {
+        width: 80px;
+        top: 17px;
+        left: 220px;
+        opacity: 0;
+        animation-name: cloudLeft;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      &.mid {
+        width: 46px;
+        top: 10px;
+        left: 420px;
+        opacity: 0;
+        animation-name: cloudMid;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1.2s;
+      }
+      &.right {
+        width: 62px;
+        top: 100px;
+        left: 500px;
+        opacity: 0;
+        animation-name: cloudRight;
+        animation-duration: 2s;
+        animation-timing-function: linear;
+        animation-fill-mode: forwards;
+        animation-delay: 1s;
+      }
+      @keyframes cloudLeft {
+        0% {
+          top: 17px;
+          left: 220px;
+          opacity: 0;
+        }
+        20% {
+          top: 33px;
+          left: 188px;
+          opacity: 1;
+        }
+        80% {
+          top: 81px;
+          left: 92px;
+          opacity: 1;
+        }
+        100% {
+          top: 97px;
+          left: 60px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudMid {
+        0% {
+          top: 10px;
+          left: 420px;
+          opacity: 0;
+        }
+        20% {
+          top: 40px;
+          left: 360px;
+          opacity: 1;
+        }
+        70% {
+          top: 130px;
+          left: 180px;
+          opacity: 1;
+        }
+        100% {
+          top: 160px;
+          left: 120px;
+          opacity: 0;
+        }
+      }
+      @keyframes cloudRight {
+        0% {
+          top: 100px;
+          left: 500px;
+          opacity: 0;
+        }
+        20% {
+          top: 120px;
+          left: 460px;
+          opacity: 1;
+        }
+        80% {
+          top: 180px;
+          left: 340px;
+          opacity: 1;
+        }
+        100% {
+          top: 200px;
+          left: 300px;
+          opacity: 0;
+        }
+      }
+    }
+  }
+  .bullshit {
+    position: relative;
+    float: left;
+    width: 300px;
+    padding: 30px 0;
+    overflow: hidden;
+    &__oops {
+      font-size: 32px;
+      font-weight: bold;
+      line-height: 40px;
+      color: #1482f0;
+      opacity: 0;
+      margin-bottom: 20px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-fill-mode: forwards;
+    }
+    &__headline {
+      font-size: 20px;
+      line-height: 24px;
+      color: #222;
+      font-weight: bold;
+      opacity: 0;
+      margin-bottom: 10px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.1s;
+      animation-fill-mode: forwards;
+    }
+    &__info {
+      font-size: 13px;
+      line-height: 21px;
+      color: grey;
+      opacity: 0;
+      margin-bottom: 30px;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.2s;
+      animation-fill-mode: forwards;
+    }
+    &__return-home {
+      display: block;
+      float: left;
+      width: 110px;
+      height: 36px;
+      background: #1482f0;
+      border-radius: 100px;
+      text-align: center;
+      color: #ffffff;
+      opacity: 0;
+      font-size: 14px;
+      line-height: 36px;
+      cursor: pointer;
+      animation-name: slideUp;
+      animation-duration: 0.5s;
+      animation-delay: 0.3s;
+      animation-fill-mode: forwards;
+    }
+    @keyframes slideUp {
+      0% {
+        transform: translateY(60px);
+        opacity: 0;
+      }
+      100% {
+        transform: translateY(0);
+        opacity: 1;
+      }
+    }
+  }
+}
+</style>

package/templates/vue-app/files/src/views/features/redirect.vue

@@ -0,0 +1,12 @@
+<script>
+export default {
+  created() {
+    const { params, query } = this.$route;
+    const { path } = params;
+    this.$router.replace({ path: '/' + path, query });
+  },
+  render: function (h) {
+    return h(); // avoid warning message
+  },
+};
+</script>

package/templates/vue-app/files/src/views/generator/config.vue

@@ -0,0 +1,348 @@
+<template>
+  <div class="app-container">
+    <el-row :gutter="15">
+      <el-col style="margin-bottom: 10px">
+        <el-card class="box-card" shadow="never">
+          <div slot="header" class="clearfix">
+            <span class="role-span">字段配置：{{ tableName }}</span>
+            <el-button
+              :loading="genLoading"
+              icon="el-icon-s-promotion"
+              size="mini"
+              style="float: right; padding: 6px 9px"
+              type="success"
+              @click="toGen"
+              >保存&生成</el-button
+            >
+            <el-button
+              :loading="columnLoading"
+              icon="el-icon-check"
+              size="mini"
+              style="float: right; padding: 6px 9px; margin-right: 9px"
+              type="primary"
+              @click="saveColumnConfig"
+              >保存</el-button
+            >
+            <el-tooltip
+              class="item"
+              effect="dark"
+              content="数据库中表字段变动时使用该功能"
+              placement="top-start">
+              <el-button
+                :loading="syncLoading"
+                icon="el-icon-refresh"
+                size="mini"
+                style="float: right; padding: 6px 9px"
+                type="info"
+                @click="sync"
+                >同步</el-button
+              >
+            </el-tooltip>
+          </div>
+          <el-form size="small" label-width="90px">
+            <el-table
+              v-loading="loading"
+              :data="data"
+              :max-height="tableHeight"
+              size="small"
+              style="width: 100%; margin-bottom: 15px">
+              <el-table-column prop="columnName" label="字段名称" />
+              <el-table-column prop="columnType" label="字段类型" />
+              <el-table-column prop="remark" label="字段描述">
+                <template slot-scope="scope">
+                  <el-input v-model="data[scope.$index].remark" size="mini" class="edit-input" />
+                </template>
+              </el-table-column>
+              <el-table-column align="center" label="必填" width="70px">
+                <template slot-scope="scope">
+                  <el-checkbox v-model="data[scope.$index].notNull" />
+                </template>
+              </el-table-column>
+              <el-table-column align="center" label="列表" width="70px">
+                <template slot-scope="scope">
+                  <el-checkbox v-model="data[scope.$index].listShow" />
+                </template>
+              </el-table-column>
+              <el-table-column align="center" label="表单" width="70px">
+                <template slot-scope="scope">
+                  <el-checkbox v-model="data[scope.$index].formShow" />
+                </template>
+              </el-table-column>
+              <el-table-column label="表单类型">
+                <template slot-scope="scope">
+                  <el-select
+                    v-model="data[scope.$index].formType"
+                    filterable
+                    class="edit-input"
+                    clearable
+                    size="mini"
+                    placeholder="请选择">
+                    <el-option label="文本框" value="Input" />
+                    <el-option label="文本域" value="Textarea" />
+                    <el-option label="单选框" value="Radio" />
+                    <el-option label="下拉框" value="Select" />
+                    <el-option label="日期框" value="Date" />
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column label="查询方式">
+                <template slot-scope="scope">
+                  <el-select
+                    v-model="data[scope.$index].queryType"
+                    filterable
+                    class="edit-input"
+                    clearable
+                    size="mini"
+                    placeholder="请选择">
+                    <el-option label="=" value="=" />
+                    <el-option label="!=" value="!=" />
+                    <el-option label=">=" value=">=" />
+                    <el-option label="<=" value="<=" />
+                    <el-option label="Like" value="Like" />
+                    <el-option label="NotNull" value="NotNull" />
+                    <el-option label="BetWeen" value="BetWeen" />
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column label="日期注解">
+                <template slot-scope="scope">
+                  <el-select
+                    v-model="data[scope.$index].dateAnnotation"
+                    filterable
+                    class="edit-input"
+                    clearable
+                    size="mini"
+                    placeholder="请选择">
+                    <el-option label="自动创建时间" value="CreationTimestamp" />
+                    <el-option label="自动更新时间" value="UpdateTimestamp" />
+                  </el-select>
+                </template>
+              </el-table-column>
+              <el-table-column label="关联字典">
+                <template slot-scope="scope">
+                  <el-select
+                    v-model="data[scope.$index].dictName"
+                    filterable
+                    class="edit-input"
+                    clearable
+                    size="mini"
+                    placeholder="请选择">
+                    <el-option
+                      v-for="item in dicts"
+                      :key="item.id"
+                      :label="item.remark === '' ? item.name : item.remark"
+                      :value="item.name" />
+                  </el-select>
+                </template>
+              </el-table-column>
+            </el-table>
+          </el-form>
+        </el-card>
+      </el-col>
+      <el-col>
+        <el-card class="box-card" shadow="never">
+          <div slot="header" class="clearfix">
+            <span class="role-span">生成配置</span>
+            <el-button
+              :loading="configLoading"
+              icon="el-icon-check"
+              size="mini"
+              style="float: right; padding: 6px 9px"
+              type="primary"
+              @click="doSubmit"
+              >保存</el-button
+            >
+          </div>
+          <el-form ref="form" :model="form" :rules="rules" size="small" label-width="78px">
+            <el-form-item label="作者名称" prop="author">
+              <el-input v-model="form.author" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px">类上面的作者名称</span>
+            </el-form-item>
+            <el-form-item label="模块名称" prop="moduleName">
+              <el-input v-model="form.moduleName" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px"
+                >模块的名称，请选择项目中已存在的模块</span
+              >
+            </el-form-item>
+            <el-form-item label="至于包下" prop="pack">
+              <el-input v-model="form.pack" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px"
+                >项目包的名称，生成的代码放到哪个包里面</span
+              >
+            </el-form-item>
+            <el-form-item label="接口名称" prop="apiAlias">
+              <el-input v-model="form.apiAlias" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px"
+                >接口的名称，用于控制器与接口文档中</span
+              >
+            </el-form-item>
+            <el-form-item label="前端路径" prop="path">
+              <el-input v-model="form.path" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px"
+                >输入views文件夹下的目录，不存在即创建</span
+              >
+            </el-form-item>
+            <!--            <el-form-item label="接口目录">-->
+            <!--              <el-input v-model="form.apiPath" style="width: 40%" />-->
+            <!--              <span style="color: #C0C0C0;margin-left: 10px;">Api存放路径[src/api]，为空则自动生成路径</span>-->
+            <!--            </el-form-item>-->
+            <el-form-item label="去表前缀" prop="prefix">
+              <el-input v-model="form.prefix" placeholder="默认不去除表前缀" style="width: 40%" />
+              <span style="color: #c0c0c0; margin-left: 10px">默认不去除表前缀，可自定义</span>
+            </el-form-item>
+            <el-form-item label="是否覆盖" prop="cover">
+              <el-radio-group v-model="form.cover" size="mini" style="width: 40%">
+                <el-radio-button label="true">是</el-radio-button>
+                <el-radio-button label="false">否</el-radio-button>
+              </el-radio-group>
+              <span style="color: #c0c0c0; margin-left: 10px">谨防误操作，请慎重选择</span>
+            </el-form-item>
+          </el-form>
+        </el-card>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script>
+import crud from '@/mixins/crud';
+import { update, get } from '@/api/generator/genConfig';
+import { save, sync, generator } from '@/api/generator/generator';
+import { getDicts } from '@/api/system/dict';
+export default {
+  name: 'GeneratorConfig',
+  components: {},
+  mixins: [crud],
+  data() {
+    return {
+      activeName: 'first',
+      tableName: '',
+      tableHeight: 550,
+      columnLoading: false,
+      configLoading: false,
+      dicts: [],
+      syncLoading: false,
+      genLoading: false,
+      form: {
+        id: null,
+        tableName: '',
+        author: '',
+        pack: '',
+        path: '',
+        moduleName: '',
+        cover: 'false',
+        apiPath: '',
+        prefix: '',
+        apiAlias: null,
+      },
+      rules: {
+        author: [{ required: true, message: '作者不能为空', trigger: 'blur' }],
+        pack: [{ required: true, message: '包路径不能为空', trigger: 'blur' }],
+        moduleName: [{ required: true, message: '包路径不能为空', trigger: 'blur' }],
+        path: [{ required: true, message: '前端路径不能为空', trigger: 'blur' }],
+        apiAlias: [{ required: true, message: '接口名称不能为空', trigger: 'blur' }],
+        cover: [{ required: true, message: '不能为空', trigger: 'blur' }],
+      },
+    };
+  },
+  created() {
+    this.tableHeight = document.documentElement.clientHeight - 385;
+    this.tableName = this.$route.params.tableName;
+    this.$nextTick(() => {
+      this.init();
+      get(this.tableName).then(data => {
+        this.form = data;
+        this.form.cover = this.form.cover.toString();
+      });
+      getDicts().then(data => {
+        this.dicts = data;
+      });
+    });
+  },
+  methods: {
+    beforeInit() {
+      this.url = 'api/generator/columns';
+      const tableName = this.tableName;
+      this.params = { tableName };
+      return true;
+    },
+    saveColumnConfig() {
+      this.columnLoading = true;
+      save(this.data)
+        .then(res => {
+          this.notify('保存成功', 'success');
+          this.columnLoading = false;
+        })
+        .catch(err => {
+          this.columnLoading = false;
+          console.warn(err.message);
+        });
+    },
+    doSubmit() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          this.configLoading = true;
+          update(this.form)
+            .then(res => {
+              this.notify('保存成功', 'success');
+              this.form = res;
+              this.form.cover = this.form.cover.toString();
+              this.configLoading = false;
+            })
+            .catch(err => {
+              this.configLoading = false;
+              console.warn(err.message);
+            });
+        }
+      });
+    },
+    sync() {
+      this.syncLoading = true;
+      sync([this.tableName])
+        .then(() => {
+          this.init();
+          this.notify('同步成功', 'success');
+          this.syncLoading = false;
+        })
+        .then(() => {
+          this.syncLoading = false;
+        });
+    },
+    toGen() {
+      this.genLoading = true;
+      save(this.data)
+        .then(res => {
+          this.notify('保存成功', 'success');
+          // 生成代码
+          generator(this.tableName, 0)
+            .then(data => {
+              this.genLoading = false;
+              this.notify('生成成功', 'success');
+            })
+            .catch(err => {
+              this.genLoading = false;
+              console.warn(err.message);
+            });
+        })
+        .catch(err => {
+          this.genLoading = false;
+          console.warn(err.message);
+        });
+    },
+  },
+};
+</script>
+
+<style rel="stylesheet/scss" lang="scss">
+.edit-input {
+  .el-input__inner {
+    border: 1px solid #e5e6e7;
+  }
+}
+</style>
+
+<style scoped>
+::v-deep .input-with-select .el-input-group__prepend {
+  background-color: #fff;
+}
+</style>