ylyx-cli 1.0.0

package/templates/vue-app/files/src/components/Crud/user/UR.operation.vue

@@ -0,0 +1,154 @@
+<template>
+  <div>
+    <el-button
+      v-permission="permission.edit"
+      :loading="crud.status.cu === 2"
+      :disabled="disabledEdit"
+      size="mini"
+      type="primary"
+      icon="el-icon-edit"
+      @click="crud.toEdit(data)">
+    </el-button>
+
+    <el-popover
+      v-model="pop"
+      v-permission="permission.del"
+      placement="top"
+      width="180"
+      trigger="manual"
+      @show="onPopoverShow"
+      @hide="onPopoverHide">
+      <p>{{ msg }}</p>
+      <div style="text-align: right; margin: 0">
+        <el-button size="mini" type="text" @click="doCancel">取消</el-button>
+        <el-button
+          :loading="crud.dataStatus[crud.getDataId(data)].delete === 2"
+          type="primary"
+          size="mini"
+          @click="resetPass(data)"
+          >确定
+        </el-button>
+      </div>
+      <el-button
+        slot="reference"
+        :disabled="disabledDle"
+        style="
+          padding: 0 11px;
+          font-size: 16px;
+          height: 29px;
+          line-height: 29px;
+          position: relative;
+          top: 3px;
+        "
+        type="primary"
+        size="mini"
+        @click="toDelete">
+        <svg-icon class-name="resetpassword" icon-class="resetpassword" />
+        <!-- 重置密码 -->
+      </el-button>
+    </el-popover>
+
+    <el-popover
+      v-model="delPop"
+      v-permission="permission.del"
+      placement="top"
+      width="180"
+      trigger="manual"
+      @show="onPopoverShow"
+      @hide="onPopoverHide">
+      <p>{{ delmsg }}</p>
+      <div style="text-align: right; margin: 0">
+        <el-button size="mini" type="text" @click="doCancelUser">取消</el-button>
+        <el-button
+          :loading="crud.dataStatus[crud.getDataId(data)].delete === 2"
+          type="primary"
+          size="mini"
+          @click="crud.doDelete(data)"
+          >确定</el-button
+        >
+      </div>
+      <el-button
+        slot="reference"
+        :disabled="disabledDle"
+        type="danger"
+        icon="el-icon-delete"
+        size="mini"
+        @click="toDeleteUser"></el-button>
+    </el-popover>
+  </div>
+</template>
+<script>
+import CRUD, { crud } from '@crud/crud';
+import { resetPass, del } from '@/api/system/user';
+
+export default {
+  mixins: [crud()],
+  props: {
+    data: {
+      type: Object,
+      required: true,
+    },
+    permission: {
+      type: Object,
+      required: true,
+    },
+    disabledEdit: {
+      type: Boolean,
+      default: false,
+    },
+    disabledDle: {
+      type: Boolean,
+      default: false,
+    },
+    msg: {
+      type: String,
+      default: '确定将密码重置为Ylyx1026吗？',
+    },
+    delmsg: {
+      type: String,
+      default: '确定要删除吗？',
+    },
+  },
+  data() {
+    return {
+      pop: false,
+      delPop: false,
+    };
+  },
+  methods: {
+    doCancel() {
+      this.pop = false;
+      this.crud.cancelDelete(this.data);
+    },
+    toDelete() {
+      this.pop = true;
+    },
+    async resetPass(data) {
+      let res = await resetPass({ username: data.username });
+      if (res === undefined) {
+        this.crud.notify('重置成功', CRUD.NOTIFICATION_TYPE.SUCCESS);
+        this.pop = false;
+        this.delPop = false;
+      }
+    },
+    toDeleteUser() {
+      this.delPop = true;
+    },
+    doCancelUser() {
+      this.delPop = false;
+    },
+    onPopoverShow() {
+      setTimeout(() => {
+        document.addEventListener('click', this.handleDocumentClick);
+      }, 0);
+    },
+    onPopoverHide() {
+      document.removeEventListener('click', this.handleDocumentClick);
+    },
+    handleDocumentClick(event) {
+      this.pop = false;
+      this.delPop = false;
+    },
+  },
+};
+</script>

