【Fastadmin】根据Fieldlist键值组件做一个等级配置的完整示例

目录

1.效果展示：

​编辑

2.建表：

3.html页面

4.controller控制器

5.js

6.model

---

1.效果展示：

---

2.建表：

---

表名：fa_xxfb_config

/*
 Navicat Premium Data Transfer

 Source Server         : root
 Source Server Type    : MySQL
 Source Server Version : 50726
 Source Host           : localhost:3306
 Source Schema         : xxx

 Target Server Type    : MySQL
 Target Server Version : 50726
 File Encoding         : 65001

 Date: 11/12/2023 17:50:00
*/

SET NAMES utf8mb4;
SET FOREIGN_KEY_CHECKS = 0;

-- ----------------------------
-- Table structure for fa_xxfb_config
-- ----------------------------
DROP TABLE IF EXISTS `fa_xxfb_config`;
CREATE TABLE `fa_xxfb_config`  (
  `id` int(10) UNSIGNED NOT NULL AUTO_INCREMENT COMMENT 'ID',
  `name` varchar(50) CHARACTER SET utf8 COLLATE utf8_general_ci NULL DEFAULT NULL COMMENT '配置项名称',
  `value` text CHARACTER SET utf8 COLLATE utf8_general_ci NULL COMMENT '配置项值',
  PRIMARY KEY (`id`) USING BTREE,
  UNIQUE INDEX `name`(`name`) USING BTREE
) ENGINE = InnoDB AUTO_INCREMENT = 3 CHARACTER SET = utf8 COLLATE = utf8_general_ci ROW_FORMAT = Dynamic;

SET FOREIGN_KEY_CHECKS = 1;

3.html页面

---

    

        

            
            

                

                    温馨提示

                    这里是等级的配置


                
                

                    

                        等级配置:
                        

                            

                                

                                    
{:__('名称')}
                                    
{:__('累计收益')}
                                    
{:__('押金')}
                                    
{:__('图标')}

                                    

                                
                                

                                    
 {:__('Append')}
                                
                            

                            
                            {$grade.value}
                            
                        
                    
                    

                        什么是账号等级？

                    
                    

                        

                            

                                

                                    
{:__('账号等级说明')}：
                                
                            

                            
                            {$grade_explain.value}
                        
                    

                        
                        

                            {:__('OK')}
                            {:__('Reset')}
                        
                    

                
            
        

    

plus图标：

4.controller控制器

---

grade = Config::where('name', 'grade')->find();
        $this->assign('grade', $this->grade);
        $this->grade_explain = Config::where('name', 'grade_explain')->find();
        $this->assign('grade_explain', $this->grade_explain);
        parent::_initialize();
    }

    public function index()
    {
        if ($this->request->isPost()) {
            $data = $this->request->post("row/a");
            if($data['grade']){

                if($this->grade){
                    $this->grade->value = $data['grade'];
                    $this->grade->save();
                }else{
                    $arr = ['name' => 'grade', 'value' => $data['grade']];
                    Config::create($arr);
                }
            }
            if($data['grade_explain']){
                if($this->grade_explain){
                    $this->grade_explain->value = $data['grade_explain'];
                    $this->grade_explain->save();
                }else{
                    $arr = ['name' => 'grade_explain', 'value' => $data['grade_explain']];
                    Config::create($arr);
                }
            }

            $this->success("提交成功");
        }
        return $this->view->fetch();
    }

}

5.js

---

define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {

    var Controller = {
        index: function () {
            Template.helper("Fast", Fast);

            $(document).on("fa.event.appendfieldlist", "#first-table .btn-append", function (e, obj) {
                //绑定上传组件
                Form.events.faupload(obj);

                //上传成功回调事件，变更按钮的背景
                $(".upload-image", obj).data("upload-success", function (data) {
                    $(this).css("background-image", "url('" + Fast.api.cdnurl(data.url) + "')");
                })
            });
            Form.api.bindevent($("form[role=form]"), function (data, ret) {
                // Layer.alert(data.data);
            });
        },
    };
    return Controller;
});

6.model

---