feat(admin): 增加存储设置，图片储存设置

app/Admin/Controllers/FileStorage/ImageDimension.php

@@ -0,0 +1,61 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Zhiyi\Plus\Admin\Controllers\FileStorage;
+
+use Illuminate\Http\Request;
+use Illuminate\Http\Response;
+use function Zhiyi\Plus\setting;
+use Illuminate\Http\JsonResponse;
+
+class ImageDimension
+{
+    /**
+     * Show file storage validate image dimension.
+     * @return \Illuminate\Http\JsonResponse
+     */
+    public function show(): JsonResponse
+    {
+        // Get configure.
+        $configure = setting('file-storage', 'task-create-validate', [
+            'image-min-width' => 0,
+            'image-max-width' => 0,
+            'image-min-height' => 0,
+            'image-max-height' => 0,
+        ]);
+
+        // Packing json result.
+        $result = [
+            'width' => [
+                'min' => intval($configure['image-min-width'] ?? 0),
+                'max' => intval($configure['image-max-width'] ?? 0),
+            ],
+            'height' => [
+                'min' => intval($configure['image-min-height'] ?? 0),
+                'max' => intval($configure['image-max-height'] ?? 0),
+            ]
+        ];
+
+        return new JsonResponse($result, JsonResponse::HTTP_OK);
+    }
+
+    /**
+     * Update file storage validate image dimension.
+     * @param \Illuminate\Http\Request $request
+     * @return \Illuminate\Http\Response
+     */
+    public function update(Request $request): Response
+    {
+        // Get configure.
+        $setting = setting('file-storage');
+        $setting->set('task-create-validate', array_merge((array) $setting->get('task-create-validate', []), array_filter([
+            'image-min-width' => (int) $request->input('width.min', 0),
+            'image-max-width' => (int) $request->input('width.max', 0),
+            'image-min-height' => (int) $request->input('height.min', 0),
+            'image-max-height' => (int) $request->input('height.max', 0),
+        ])));
+
+        return new Response('', Response::HTTP_NO_CONTENT);
+    }
+}

resources/assets/admin/component/Nav.vue

@@ -97,13 +97,30 @@
     </router-link>
 
     <!-- CDN -->
-    <router-link class="list-group-item __button" to="/cdn" active-class="active">
+    <router-link class="list-group-item __button" to="/cdn" active-class="active" title="即将废弃">
         <span class="glyphicon glyphicon-cloud __icon"></span>
         CDN管理
     </router-link>
 
+    <!-- 存储设置 -->
+    <router-link
+      class="list-group-item __button"
+      to="/file-storage"
+      active-class="active"
+    >
+      <span class="glyphicon glyphicon-file __icon"></span>
+      存储设置
+    </router-link>
+
     <!-- 拓展包导航加载 -->
-    <router-link class="list-group-item __button" v-for="item, index in manages" :key="index" :to="`/package/${index}`" active-class="active" exact>
+    <router-link
+      class="list-group-item __button"
+      v-for="(item, index) in manages"
+      :key="item['uri']"
+      :to="`/package/${index}`"
+      active-class="active"
+      exact
+    >
       <img class="__icon-img" :src="item['icon']" v-if="item['icon'].substr(4, 3) === '://' || item['icon'].substr(5, 3) === '://'">
       <span v-else class="__icon">{{ item['icon'] }}</span>
       {{ item['name'] }}

resources/assets/admin/pages/file-storage/home-component/file-mime-type.vue

@@ -0,0 +1,3 @@
+<template>
+    <span>File MIME types.</span>
+</template>

resources/assets/admin/pages/file-storage/home-component/file-size.vue

@@ -0,0 +1,3 @@
+<template>
+    <span>File size.</span>
+</template>

resources/assets/admin/pages/file-storage/home-component/image.vue

