ylyx-cli 1.0.16 → 1.1.1

package/templates/vue-app/files/src/views/tools/storage/local/index.vue

@@ -1,207 +1,207 @@
-<template>
-  <div class="app-container" style="padding: 8px">
-    <!--工具栏-->
-    <div class="head-container">
-      <div v-if="crud.props.searchToggle">
-        <!-- 搜索 -->
-        <el-input
-          v-model="query.blurry"
-          clearable
-          size="small"
-          placeholder="输入内容模糊搜索"
-          style="width: 200px"
-          class="filter-item"
-          @keyup.enter.native="crud.toQuery" />
-        <date-range-picker v-model="query.createTime" class="date-item" />
-        <rrOperation />
-      </div>
-      <crudOperation :permission="permission">
-        <!-- 新增 -->
-        <el-button
-          slot="left"
-          v-permission="['admin', 'storage:add']"
-          class="filter-item"
-          size="mini"
-          type="primary"
-          icon="el-icon-upload"
-          @click="crud.toAdd"
-          >上传
-        </el-button>
-      </crudOperation>
-    </div>
-    <!--表单组件-->
-    <el-dialog
-      append-to-body
-      :close-on-click-modal="false"
-      :before-close="crud.cancelCU"
-      :visible.sync="crud.status.cu > 0"
-      :title="crud.status.add ? '文件上传' : '编辑文件'"
-      width="500px">
-      <el-form ref="form" :model="form" size="small" label-width="80px">
-        <el-form-item label="文件名">
-          <el-input v-model="form.name" style="width: 370px" />
-        </el-form-item>
-        <!--   上传文件   -->
-        <el-form-item v-if="crud.status.add" label="上传">
-          <el-upload
-            ref="upload"
-            :limit="1"
-            :before-upload="beforeUpload"
-            :auto-upload="false"
-            :headers="headers"
-            :on-success="handleSuccess"
-            :on-error="handleError"
-            :action="fileUploadApi + '?name=' + form.name">
-            <div class="eladmin-upload"><i class="el-icon-upload" /> 添加文件</div>
-            <div slot="tip" class="el-upload__tip">可上传任意格式文件，且不超过100M</div>
-          </el-upload>
-        </el-form-item>
-      </el-form>
-      <div slot="footer" class="dialog-footer">
-        <el-button type="text" @click="crud.cancelCU">取消</el-button>
-        <el-button v-if="crud.status.add" :loading="loading" type="primary" @click="upload"
-          >确认</el-button
-        >
-        <el-button v-else :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU"
-          >确认</el-button
-        >
-      </div>
-    </el-dialog>
-    <!--表格渲染-->
-    <el-table
-      ref="table"
-      v-loading="crud.loading"
-      :data="crud.data"
-      style="width: 100%"
-      @selection-change="crud.selectionChangeHandler">
-      <el-table-column type="selection" width="55" />
-      <el-table-column prop="name" label="文件名">
-        <template slot-scope="scope">
-          <el-popover
-            :content="'file/' + scope.row.type + '/' + scope.row.realName"
-            placement="top-start"
-            title="路径"
-            width="200"
-            trigger="hover">
-            <a
-              slot="reference"
-              :href="baseApi + '/file/' + scope.row.type + '/' + scope.row.realName"
-              class="el-link--primary"
-              style="
-                word-break: keep-all;
-                white-space: nowrap;
-                overflow: hidden;
-                text-overflow: ellipsis;
-                color: #1890ff;
-                font-size: 13px;
-              "
-              target="_blank">
-              {{ scope.row.name }}
-            </a>
-          </el-popover>
-        </template>
-      </el-table-column>
-      <el-table-column prop="path" label="预览图">
-        <template slot-scope="{ row }">
-          <el-image
-            :src="baseApi + '/file/' + row.type + '/' + row.realName"
-            :preview-src-list="[baseApi + '/file/' + row.type + '/' + row.realName]"
-            fit="contain"
-            lazy
-            class="el-avatar">
-            <div slot="error">
-              <i class="el-icon-document" />
-            </div>
-          </el-image>
-        </template>
-      </el-table-column>
-      <el-table-column prop="suffix" label="文件类型" />
-      <el-table-column prop="type" label="类别" />
-      <el-table-column prop="size" label="大小" />
-      <el-table-column prop="operate" label="操作人" />
-      <el-table-column prop="createTime" label="创建日期" />
-    </el-table>
-    <!--分页组件-->
-    <pagination />
-  </div>
-</template>
-
-<script>
-import { mapGetters } from 'vuex';
-import { getToken } from '@/utils/auth';
-import crudFile from '@/api/tools/localStorage';
-import CRUD, { presenter, header, form, crud } from '@crud/crud';
-import rrOperation from '@crud/RR.operation';
-import crudOperation from '@crud/CRUD.operation';
-import pagination from '@crud/Pagination';
-import DateRangePicker from '@/components/DateRangePicker';
-
-const defaultForm = { id: null, name: '' };
-export default {
-  components: { pagination, crudOperation, rrOperation, DateRangePicker },
-  cruds() {
-    return CRUD({ title: '文件', url: 'api/localStorage', crudMethod: { ...crudFile } });
-  },
-  mixins: [presenter(), header(), form(defaultForm), crud()],
-  data() {
-    return {
-      delAllLoading: false,
-      loading: false,
-      headers: { Authorization: getToken() },
-      permission: {
-        edit: ['admin', 'storage:edit'],
-        del: ['admin', 'storage:del'],
-      },
-    };
-  },
-  computed: {
-    ...mapGetters(['baseApi', 'fileUploadApi']),
-  },
-  created() {
-    this.crud.optShow.add = false;
-  },
-  methods: {
-    // 上传文件
-    upload() {
-      this.$refs.upload.submit();
-    },
-    beforeUpload(file) {
-      let isLt2M = true;
-      isLt2M = file.size / 1024 / 1024 < 100;
-      if (!isLt2M) {
-        this.loading = false;
-        this.$message.error('上传文件大小不能超过 100MB!');
-      }
-      this.form.name = file.name;
-      return isLt2M;
-    },
-    handleSuccess(response, file, fileList) {
-      this.crud.notify('上传成功', CRUD.NOTIFICATION_TYPE.SUCCESS);
-      this.$refs.upload.clearFiles();
-      this.crud.status.add = CRUD.STATUS.NORMAL;
-      this.crud.resetForm();
-      this.crud.toQuery();
-    },
-    // 监听上传失败
-    handleError(e, file, fileList) {
-      const msg = JSON.parse(e.message);
-      this.$notify({
-        title: msg.message,
-        type: 'error',
-        duration: 2500,
-      });
-      this.loading = false;
-    },
-  },
-};
-</script>
-
-<style scoped>
-::v-deep .el-image__error,
-.el-image__placeholder {
-  background: none;
-}
-::v-deep .el-image-viewer__wrapper {
-  top: 55px;
-}
-</style>
+<template>
+  <div class="app-container" style="padding: 8px">
+    <!--工具栏-->
+    <div class="head-container">
+      <div v-if="crud.props.searchToggle">
+        <!-- 搜索 -->
+        <el-input
+          v-model="query.blurry"
+          clearable
+          size="small"
+          placeholder="输入内容模糊搜索"
+          style="width: 200px"
+          class="filter-item"
+          @keyup.enter.native="crud.toQuery" />
+        <date-range-picker v-model="query.createTime" class="date-item" />
+        <rrOperation />
+      </div>
+      <crudOperation :permission="permission">
+        <!-- 新增 -->
+        <el-button
+          slot="left"
+          v-permission="['admin', 'storage:add']"
+          class="filter-item"
+          size="mini"
+          type="primary"
+          icon="el-icon-upload"
+          @click="crud.toAdd"
+          >上传
+        </el-button>
+      </crudOperation>
+    </div>
+    <!--表单组件-->
+    <el-dialog
+      append-to-body
+      :close-on-click-modal="false"
+      :before-close="crud.cancelCU"
+      :visible.sync="crud.status.cu > 0"
+      :title="crud.status.add ? '文件上传' : '编辑文件'"
+      width="500px">
+      <el-form ref="form" :model="form" size="small" label-width="80px">
+        <el-form-item label="文件名">
+          <el-input v-model="form.name" style="width: 370px" />
+        </el-form-item>
+        <!--   上传文件   -->
+        <el-form-item v-if="crud.status.add" label="上传">
+          <el-upload
+            ref="upload"
+            :limit="1"
+            :before-upload="beforeUpload"
+            :auto-upload="false"
+            :headers="headers"
+            :on-success="handleSuccess"
+            :on-error="handleError"
+            :action="fileUploadApi + '?name=' + form.name">
+            <div class="eladmin-upload"><i class="el-icon-upload" /> 添加文件</div>
+            <div slot="tip" class="el-upload__tip">可上传任意格式文件，且不超过100M</div>
+          </el-upload>
+        </el-form-item>
+      </el-form>
+      <div slot="footer" class="dialog-footer">
+        <el-button type="text" @click="crud.cancelCU">取消</el-button>
+        <el-button v-if="crud.status.add" :loading="loading" type="primary" @click="upload"
+          >确认</el-button
+        >
+        <el-button v-else :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU"
+          >确认</el-button
+        >
+      </div>
+    </el-dialog>
+    <!--表格渲染-->
+    <el-table
+      ref="table"
+      v-loading="crud.loading"
+      :data="crud.data"
+      style="width: 100%"
+      @selection-change="crud.selectionChangeHandler">
+      <el-table-column type="selection" width="55" />
+      <el-table-column prop="name" label="文件名">
+        <template slot-scope="scope">
+          <el-popover
+            :content="'file/' + scope.row.type + '/' + scope.row.realName"
+            placement="top-start"
+            title="路径"
+            width="200"
+            trigger="hover">
+            <a
+              slot="reference"
+              :href="baseApi + '/file/' + scope.row.type + '/' + scope.row.realName"
+              class="el-link--primary"
+              style="
+                word-break: keep-all;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+                color: #1890ff;
+                font-size: 13px;
+              "
+              target="_blank">
+              {{ scope.row.name }}
+            </a>
+          </el-popover>
+        </template>
+      </el-table-column>
+      <el-table-column prop="path" label="预览图">
+        <template slot-scope="{ row }">
+          <el-image
+            :src="baseApi + '/file/' + row.type + '/' + row.realName"
+            :preview-src-list="[baseApi + '/file/' + row.type + '/' + row.realName]"
+            fit="contain"
+            lazy
+            class="el-avatar">
+            <div slot="error">
+              <i class="el-icon-document" />
+            </div>
+          </el-image>
+        </template>
+      </el-table-column>
+      <el-table-column prop="suffix" label="文件类型" />
+      <el-table-column prop="type" label="类别" />
+      <el-table-column prop="size" label="大小" />
+      <el-table-column prop="operate" label="操作人" />
+      <el-table-column prop="createTime" label="创建日期" />
+    </el-table>
+    <!--分页组件-->
+    <pagination />
+  </div>
+</template>
+
+<script>
+import { mapGetters } from 'vuex';
+import { getToken } from '@/utils/auth';
+import crudFile from '@/api/tools/localStorage';
+import CRUD, { presenter, header, form, crud } from '@crud/crud';
+import rrOperation from '@crud/RR.operation';
+import crudOperation from '@crud/CRUD.operation';
+import pagination from '@crud/Pagination';
+import DateRangePicker from '@/components/DateRangePicker';
+
+const defaultForm = { id: null, name: '' };
+export default {
+  components: { pagination, crudOperation, rrOperation, DateRangePicker },
+  cruds() {
+    return CRUD({ title: '文件', url: 'api/localStorage', crudMethod: { ...crudFile } });
+  },
+  mixins: [presenter(), header(), form(defaultForm), crud()],
+  data() {
+    return {
+      delAllLoading: false,
+      loading: false,
+      headers: { Authorization: getToken() },
+      permission: {
+        edit: ['admin', 'storage:edit'],
+        del: ['admin', 'storage:del'],
+      },
+    };
+  },
+  computed: {
+    ...mapGetters(['baseApi', 'fileUploadApi']),
+  },
+  created() {
+    this.crud.optShow.add = false;
+  },
+  methods: {
+    // 上传文件
+    upload() {
+      this.$refs.upload.submit();
+    },
+    beforeUpload(file) {
+      let isLt2M = true;
+      isLt2M = file.size / 1024 / 1024 < 100;
+      if (!isLt2M) {
+        this.loading = false;
+        this.$message.error('上传文件大小不能超过 100MB!');
+      }
+      this.form.name = file.name;
+      return isLt2M;
+    },
+    handleSuccess(response, file, fileList) {
+      this.crud.notify('上传成功', CRUD.NOTIFICATION_TYPE.SUCCESS);
+      this.$refs.upload.clearFiles();
+      this.crud.status.add = CRUD.STATUS.NORMAL;
+      this.crud.resetForm();
+      this.crud.toQuery();
+    },
+    // 监听上传失败
+    handleError(e, file, fileList) {
+      const msg = JSON.parse(e.message);
+      this.$notify({
+        title: msg.message,
+        type: 'error',
+        duration: 2500,
+      });
+      this.loading = false;
+    },
+  },
+};
+</script>
+
+<style scoped>
+::v-deep .el-image__error,
+.el-image__placeholder {
+  background: none;
+}
+::v-deep .el-image-viewer__wrapper {
+  top: 55px;
+}
+</style>

