update

storage/view/website/insert.blade.php

@@ -19,30 +19,60 @@
         <div class="layui-form-item">
             <label class="layui-form-label">网站名称</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_name" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_name" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">网站logo</label>
+            <div class="layui-input-block">
+                <button type="button" class="layui-btn" id="test1">
+                    <i class="layui-icon">&#xe67c;</i>上传图片
+                </button>
+                <img style="max-height: 50px;" src="" id="app_logo">
+                <input type="hidden" name="app_logo" value="" class="layui-input" autocomplete="off">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">网站描述</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_description" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_description" autocomplete="off" lay-affix="clear" class="layui-input">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">关键词</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_keywords" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_keywords" autocomplete="off" lay-affix="clear" class="layui-input">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">公司名称</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_company" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_company" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">备案号</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="text" name="app_filing" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">备案号链接地址</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="text" name="app_filing" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">模板</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="radio" name="template" value="2" title="模板2">
+                {{--                <input type="radio" name="sex" value="2" title="女">--}}
+                {{--                <input type="radio" name="sex" value="nv" title="女" checked>--}}
             </div>
         </div>
         <div class="layui-form-item">
             <div class="button-container">
-                <button type="submit" class="pear-btn pear-btn-primary pear-btn-md" lay-submit="" lay-filter="insert">
+                <button type="submit" class="pear-btn pear-btn-primary pear-btn-md" lay-submit="" lay-filter="save">
                     提交
                 </button>
             </div>
@@ -57,6 +87,33 @@
 
     layui.use(['upload', 'jquery', 'popup'], function(){
         const $ = layui.jquery;
+        const upload = layui.upload;
+        // 上传logo
+        upload.render({
+            elem: '#logo_upload_btn' //绑定元素
+            ,url: UPLOAD_API // 上传接口，实际使用时改成您自己的上传接口即可。
+            ,accept: 'images' // 限制为图片类型
+            ,exts: 'jpg|jpeg|png|gif|ico' // 允许上传的文件格式，加入 ico 格式
+            ,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
+                console.log(obj)
+            }
+            ,done: function(res){
+                //上传完毕回调
+                console.log(res)
+                // 若上传失败
+                if(res.code > 0){
+                    return layer.msg('上传失败');
+                }
+                // 上传成功的一些操作
+                // …
+                document.querySelector('[id="app_logo"]').src = res.data.url
+                $("input[name=app_logo]").val(res.data.url);
+            }
+            ,error: function(e){
+                console.log(e)
+                //请求异常回调
+            }
+        });
 
         layui.form.on("submit(insert)", function (data) {
             console.log(data)

storage/view/website/view.blade.php

@@ -20,25 +20,55 @@
         <div class="layui-form-item">
             <label class="layui-form-label">网站名称</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_name" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_name" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">网站logo</label>
+            <div class="layui-input-block">
+                <button type="button" class="layui-btn" id="logo_upload_btn">
+                    <i class="layui-icon">&#xe67c;</i>上传图片
+                </button>
+                <img style="max-height: 50px;" src="" id="app_logo">
+                <input type="hidden" name="app_logo" value="" class="layui-input" autocomplete="off">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">网站描述</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_description" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_description" autocomplete="off" lay-affix="clear" class="layui-input">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">关键词</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_keywords" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_keywords" autocomplete="off" lay-affix="clear" class="layui-input">
             </div>
         </div>
         <div class="layui-form-item">
             <label class="layui-form-label">公司名称</label>
             <div class="layui-input-inline layui-input-wrap">
-                <input type="text" name="app_company" lay-verify="required" autocomplete="off" lay-affix="clear" class="layui-input">
+                <input type="text" name="app_company" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">备案号</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="text" name="app_filing" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">备案号链接地址</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="text" name="app_filing" autocomplete="off" lay-affix="clear" class="layui-input">
+            </div>
+        </div>
+        <div class="layui-form-item">
+            <label class="layui-form-label">模板</label>
+            <div class="layui-input-inline layui-input-wrap">
+                <input type="radio" name="template" value="2" title="模板2">
+{{--                <input type="radio" name="sex" value="2" title="女">--}}
+{{--                <input type="radio" name="sex" value="nv" title="女" checked>--}}
             </div>
         </div>
         <div class="layui-form-item">
@@ -57,10 +87,11 @@
     // API
     const VIEW_API = "/admin/api/website/config/view"; // 获取关键词数据
     const SAVE_API = "/admin/api/website/config/save"; // 重新保存数据
+    const UPLOAD_API = '/upload/image' // 上传图片
 
     layui.use(['upload', 'jquery', 'popup', 'form'], function(){
         const $ = layui.jquery;
-
+        const upload = layui.upload;
         initViewData()
         layui.form.on("submit(save)", function (data) {
             layui.$.ajax({
@@ -81,7 +112,32 @@
             });
             return false;
         });
-
+        // 上传logo
+        upload.render({
+            elem: '#logo_upload_btn' //绑定元素
+            ,url: UPLOAD_API // 上传接口，实际使用时改成您自己的上传接口即可。
+                ,accept: 'images' // 限制为图片类型
+                ,exts: 'jpg|jpeg|png|gif|ico' // 允许上传的文件格式，加入 ico 格式
+            ,before: function(obj){ //obj参数包含的信息，跟 choose回调完全一致，可参见上文。
+                console.log(obj)
+            }
+            ,done: function(res){
+                //上传完毕回调
+                console.log(res)
+                // 若上传失败
+                if(res.code > 0){
+                    return layer.msg('上传失败');
+                }
+                // 上传成功的一些操作
+                // …
+                document.querySelector('[id="app_logo"]').src = res.data.url
+                $("input[name=app_logo]").val(res.data.url);
+            }
+            ,error: function(e){
+                console.log(e)
+                //请求异常回调
+            }
+        });
         function initViewData() {
             let viewId = layui.url().search['id']
             $.ajax({
@@ -92,6 +148,10 @@
                 method: 'get',
                 dataType: "json",
                 success: function (res) {
+                    // ajax产生错误
+                    if (res.code) {
+                        layui.popup.failure(res.msg);
+                    }
 
                     // 赋值表单
                     layui.each(res.data, function (key, value) {
@@ -109,23 +169,17 @@
                     });
 
                     const form = layui.form;
-
+                    const app_template = res.data.app_template
-                    const selectedPlatforms = res.data.platform; // 后端数据
+                    console.log(document.querySelectorAll('input[name="template"]'))
-
+                    document.querySelectorAll('input[name="template"]').forEach(el => {
-                    selectedPlatforms?.forEach(val => {
+                        if (el.value == app_template) {
-                        // 设置 value 对应的 checkbox 为选中
-                        document.querySelectorAll('input[name="platform[]"]').forEach(el => {
-                            if (el.value == val) {
                             el.checked = true;
                         }
-                        });
+                        // console.log(el)
                     });
 
-                    form.render('checkbox'); // 重新渲染
+                    document.querySelector('[id="app_logo"]').src = res.data.app_logo
-                    // ajax产生错误
+                    form.render('radio'); // 重新渲染
-                    if (res.code) {
-                        layui.popup.failure(res.msg);
-                    }
 
                 }
             });