@@ -0,0 +1,133 @@
+<template>
+    <div class="panel panel-default">
+        <div class="panel-heading">图片设置</div>
+        <div class="panel-body">
+
+            <div class="alert alert-warning">
+                设置允许上传图片的尺寸信息，最小像素设置是为了避免用户上传过小图片影响布局，最大像素设置首先可以控制图片大小，其次第三方云储存均有最大尺寸限制。<br>
+                如果超出最大像素，第三方将不会进行图片处理，导致原图直接吐出。<br>
+                限制尺寸信息还有助于避免服务器错误，例如你是用 <code>local</code> 文件系统，进行图像裁剪的时候可以考虑到系统内存情况进行设置，不至于内存溢出。
+            </div>
+
+            <sb-ui-loading v-if="loading" />
+
+            <form class="form-horizontal" v-else>
+                <!-- 宽度设置 -->
+                <div class="form-group">
+                    <label class="col-sm-2 control-label">宽度</label>
+                    <div class="col-sm-4">
+                        <input
+                            type="number"
+                            class="form-control"
+                            placeholder="允许上传的最小像素尺寸"
+                            v-model.number="width.min"
+                            min="0"
+                            :max="width.max"
+                        >
+                    </div>
+                    <div class="col-sm-1 text-center">-</div>
+                    <div class="col-sm-4">
+                        <input
+                            type="number"
+                            class="form-control"
+                            placeholder="允许上传的最大像素尺寸"
+                            :min="width.min"
+                            v-model.number="width.max"
+                        >
+                    </div>
+                </div>
+
+                <!-- 高度设置 -->
+                <div class="form-group">
+                    <label class="col-sm-2 control-label">高度</label>
+                    <div class="col-sm-4">
+                        <input
+                            type="number"
+                            class="form-control"
+                            placeholder="允许上传的最小像素尺寸"
+                            v-model.number="height.min"
+                            min="0"
+                            :max="height.max"
+                        >
+                    </div>
+                    <div class="col-sm-1 text-center">-</div>
+                    <div class="col-sm-4">
+                        <input
+                            type="number"
+                            class="form-control"
+                            placeholder="允许上传的最大像素尺寸"
+                            :min="height.min"
+                            v-model.number="height.max"
+                        >
+                    </div>
+                </div>
+
+                <!-- 提交按钮 -->
+                <div class="form-group">
+                    <div class="col-sm-10 col-sm-offset-2">
+                        <ui-button type="button" class="btn btn-primary" @click="submitHandler" />
+                    </div>
+                </div>
+            </form>
+        </div>
+    </div>
+</template>
+
+<script>
+import request, { createRequestURI } from '../../../util/request';
+export default {
+    data: () => ({
+        width: {
+            min: 0,
+            max: 0,
+        },
+        height: {
+            min: 0,
+            max: 0,
+        },
+        loading: true,
+    }),
+    methods: {
+        submitHandler({ stopProcessing }) {
+            request.patch(
+                createRequestURI('file-storage/image-dimension'),
+                {
+                    width: this.width,
+                    height: this.height,
+                },
+                {
+                    validateStatus: status => status === 204,
+                }
+            )
+            .then(() => {
+                this.$store.dispatch("alert-open", {
+                    type: "success",
+                    message: "更新成功！"
+                });
+            })
+            .catch(({ response: { data: message = "提交失败！" } }) => {
+                this.$store.dispatch("alert-open", { type: "danger", message });
+            })
+            .finally(stopProcessing);
+        }
+    },
+    created() {
+        this.loading = true;
+        request.get(
+            createRequestURI('file-storage/image-dimension'),
+            {
+                validateStatus: status => status === 200
+            }
+        )
+        .then(({ data: { width, height } }) => {
+            this.width = width;
+            this.height = height;
+            this.loading = false;
+        })
+        .catch(({ response: { data: message = "获取图像尺寸设置失败，请检查网络或者刷新页面重试" } }) => {
+            this.$store.dispatch("alert-open", { type: "danger", message });
+        });
+    }
+}
+</script>
+