package/templates/vue-app/files/src/views/tools/storage/qiniu/form.vue

@@ -1,108 +1,108 @@
-<template>
-  <el-dialog
-    :visible.sync="dialog"
-    :close-on-click-modal="false"
-    title="七牛云配置"
-    append-to-body
-    width="580px">
-    <el-form
-      ref="form"
-      :model="form"
-      :rules="rules"
-      style="margin-top: 6px"
-      size="small"
-      label-width="110px">
-      <el-form-item label="Access Key" prop="accessKey">
-        <el-input
-          v-model="form.accessKey"
-          style="width: 95%"
-          placeholder="accessKey，在安全中心，秘钥管理中查看" />
-      </el-form-item>
-      <el-form-item label="Secret Key" prop="secretKey">
-        <el-input
-          v-model="form.secretKey"
-          type="password"
-          style="width: 95%"
-          placeholder="secretKey，在安全中心，秘钥管理中查看" />
-      </el-form-item>
-      <el-form-item label="空间名称" prop="bucket">
-        <el-input
-          v-model="form.bucket"
-          style="width: 95%"
-          placeholder="存储空间名称作为唯一的 Bucket 识别符" />
-      </el-form-item>
-      <el-form-item label="外链域名" prop="host">
-        <el-input
-          v-model="form.host"
-          style="width: 95%"
-          placeholder="外链域名，可自定义，需在七牛云绑定" />
-      </el-form-item>
-      <el-form-item label="存储区域">
-        <el-select v-model="form.zone" placeholder="请选择存储区域">
-          <el-option v-for="item in zones" :key="item" :label="item" :value="item" />
-        </el-select>
-      </el-form-item>
-      <el-form-item label="空间类型" prop="type">
-        <el-radio v-model="form.type" label="公开">公开</el-radio>
-        <el-radio v-model="form.type" label="私有">私有</el-radio>
-      </el-form-item>
-    </el-form>
-    <div slot="footer" class="dialog-footer">
-      <el-button type="text" @click="dialog = false">取消</el-button>
-      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
-    </div>
-  </el-dialog>
-</template>
-
-<script>
-import { get, update } from '@/api/tools/qiniu';
-export default {
-  data() {
-    return {
-      zones: ['华东', '华北', '华南', '北美', '东南亚'],
-      dialog: false,
-      loading: false,
-      form: { accessKey: '', secretKey: '', bucket: '', host: '', zone: '', type: '' },
-      rules: {
-        accessKey: [{ required: true, message: '请输入accessKey', trigger: 'blur' }],
-        secretKey: [{ required: true, message: '请输入secretKey', trigger: 'blur' }],
-        bucket: [{ required: true, message: '请输入空间名称', trigger: 'blur' }],
-        host: [{ required: true, message: '请输入外链域名', trigger: 'blur' }],
-        type: [{ required: true, message: '空间类型不能为空', trigger: 'blur' }],
-      },
-    };
-  },
-  methods: {
-    init() {
-      get().then(res => {
-        this.form = res;
-      });
-    },
-    doSubmit() {
-      this.$refs['form'].validate(valid => {
-        if (valid) {
-          this.loading = true;
-          update(this.form)
-            .then(res => {
-              this.$notify({
-                title: '修改成功',
-                type: 'success',
-                duration: 2500,
-              });
-              this.$parent.crud.toQuery();
-              this.loading = false;
-              this.dialog = false;
-            })
-            .catch(err => {
-              this.loading = false;
-            });
-        } else {
-          return false;
-        }
-      });
-    },
-  },
-};
-</script>
-
-<style scoped></style>
+<template>
+  <el-dialog
+    :visible.sync="dialog"
+    :close-on-click-modal="false"
+    title="七牛云配置"
+    append-to-body
+    width="580px">
+    <el-form
+      ref="form"
+      :model="form"
+      :rules="rules"
+      style="margin-top: 6px"
+      size="small"
+      label-width="110px">
+      <el-form-item label="Access Key" prop="accessKey">
+        <el-input
+          v-model="form.accessKey"
+          style="width: 95%"
+          placeholder="accessKey，在安全中心，秘钥管理中查看" />
+      </el-form-item>
+      <el-form-item label="Secret Key" prop="secretKey">
+        <el-input
+          v-model="form.secretKey"
+          type="password"
+          style="width: 95%"
+          placeholder="secretKey，在安全中心，秘钥管理中查看" />
+      </el-form-item>
+      <el-form-item label="空间名称" prop="bucket">
+        <el-input
+          v-model="form.bucket"
+          style="width: 95%"
+          placeholder="存储空间名称作为唯一的 Bucket 识别符" />
+      </el-form-item>
+      <el-form-item label="外链域名" prop="host">
+        <el-input
+          v-model="form.host"
+          style="width: 95%"
+          placeholder="外链域名，可自定义，需在七牛云绑定" />
+      </el-form-item>
+      <el-form-item label="存储区域">
+        <el-select v-model="form.zone" placeholder="请选择存储区域">
+          <el-option v-for="item in zones" :key="item" :label="item" :value="item" />
+        </el-select>
+      </el-form-item>
+      <el-form-item label="空间类型" prop="type">
+        <el-radio v-model="form.type" label="公开">公开</el-radio>
+        <el-radio v-model="form.type" label="私有">私有</el-radio>
+      </el-form-item>
+    </el-form>
+    <div slot="footer" class="dialog-footer">
+      <el-button type="text" @click="dialog = false">取消</el-button>
+      <el-button :loading="loading" type="primary" @click="doSubmit">确认</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import { get, update } from '@/api/tools/qiniu';
+export default {
+  data() {
+    return {
+      zones: ['华东', '华北', '华南', '北美', '东南亚'],
+      dialog: false,
+      loading: false,
+      form: { accessKey: '', secretKey: '', bucket: '', host: '', zone: '', type: '' },
+      rules: {
+        accessKey: [{ required: true, message: '请输入accessKey', trigger: 'blur' }],
+        secretKey: [{ required: true, message: '请输入secretKey', trigger: 'blur' }],
+        bucket: [{ required: true, message: '请输入空间名称', trigger: 'blur' }],
+        host: [{ required: true, message: '请输入外链域名', trigger: 'blur' }],
+        type: [{ required: true, message: '空间类型不能为空', trigger: 'blur' }],
+      },
+    };
+  },
+  methods: {
+    init() {
+      get().then(res => {
+        this.form = res;
+      });
+    },
+    doSubmit() {
+      this.$refs['form'].validate(valid => {
+        if (valid) {
+          this.loading = true;
+          update(this.form)
+            .then(res => {
+              this.$notify({
+                title: '修改成功',
+                type: 'success',
+                duration: 2500,
+              });
+              this.$parent.crud.toQuery();
+              this.loading = false;
+              this.dialog = false;
+            })
+            .catch(err => {
+              this.loading = false;
+            });
+        } else {
+          return false;
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style scoped></style>