package/templates/vue-app/files/src/components/DateRangePicker/index.vue

@@ -0,0 +1,42 @@
+<script>
+import { DatePicker, DatePickerOptions } from 'element-ui';
+import { calendarShortcuts } from '@/utils/shortcuts';
+
+export default {
+  name: 'DateRangePicker',
+  mixins: [DatePicker],
+  props: {
+    type: {
+      type: String,
+      default: 'daterange',
+    },
+    valueFormat: {
+      type: String,
+      default: 'yyyy-MM-dd HH:mm:ss',
+    },
+    defaultTime: {
+      type: Array,
+      default: _ => ['00:00:00', '23:59:59'],
+    },
+    pickerOptions: {
+      type: DatePickerOptions,
+      default: _ => {
+        return { shortcuts: calendarShortcuts };
+      },
+    },
+    rangeSeparator: {
+      type: String,
+      default: '至',
+    },
+    startPlaceholder: {
+      type: String,
+      default: '开始日期',
+    },
+    endPlaceholder: {
+      type: String,
+      default: '结束日期',
+    },
+  },
+  created() {},
+};
+</script>

package/templates/vue-app/files/src/components/DateRangePickerProhibitNext/index.vue

@@ -0,0 +1,42 @@
+<script>
+import { DatePicker, DatePickerOptions } from 'element-ui';
+import { calendarBaseShortcuts, calendarDisabledDateProhibitNext } from '@/utils/shortcuts';
+
+export default {
+  name: 'DateRangePicker',
+  mixins: [DatePicker],
+  props: {
+    type: {
+      type: String,
+      default: 'daterange',
+    },
+    valueFormat: {
+      type: String,
+      default: 'yyyy-MM-dd HH:mm:ss',
+    },
+    defaultTime: {
+      type: Array,
+      default: _ => ['00:00:00', '23:59:59'],
+    },
+    pickerOptions: {
+      type: DatePickerOptions,
+      default: _ => {
+        return { shortcuts: calendarBaseShortcuts, disabledDate: calendarDisabledDateProhibitNext };
+      },
+    },
+    rangeSeparator: {
+      type: String,
+      default: '至',
+    },
+    startPlaceholder: {
+      type: String,
+      default: '开始日期',
+    },
+    endPlaceholder: {
+      type: String,
+      default: '结束日期',
+    },
+  },
+  created() {},
+};
+</script>

package/templates/vue-app/files/src/components/DateRangePickerProhibitTodayNext/index.vue

@@ -0,0 +1,48 @@
+<script>
+import { DatePicker, DatePickerOptions } from 'element-ui';
+import {
+  calendarShortcutsProhibitTodayNext,
+  calendarDisabledDateProhibitTodayNext,
+} from '@/utils/shortcuts';
+
+export default {
+  name: 'DateRangePicker',
+  mixins: [DatePicker],
+  props: {
+    type: {
+      type: String,
+      default: 'daterange',
+    },
+    valueFormat: {
+      type: String,
+      default: 'yyyy-MM-dd HH:mm:ss',
+    },
+    defaultTime: {
+      type: Array,
+      default: _ => ['00:00:00', '23:59:59'],
+    },
+    pickerOptions: {
+      type: DatePickerOptions,
+      default: _ => {
+        return {
+          shortcuts: calendarShortcutsProhibitTodayNext,
+          disabledDate: calendarDisabledDateProhibitTodayNext,
+        };
+      },
+    },
+    rangeSeparator: {
+      type: String,
+      default: '至',
+    },
+    startPlaceholder: {
+      type: String,
+      default: '开始日期',
+    },
+    endPlaceholder: {
+      type: String,
+      default: '结束日期',
+    },
+  },
+  created() {},
+};
+</script>

package/templates/vue-app/files/src/components/Dict/Dict.js

