feature: 面板

2025-05-22 17:53:46 +08:00 · 2025-05-22 17:53:46 +08:00 · 8fb4af1b47
commit 8fb4af1b47
parent 4f29e8bf82
4 changed files with 181 additions and 59 deletions
--- a/application/admin/controller/Dashboard.php
+++ b/application/admin/controller/Dashboard.php
@ -152,5 +152,28 @@ class Dashboard extends Backend
        return $this->view->fetch();
    }

+    public function task_complete($ids = null)
+    {
+
+        $row = (new Task())->get($ids);
+        if (!$row) {
+            $this->error(__('No Results were found'));
+        }
+        if (false === $this->request->isPost()) {
+            $this->view->assign('row', $row);
+            return $this->view->fetch();
+        }
+        $params = $this->request->post('row/a');
+
+        $task = (new Task())->where('id', '=', $ids)->where('status', 1)->find();
+
+        if (!$task) {
+            $this->error('任务状态已变更，请刷新后操作');
+        }
+        $task->save(['status' => 3, 'prove_file_path' => $params['prove_file_path']]);
+
+        $this->success();
+    }
+

 }
--- a/application/admin/view/dashboard/task.html
+++ b/application/admin/view/dashboard/task.html
@ -1,83 +1,114 @@
 <style>
