ljr-cli 1.0.0 → 1.0.2

package/lib/templates/vue2.7.16/src/views/about.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="about">
+    <h1>此项目是vue2模版</h1>
+  </div>
+</template>

package/lib/templates/vue2.7.16/src/views/demo//345/205/250/345/261/200store/346/225/260/346/215/256/345/255/227/345/205/270/index.vue

@@ -0,0 +1,85 @@
+<template>
+  <div class="c-card-container">
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>全局store示例</span>
+      </div>
+      <div class="c-mb10">在创建生命周期直接初始化了，如果需要清空请点击按钮</div>
+      <div style="text-align: right">
+        <el-button type="primary" size="small" @click="printAllDD"> 打印全部数据字典 </el-button>
+        <el-button type="danger" size="small" @click="clearAllDD"> 清空全部数据字典 </el-button>
+        <el-button type="primary" size="small" @click="printStore"> 打印$store </el-button>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>性别的数据字典</span>
+      </div>
+      <div class="c-mb10">数据：{{ $store.getters.dd.sex }}</div>
+      <div class="c-mb10">编码转换名称：{{ $root.ddCodeToName({ sex: "1" }) }}</div>
+      <div class="c-mb10">
+        使用在select组件上：
+        <el-select v-model="activeCity" placeholder="请选择">
+          <el-option v-for="item in $store.getters.dd.sex" :key="item.value" :label="item.label" :value="item.value">
+          </el-option>
+        </el-select>
+      </div>
+      <div style="text-align: right">
+        <el-button type="primary" size="small" @click="getDD('sex')"> 获取性别数据字典 </el-button>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>城市的数据字典</span>
+      </div>
+      <div class="c-mb10">数据：{{ $store.getters.dd.citys }}</div>
+      <div class="c-mb10">编码转换名称：{{ $root.ddCodeToName({ citys: "5" }) }}</div>
+      <div class="c-mb10">
+        使用在select组件上：
+        <el-select v-model="activeCity" placeholder="请选择">
+          <el-option v-for="item in $store.getters.dd.citys" :key="item.value" :label="item.label" :value="item.value">
+          </el-option>
+        </el-select>
+      </div>
+      <div style="text-align: right">
+        <el-button type="primary" size="small" @click="getDD('citys')"> 获取城市数据字典 </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      activeSex: "",
+      activeCity: "",
+    }
+  },
+  created() {
+    // 使用的页面需要调用一下getDD方法，如果数据字典的code !== null，则不会再次请求
+    this.$store.dispatch("getDD", "sex")
+    this.$store.dispatch("getDD", "citys")
+  },
+  methods: {
+    /** 清空全部数据字典 */
+    clearAllDD() {
+      this.$store.commit("CLEAR_DD")
+    },
+    /** 获取数据字典 */
+    getDD(type) {
+      this.$store.dispatch("getDD", type)
+    },
+    /** 打印全部数据字典 */
+    printAllDD() {
+      console.log("全部数据字典=====>", this.$store.getters.dd)
+    },
+    /** 打印$store */
+    printStore() {
+      console.log("$store=====>", this.$store)
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/demo//345/205/250/345/261/200/345/274/271/347/252/227/ce.vue

@@ -0,0 +1,42 @@
+<template>
+  <el-dialog v-bind="$props" :visible="visible" width="700px" @close="close()">
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <p>111</p>
+    <div slot="footer">
+      <el-button :loading="loading" :disabled="loading" @click="close()">取消</el-button>
+      <el-button :loading="loading" :disabled="loading" type="primary" @click="submit()">确认</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+export default {
+  props: {
+    fatherItem: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      loading: false,
+    }
+  },
+  created() {
+    console.log("fatherItem=====>", this.fatherItem)
+  },
+  methods: {
+    submit() {
+      this.close(true)
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/demo//345/205/250/345/261/200/345/274/271/347/252/227/index.vue

@@ -0,0 +1,24 @@
+<template>
+  <div>
+    <el-button type="primary" @click="ce()"> 新增 </el-button>
+    <el-button type="primary" @click="ce({ name: '张三', age: 18 })"> 编辑 </el-button>
+  </div>
+</template>
+
+<script>
+export default {
+  methods: {
+    ce(row) {
+      this.$LDialog(require("./ce.vue"), {
+        title: row ? "编辑" : "新增",
+        fatherItem: row,
+        on: {
+          refresh: () => {
+            console.log("刷新方法")
+          },
+        },
+      })
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/demo//345/205/250/345/261/200/346/214/207/344/273/244/index.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="c-card-container">
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>当前权限：{{ $store.getters.permissions }}</span>
+      </div>
+      <div class="c-mb10">
+        <el-alert
+          title="权限一般在登录的时候记录，在页面的时候不会做修改，所以这里不需要更新视图，所以更改了权限后，需要刷新页面，这里更改权限后会自动刷新页面"
+          type="warning"
+          effect="dark"
+          :closable="false"
+        >
+        </el-alert>
+      </div>
+      <div class="c-mb10">需要有删除权限才显示删除按钮</div>
+      <div class="c-mb10">
+        <el-button v-permission="['hasDelete']" class="c-ml10" type="danger" size="small"> 删除按钮 </el-button>
+      </div>
+      <div style="text-align: right">
+        <el-button type="primary" size="small" @click="changePermission('setAdminPermissions')">
+          设置为管理员权限
+        </el-button>
+        <el-button type="primary" size="small" @click="changePermission('addDeletePermissions')">
+          添加 hasDelete 权限
+        </el-button>
+        <el-button type="danger" size="small" @click="changePermission('clearPermissions')"> 清空权限 </el-button>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>只能输入数字指令</span>
+      </div>
+      <div class="c-mb10">
+        <el-form ref="form" label-width="80px">
+          <el-form-item label="纯数字">
+            <el-input v-model="input" v-input-number placeholder="请输入内容"></el-input>
+          </el-form-item>
+          <el-form-item label="浮点数">
+            <el-input v-model="input2" v-input-number.float placeholder="请输入内容"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>防止重复点击</span>
+      </div>
+      <div class="c-mb10">
+        <el-button v-re-click:2000 type="primary" size="small" @click="reClick"> 重复点击，输出到控制台 </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      input: "",
+      input2: "",
+    }
+  },
+  methods: {
+    /** 更改权限 */
+    changePermission(type) {
+      this.$store.commit(type)
+      window.location.reload()
+    },
+    /** 重复点击事件 */
+    reClick() {
+      console.log("重复点击按钮被点击！")
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/demo//350/257/267/346/261/202/347/244/272/344/276/213/index.vue

@@ -0,0 +1,51 @@
+<template>
+  <div class="c-card-container">
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>请求示例</span>
+      </div>
+      <div style="text-align: right">
+        <el-button type="danger" size="small" @click="getServerError()"> 请求服务错误 </el-button>
+        <el-button type="danger" size="small" @click="getInterfaceError()"> 请求接口错误 </el-button>
+        <el-button type="primary" size="small" @click="prototypeInvocation()"> 直接原型.$api请求 </el-button>
+        <el-button type="primary" size="small" @click="reqSucceed()"> 请求成功的 </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { interfaceError } from "@/api/interface/index.js"
+import { serverError } from "@/api/server/index.js"
+export default {
+  data() {
+    return {}
+  },
+  methods: {
+    /** 请求服务错误 */
+    getServerError() {
+      serverError({}).then((res) => {
+        console.log("res", res)
+      })
+    },
+    /** 请求接口错误 */
+    getInterfaceError() {
+      interfaceError({}).then((res) => {
+        console.log("res", res)
+      })
+    },
+    /** 执行原型调用 */
+    prototypeInvocation() {
+      this.$api.post("/server/error", {}).then((res) => {
+        console.log("res", res)
+      })
+    },
+    /** 请求成功的 */
+    reqSucceed() {
+      this.$api.get("/reqSucceed", {}).then((res) => {
+        console.log("res", res)
+      })
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/home.vue

@@ -0,0 +1,3 @@
+<template>
+  <div>我是主页</div>
+</template>

package/lib/templates/vue2.7.16/src/views/login.vue

@@ -0,0 +1,67 @@
+<template>
+  <div class="c-card-container" style="padding: 50px">
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>是否需要登录</span>
+        <el-button style="float: right" size="small" type="primary" @click="$store.commit('changeNeedLogin')">
+          改变是否需要登录
+        </el-button>
+      </div>
+      <div>
+        {{ $store.state.needLogin }}
+      </div>
+    </el-card>
+    <el-card class="c-width-100per">
+      <div slot="header" class="clearfix">
+        <span>当前登录状态</span>
+        <el-button style="float: right" size="small" type="primary" @click="$store.commit('changeLoginStatus')">
+          改变登录状态
+        </el-button>
+      </div>
+      <div>
+        <h3 class="c-mb10">通过 mapState 读取的方式：{{ loginStatus }}</h3>
+        <h3 class="c-mb10">通过 $store.state.loginStatus 读取的方式：{{ $store.state.loginStatus }}</h3>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div style="text-align: right">
+        <el-button type="primary" size="small" @click="printStore"> 打印$store </el-button>
+      </div>
+    </el-card>
+
+    <el-card class="c-width-100per">
+      <div style="text-align: right">
+        <el-button
+          type="primary"
+          size="small"
+          :disabled="$store.state.needLogin && !$store.state.loginStatus"
+          @click="goHome"
+        >
+          跳转首页
+        </el-button>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import { mapState } from "vuex"
+
+export default {
+  name: "LoginView",
+  computed: {
+    ...mapState(["loginStatus"]),
+  },
+  methods: {
+    printStore() {
+      console.log("$store=====>", this.$store)
+    },
+    goHome() {
+      this.$router.push({
+        path: "/",
+      })
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/template/base-info.vue

@@ -0,0 +1,29 @@
+<template>
+  <div style="padding: 50px">
+    <h1>注意：支持显示隐藏，但是不支持跨列</h1>
+    <l-base-info>
+      <l-base-info-item label="111" value="value"></l-base-info-item>
+      <l-base-info-item label="222" value="value"></l-base-info-item>
+      <l-base-info-item label="333" value="value">
+        <template #label> 我是333的插槽label </template>
+        <template #value> 我是333的插槽value </template>
+      </l-base-info-item>
+      <l-base-info-item label="444" value="value"></l-base-info-item>
+      <l-base-info-item label="555" value="value"></l-base-info-item>
+    </l-base-info>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "baseInfo",
+  props: {
+    /** 几列，注意：label跟value合起来是一列 */
+    column: {
+      type: [String, Number],
+      default: 4,
+      required: false,
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/template/base-info2.vue

@@ -0,0 +1,56 @@
+<template>
+  <div style="padding: 50px">
+    <h1>注意：支持跨列，但是不支持显示隐藏</h1>
+    <table class="c-tableData c-text-left">
+      <thead>
+        <tr>
+          <th colspan="8">基础信息</th>
+        </tr>
+      </thead>
+      <tbody>
+        <tr>
+          <td class="c-width-10per ctdLabel">包名称</td>
+          <td class="c-width-15per">
+            {{ baseInfo.pkgName }}
+          </td>
+          <td class="c-width-10per ctdLabel">计划包编码</td>
+          <td class="c-width-15per">
+            {{ baseInfo.pkgCode }}
+          </td>
+          <td class="c-width-10per ctdLabel">计划名称</td>
+          <td class="c-width-15per">
+            {{ baseInfo.planName }}
+          </td>
+          <td class="c-width-10per ctdLabel">计划编码</td>
+          <td class="c-width-15per">
+            {{ baseInfo.planCode }}
+          </td>
+        </tr>
+        <tr>
+          <td class="c-width-10per ctdLabel">跨列</td>
+          <td class="c-width-15per" colspan="3">
+            {{ baseInfo.pkgName }}
+          </td>
+          <td class="c-width-10per ctdLabel">计划包编码</td>
+          <td class="c-width-15per">
+            {{ baseInfo.pkgCode }}
+          </td>
+          <td class="c-width-10per ctdLabel">计划名称</td>
+          <td class="c-width-15per">
+            {{ baseInfo.planName }}
+          </td>
+        </tr>
+      </tbody>
+    </table>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      baseInfo: {},
+    }
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/template/list/ce.vue

@@ -0,0 +1,58 @@
+<template>
+  <el-dialog v-bind="$props" :visible="visible" width="500px" @close="close()">
+    <el-form ref="form" :model="form" :rules="rules" label-width="60px">
+      <el-form-item label="姓名" prop="name">
+        <el-input v-model="form.name" placeholder="请输入"></el-input>
+      </el-form-item>
+      <el-form-item label="地址" prop="address">
+        <el-input v-model="form.address" placeholder="请输入"></el-input>
+      </el-form-item>
+    </el-form>
+    <div slot="footer">
+      <el-button :loading="loading" :disabled="loading" @click="close()">取消</el-button>
+      <el-button :loading="loading" :disabled="loading" type="primary" @click="submit()">确认</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { cloneDeep } from "lodash"
+
+export default {
+  props: {
+    fatherItem: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      loading: false,
+      form: {
+        name: "",
+        address: "",
+      },
+      rules: {
+        name: [{ required: true, message: "请输入", trigger: "change" }],
+        address: [{ required: true, message: "请输入", trigger: "change" }],
+      },
+    }
+  },
+  created() {
+    if (this.fatherItem) {
+      this.form = cloneDeep(this.fatherItem)
+    }
+  },
+  methods: {
+    submit() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          this.close(true)
+        } else {
+          this.$message.warning("请填写必填项！")
+        }
+      })
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/template/list/index.vue

@@ -0,0 +1,111 @@
+<template>
+  <div v-loading="loading" class="c-layout">
+    <!-- 顶部 -->
+    <div class="c-mb20">
+      <search v-model="form" @ok="getList(true)"></search>
+      <el-divider></el-divider>
+      <el-button type="primary" @click="ce()"> 新增 </el-button>
+    </div>
+
+    <!-- 表格 -->
+    <el-table class="c-layout--flex c-overflow-hidden" :data="tableData" border height="100%">
+      <el-table-column type="index" width="50"> </el-table-column>
+      <el-table-column prop="name" label="姓名" width="180"> </el-table-column>
+      <el-table-column prop="address" label="地址"> </el-table-column>
+      <el-table-column prop="date" label="日期" width="180"> </el-table-column>
+      <el-table-column fixed="right" label="操作" width="150">
+        <template slot-scope="{ row, $index }">
+          <el-button type="primary" @click="ce(row)"> 编辑 </el-button>
+          <el-button type="danger" @click="del($index)"> 删除 </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <!-- 分页 -->
+    <l-pagination
+      class="c-mt20"
+      style="text-align: right"
+      :current-page.sync="page.currentPage"
+      :page-size.sync="page.size"
+      :total="page.total"
+      @change="getList()"
+    >
+    </l-pagination>
+  </div>
+</template>
+
+<script>
+import search from "./search.vue"
+export default {
+  components: { search },
+  data() {
+    return {
+      loading: false,
+      form: {
+        name: "",
+        address: "",
+      },
+      tableData: [],
+      page: {
+        currentPage: 1, // 当前页
+        size: 20, // 每页条数
+        total: 0, // 总条数
+      },
+    }
+  },
+  created() {
+    this.getList()
+  },
+  methods: {
+    /** 新增编辑 */
+    ce(row) {
+      this.$LDialog(require("./ce.vue"), {
+        title: row ? "编辑" : "新增",
+        fatherItem: row,
+        on: {
+          refresh: () => {
+            console.log("刷新方法")
+          },
+        },
+      })
+    },
+    /** 获取列表 */
+    getList(isRefresh = false) {
+      if (isRefresh) {
+        this.page.currentPage = 1
+      }
+      const params = {
+        page: this.page.currentPage,
+        size: this.page.size,
+        ...this.form,
+      }
+      this.loading = true
+      this.$api
+        .get("/getList", params)
+        .then((res) => {
+          this.tableData = res.data.list
+          this.page.total = res.data.total
+        })
+        .finally(() => {
+          this.loading = false
+        })
+    },
+    /** 删除 */
+    del(index) {
+      this.$confirm("确定删除吗?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.tableData.splice(index, 1)
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          })
+        })
+        .catch(() => {})
+    },
+  },
+}
+</script>

package/lib/templates/vue2.7.16/src/views/template/list/search.vue

@@ -0,0 +1,60 @@
+<template>
+  <el-form ref="form" :model="form" label-width="50px">
+    <el-row :gutter="20">
+      <el-col :span="6">
+        <el-form-item label="姓名">
+          <el-input v-model="form.name" placeholder="请输入"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="6">
+        <el-form-item label="地址">
+          <el-input v-model="form.address" placeholder="请输入"></el-input>
+        </el-form-item>
+      </el-col>
+      <el-col :span="12" style="text-align: right">
+        <el-button type="primary" @click="submit()"> 搜索 </el-button>
+        <el-button @click="reset()"> 重置 </el-button>
+      </el-col>
+    </el-row>
+  </el-form>
+</template>
+
+<script>
+import { cloneDeep } from "lodash"
+
+export default {
+  props: {
+    value: {
+      type: Object,
+      default: () => {},
+    },
+  },
+  data() {
+    return {
+      sourceValue: cloneDeep(this.value), // 用于重置
+      form: cloneDeep(this.value),
+    }
+  },
+  computed: {
+    modelValue: {
+      set(val) {
+        this.$emit("input", val)
+      },
+      get() {
+        return this.value
+      },
+    },
+  },
+  methods: {
+    submit() {
+      this.modelValue = cloneDeep(this.form)
+      this.$emit("ok", this.form)
+    },
+    reset() {
+      this.form = cloneDeep(this.sourceValue)
+      this.modelValue = cloneDeep(this.sourceValue)
+      this.$emit("ok", this.form)
+    },
+  },
+}
+</script>