@@ -0,0 +1,31 @@
+import Vue from 'vue';
+import { get as getDictDetail } from '@/api/system/dictDetail';
+
+export default class Dict {
+  constructor(dict) {
+    this.dict = dict;
+  }
+
+  async init(names, completeCallback) {
+    if (names === undefined || name === null) {
+      throw new Error('need Dict names');
+    }
+    const ps = [];
+    names.forEach(n => {
+      Vue.set(this.dict.dict, n, {});
+      Vue.set(this.dict.label, n, {});
+      Vue.set(this.dict, n, []);
+      ps.push(
+        getDictDetail(n).then(data => {
+          this.dict[n].splice(0, 0, ...data.content);
+          data.content.forEach(d => {
+            Vue.set(this.dict.dict[n], d.value, d);
+            Vue.set(this.dict.label[n], d.value, d.label);
+          });
+        })
+      );
+    });
+    await Promise.all(ps);
+    completeCallback();
+  }
+}

package/templates/vue-app/files/src/components/Dict/index.js

@@ -0,0 +1,29 @@
+import Dict from './Dict';
+
+const install = function (Vue) {
+  Vue.mixin({
+    data() {
+      if (this.$options.dicts instanceof Array) {
+        const dict = {
+          dict: {},
+          label: {},
+        };
+        return {
+          dict,
+        };
+      }
+      return {};
+    },
+    created() {
+      if (this.$options.dicts instanceof Array) {
+        new Dict(this.dict).init(this.$options.dicts, () => {
+          this.$nextTick(() => {
+            this.$emit('dictReady');
+          });
+        });
+      }
+    },
+  });
+};
+
+export default { install };

package/templates/vue-app/files/src/components/Doc/index.vue

@@ -0,0 +1,16 @@
+<template>
+  <div>
+    <svg-icon icon-class="doc" @click="click" />
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Doc',
+  methods: {
+    click() {
+      window.open('https://doc.el-admin.xin/guide/', '_blank');
+    },
+  },
+};
+</script>

package/templates/vue-app/files/src/components/Echarts/BarChart.vue

@@ -0,0 +1,115 @@
+<template>
+  <div :class="className" :style="{ height: height, width: width }" />
+</template>
+
+<script>
+import echarts from 'echarts';
+require('echarts/theme/macarons'); // echarts theme
+import { debounce } from '@/utils';
+
+const animationDuration = 6000;
+
+export default {
+  props: {
+    className: {
+      type: String,
+      default: 'chart',
+    },
+    width: {
+      type: String,
+      default: '100%',
+    },
+    height: {
+      type: String,
+      default: '300px',
+    },
+  },
+  data() {
+    return {
+      chart: null,
+    };
+  },
+  mounted() {
+    this.initChart();
+    this.__resizeHandler = debounce(() => {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    }, 100);
+    window.addEventListener('resize', this.__resizeHandler);
+  },
+  beforeDestroy() {
+    if (!this.chart) {
+      return;
+    }
+    window.removeEventListener('resize', this.__resizeHandler);
+    this.chart.dispose();
+    this.chart = null;
+  },
+  methods: {
+    initChart() {
+      this.chart = echarts.init(this.$el, 'macarons');
+
+      this.chart.setOption({
+        tooltip: {
+          trigger: 'axis',
+          axisPointer: {
+            // 坐标轴指示器，坐标轴触发有效
+            type: 'shadow', // 默认为直线，可选为：'line' | 'shadow'
+          },
+        },
+        grid: {
+          top: 10,
+          left: '2%',
+          right: '2%',
+          bottom: '3%',
+          containLabel: true,
+        },
+        xAxis: [
+          {
+            type: 'category',
+            data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+            axisTick: {
+              alignWithLabel: true,
+            },
+          },
+        ],
+        yAxis: [
+          {
+            type: 'value',
+            axisTick: {
+              show: false,
+            },
+          },
+        ],
+        series: [
+          {
+            name: 'pageA',
+            type: 'bar',
+            stack: 'vistors',
+            barWidth: '60%',
+            data: [79, 52, 200, 334, 390, 330, 220],
+            animationDuration,
+          },
+          {
+            name: 'pageB',
+            type: 'bar',
+            stack: 'vistors',
+            barWidth: '60%',
+            data: [80, 52, 200, 334, 390, 330, 220],
+            animationDuration,
+          },
+          {
+            name: 'pageC',
+            type: 'bar',
+            stack: 'vistors',
+            barWidth: '60%',
+            data: [30, 52, 200, 334, 390, 330, 220],
+            animationDuration,
+          },
+        ],
+      });
+    },
+  },
+};
+</script>