-    .note-card {
-        width: 30%;
-        min-height: 150px;
-        border-radius: 8px;
-        padding: 1rem;
-        box-shadow: 2px 2px 8px rgba(0,0,0,0.1);
-        margin: 1rem;
+    .dashboard {
+        display: grid;
+        grid-template-columns: repeat(3, 1fr); /* 三列 */
+        gap: 32px;
+        width: 1200px; /* 根据需要调整 */
    }

-    .note-container {
+    /* 每一类任务（每日/每周/每月） */
+    .section {
        display: flex;
-        justify-content: space-between;
-        flex-wrap: wrap;
+        flex-direction: column;
+        gap: 16px;
    }

-    .bg-orange {
-        background-color: #ff8c42;
+    /* 标题部分 */
+    .section-title {
+        font-size: 18px;
+        font-weight: 600;
+        display: flex;
+        align-items: center;
+        gap: 6px;
+        color: #333;
    }

-    .bg-blue {
-        background-color: #4682b4;
+    .section-title::before {
+        content: "📌";
+        font-size: 20px;
    }

-    .bg-purple {
-        background-color: #8a2be2;
+    /* 卡片样式 */
+    .card {
+        background: #fff;
+        border: 1px solid #e0e4e8;
+        border-radius: 6px;
+        padding: 16px 20px;
+        box-shadow: 0 2px 4px rgba(0, 0, 0, .04);
+        display: flex;
+        flex-direction: column;
+        gap: 8px;
+        transition: transform .15s ease, box-shadow .15s ease;
+    }
+    .card:hover {
+        transform: translateY(-2px);
+        box-shadow: 0 6px 12px rgba(0, 0, 0, .08);
    }

-    .note-header {
-        background-color: white;
-        color: #000; /* ✅ 加这一行，确保文字是黑色的 */
-        text-align: center;
-        padding: 0.5rem;
-        font-weight: bold;
-        border-bottom: 1px solid #f0e68c;
-        border-top-left-radius: 8px;
-        border-top-right-radius: 8px;
+    /* 卡片内标题和注释 */
+    .card .title {
+        font-size: 15px;
+        font-weight: 600;
+        color: #222;
+        line-height: 1.45;
+    }
+    .card .note {
+        font-size: 13px;
+        color: #666;
+        line-height: 1.4;
    }

-    .note-title {
-        font-size: 2.4rem;
-        font-weight: bold;
-        margin: 0.3rem 0 0.1rem;
+    /* 响应式：小屏变成1列 */
+    @media (max-width: 1024px) {
+        .dashboard {
+            grid-template-columns: repeat(2, 1fr);
+        }
    }
-
-    .note-desc {
-        font-size: 1.9rem;
-        margin: 0 0 0.6rem;
+    @media (max-width: 768px) {
+        .dashboard {
+            grid-template-columns: 1fr;
+        }
    }
 </style>

 <div>
    <h2>任务看板</h2>
 </div>
-<div class="container mt-5">
-    <div class="note-container">
-        <div class="note-card bg-orange">
-            <h3 class="note-header">每日任务</h3>
-            {foreach $day as $item}
-            <p class="note-title">{$item->title}</p>
-            <p class="note-desc">{$item->desc}</p>
-            <br>
-            {/foreach}
-        </div>
-        <div class="note-card bg-blue">
-            <h3 class="note-header">每周任务</h3>
-            {foreach $week as $item}
-            <p class="note-title">{$item->title}</p>
-            <p class="note-desc">{$item->desc}</p>
-            <br>
-            {/foreach}
-        </div>

-        <div class="note-card bg-purple">
-            <h3 class="note-header">每月任务</h3>
-            {foreach $month as $item}
-            <p class="note-title">{$item->title}</p>
-            <p class="note-desc">{$item->desc}</p>
-            <br>
-            {/foreach}
+
+<div class="dashboard">
+
+    <!-- 每日任务 -->
+    <div class="section">
+        <h3 class="section-title">每日任务</h3>
+        {foreach $day as $item}
+        <div class="card spec_add_btn" data-url="/admin/dashboard/task_complete/ids/{$item->id}">
+            <div class="title">{$item->title}</div>
+            <div class="note">{$item->desc}</div>
        </div>
+        {/foreach}
    </div>
+
+    <!-- 每周任务 -->
+    <div class="section">
+        <h3 class="section-title">每周任务</h3>
+        {foreach $week as $item}
+        <div class="card spec_add_btn" data-url="/admin/dashboard/task_complete/ids/{$item->id}">
+            <div class="title">{$item->title}</div>
+            <div class="note">{$item->desc}</div>
+        </div>
+        {/foreach}
+    </div>
+
+    <!-- 每月任务（举例） -->
+    <div class="section">
+        <h3 class="section-title">每月任务</h3>
+        {foreach $month as $item}
+        <div class="card spec_add_btn" data-url="/admin/dashboard/task_complete/ids/{$item->id}">
+            <div class="title">{$item->title}</div>
+            <div class="note">{$item->desc}</div>
+        </div>
+        {/foreach}
+    </div>
+
 </div>
--- a/application/admin/view/dashboard/task_complete.html
+++ b/application/admin/view/dashboard/task_complete.html
@ -0,0 +1,38 @@
+<form id="task_complete-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
+
+    <h1>任务详情</h1>
+    <div class="form-group">
+        <label class="control-label col-xs-12 col-sm-2">标题:</label>
+        <div class="col-xs-12 col-sm-8">
+            {$row->title|htmlentities}
+        </div>
+    </div>
+    <div class="form-group">
+        <label class="control-label col-xs-12 col-sm-2">描述:</label>
+        <div class="col-xs-12 col-sm-8">
+            {$row->desc|htmlentities}
+        </div>
+    </div>
+
+    <div class="form-group">
+        <label class="control-label col-xs-12 col-sm-3">文件地址</label>
+        <div class="col-xs-12">
+            <div class="input-group">
+                <input id="c-prove_file_path" class="form-control" size="50" name="row[prove_file_path]" type="text" value="">
+                <div class="input-group-addon no-border no-padding">
+                    <span><button type="button" id="plupload-path" class="btn btn-danger plupload" data-input-id="c-prove_file_path" data-mimetype="*" data-multiple="true" data-preview-id="p-path"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
+                    <span><button type="button" id="fachoose-path" class="btn btn-primary fachoose" data-input-id="c-prove_file_path" data-mimetype="*" data-multiple="true"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
+                </div>
+                <span class="msg-box n-right" for="c-prove_file_path"></span>
+            </div>
+        </div>
+    </div>
+
+    <div class="form-group layer-footer">
+        <div class="col-xs-12 col-sm-8">
+            <button type="submit" class="btn btn-primary btn-embossed disabled">完成任务</button>
+            <button type="reset" class="btn btn-primary btn-embossed btn-close" onclick="Layer.closeAll();">{:__('Close')}</button>
+        </div>
+    </div>
+</form>
+
--- a/public/assets/js/backend/dashboard.js
+++ b/public/assets/js/backend/dashboard.js
@ -1,4 +1,4 @@
-define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echarts-theme', 'template'], function ($, undefined, Backend, Datatable, Table, Echarts, undefined, Template) {
+define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echarts-theme', 'template', 'form'], function ($, undefined, Backend, Datatable, Table, Echarts, undefined, Template, Form) {

    var Controller = {
        index: function () {
@ -73,6 +73,36 @@ define(['jquery', 'bootstrap', 'backend', 'addtabs', 'table', 'echarts', 'echart
                }, 0);
            });

+        },
+        task: function () {
+
+            $(document).on('click','.spec_add_btn', function (event) {
+                var url = $(this).attr('data-url');
+                if(!url) return false;
+                var msg = $(this).attr('data-title');
+                var width = $(this).attr('data-width');
+                var height = $(this).attr('data-height');
+                var area = [$(window).width() > 800 ? (width?width:'800px') : '95%', $(window).height() > 600 ? (height?height:'600px') : '95%'];
+                var options = {
+                    shadeClose: false,
+                    shade: [0.3, '#393D49'],
+                    area: area,
+                    callback:function(value){
+                        CallBackFun(value.id, value.name);//在回调函数里可以调用你的业务代码实现前端的各种逻辑和效果
+                    }
+                };
+                Fast.api.open(url,msg,options);
+            });
+
+        },
+        task_complete: function () {
+            Form.api.bindevent($("form[role=form]"), function(data, ret){
+                //这里是表单提交处理成功后的回调函数，接收来自php的返回数据
+                Fast.api.close(data);//这里是重点
+                Toastr.success("成功");//这个可有可无
+            }, function(data, ret){
+                Toastr.success("失败");
+            });
        }
    };