resources/assets/admin/pages/file-storage/home-component/index.js

@@ -0,0 +1 @@
+export { default } from './wrap';

resources/assets/admin/pages/file-storage/home-component/wrap.vue

@@ -0,0 +1,21 @@
+<template>
+    <div class="container-fluid">
+        <file-size-panel />
+        <file-mime-type-panel />
+        <image-panel />
+    </div>
+</template>
+
+<script>
+import ImagePanel from './image';
+import FileSizePanel from './file-size';
+import FileMimeTypePanel from './file-mime-type';
+export default {
+    components: {
+        ImagePanel,
+        FileSizePanel,
+        FileMimeTypePanel
+    }
+}
+</script>
+

resources/assets/admin/pages/file-storage/index.js

@@ -0,0 +1,2 @@
+export { default as WrapComponent } from './wrap-component';
+export { default as HomeComponent } from './home-component';

resources/assets/admin/pages/file-storage/modules/nav-component.vue

@@ -0,0 +1,34 @@
+<template>
+    <nav
+        class="navbar navbar-default"
+        :style="{
+            borderRadius: 0,
+        }"
+    >
+        <div class="container-fluid">
+            <div class="navbar-header">
+                <router-link
+                    tag="a"
+                    class="navbar-brand"
+                    to="/file-storage"
+                    replace
+                >
+                    存储设置
+                </router-link>
+            </div>
+
+            <ul class="nav navbar-nav">
+                <router-link exact tag="li" exact-active-class="active" to="/file-storage">
+                    <a>基础设置</a>
+                </router-link>
+                <router-link tag="li" active-class="active" to="/file-storage/filesystem">
+                    <a>文件系统</a>
+                </router-link>
+                <router-link tag="li" active-class="active" to="/file-storage/filesystem">
+                    <a>频道设置</a>
+                </router-link>
+            </ul>
+        </div>
+    </nav>
+</template>
+

resources/assets/admin/pages/file-storage/wrap-component.vue

@@ -0,0 +1,14 @@
+<template>
+    <div>
+        <nav-component />
+        <router-view />
+    </div>
+</template>
+
+<script>
+import NavComponent from './modules/nav-component';
+export default {
+    components: {NavComponent}
+}
+</script>
+

resources/assets/admin/router/file-storage-routes.js

@@ -0,0 +1,16 @@
+import {
+    WrapComponent,
+    HomeComponent,
+} from '../pages/file-storage';
+
+export default {
+    path: 'file-storage',
+    component: WrapComponent,
+    children: [
+        {
+            name: "file-storage:home",
+            path: "",
+            component: HomeComponent
+        }
+    ]
+};

resources/assets/admin/router/index.js

@@ -17,6 +17,7 @@ import rewardRouter from './reward';
 import cdnRoutes from './cdn';
 import reportRoutes from './report';
 import currencyRoutes from './currency';
+import FileStorageRoutes from './file-storage-routes';
 
 // components.
 import Login from '../component/Login';
@@ -47,7 +48,8 @@ const childrenRoutes = [
   rewardRouter,
   cdnRoutes,
   reportRoutes,
-  currencyRoutes
+  currencyRoutes,
+  FileStorageRoutes
 ];
 
 const router = new VueRouter({

routes/new-admin.php

@@ -29,4 +29,7 @@
     $route->delete('trashed-users/{user}', AdminControllers\UserTrashedController::class.'@restore');
     $route->get('about-us', AdminControllers\AboutUsController::class.'@show');
     $route->patch('about-us', AdminControllers\AboutUsController::class.'@store');
+
+    $route->get('file-storage/image-dimension', AdminControllers\FileStorage\ImageDimension::class.'@show');
+    $route->patch('file-storage/image-dimension', AdminControllers\FileStorage\ImageDimension::class.'@update');
 });