![](https://img.kancloud.cn/8f/41/8f41919295eb8320cdc8007e587ace82_1327x520.png)
### 代码
```
~~~
define(['jquery', 'bootstrap', 'backend', 'table', 'form'], function ($, undefined, Backend, Table, Form) {
var Controller = {
index: function () {
// 初始化表格参数配置
Table.api.init({
extend: {
index_url: 'artical/index' + location.search,
add_url: 'artical/add',
edit_url: 'artical/edit',
del_url: 'artical/del',
multi_url: 'artical/multi',
import_url: 'artical/import',
dragsort_url: '',
table: 'artical',
}
});
var table = $("#table");
$(".btn-add").data("area",["70%","100%"]);
$(".btn-edit").data("area",["70%","100%"]);
// 初始化表格
table.bootstrapTable({
url: $.fn.bootstrapTable.defaults.extend.index_url,
pk: 'id',
sortName: 'id',
columns: [
[
{checkbox: true},
{field: 'id',operate:false, title: __('Id'),formatter: function (value,row) {
return '<a target="_blank" style="color: #dfdada" href="/d' + value + '">' + value + '</a>';
},autocomplete:false,cellStyle: function () {return {css: {"background":"#ff00006e","color":"#fff","padding":"0","font-size":"18px"}}}},
{field: 'user.username', title: __('User.username'), operate: 'LIKE'},
{field: 'user_id', title: __('User_id'),operate:false},
//{field: 'user.avatar',operate:false, title: __('User.avatar'), events: Table.api.events.image, formatter: Table.api.formatter.image},
{field: 'recom', title: __('推荐位'),operate:'LIKE',formatter: function (value ,row,data ) {
if(value.length == 0){
return "无";
}
var recom_name = '';
for (var i = 0; i<value.length;i++){
recom_name += value[i].recom_name+"<br>";
}
return recom_name;
},autocomplete:false,cellStyle: function () {return {css: {"background":"#ff00006e","color":"#fff","padding":"3px","font-size":"15px","white-space":"pre-wrap","max-width":"80px","word-break":"break-word"}}}},
{field: 'category.name',title: __('分类'), operate: 'LIKE'},
{field: 'title', title: __('标题'),formatter: function (value,row) {
return '<a target="_blank" style="color: #ee0d0d" href="/d' + row.id + '">' + value + '</a>';
}, operate: 'LIKE',cellStyle: function () {return {css: {"max-width":'100px',"padding":"0","overflow":"hidden","white-space":"nowrap","text-overflow":"ellipsis"}}}},
{field: 'views', title: __('Views'),operate:false},
{field: 'read', title: __('是否阅读'),searchList: {"1": __('Yes'), "0": __('No')}, table: table, formatter: Table.api.formatter.toggle},
{field: 'create_time', title: __('Create_time'), operate:'RANGE', addclass:'datetimerange', autocomplete:false,cellStyle: function () {return {css: {"max-width": "86px"}}}},
{field: 'status_switch', title: __('审核通过'),searchList: {"1": __('Yes'), "0": __('No')}, table: table, formatter: Table.api.formatter.toggle},
{field: 'admin.username', title: __('审核员'), operate: 'LIKE',autocomplete:false,cellStyle: function () {return {css: {"background":" #18bc9c","border-radius": "14px", "font-size": "17px","padding": "0px"}}}},
{field: 'operate', title: __('Operate'), table: table, events: Table.api.events.operate, formatter: Table.api.formatter.operate}
]
]
});
table.on('post-body.bs.table',function(){
$(".btn-editone").data("area",["70%","100%"]);
})
// 为表格绑定事件
Table.api.bindevent(table);
},
add: function () {
$(document).ready(function(){
var info_num = $("#c-pid").val();
var child_arr = Config.child_arr;
var arr_new = [];
var html = "";
$(".category_name").html();
for (let r=0;r<child_arr.length;r++){
if(child_arr[r].pid == info_num){
arr_new.push(child_arr[r]);
if(child_arr[r]['id'] ==arr_new[0]['id'] ){
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' checked />"+child_arr[r]['name']+"</label>";
}else{
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' />"+child_arr[r]['name']+"</label>";
}
}
};
$(".category_name").html(html);
})
$("#c-pid").change(function () {
var info_num = $(this).val();
var child_arr = Config.child_arr;
var arr_new = [];
var html = "";
$(".category_name").html();
for (let r=0;r<child_arr.length;r++){
if(child_arr[r].pid == info_num){
arr_new.push(child_arr[r]);
// html += "<option value="+child_arr[r]['id']+">"+child_arr[r]['name'] +"</option>"
if(child_arr[r]['id'] ==arr_new[0]['id'] ){
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' checked />"+child_arr[r]['name']+"</label>";
}else{
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' />"+child_arr[r]['name']+"</label>";
}
}
}
$(".category_name").html(html);
});
Controller.api.bindevent();
},
edit: function () {
$("#c-pid").change(function () {
var info_num = $(this).val();
var child_arr = Config.child_arr;
var arr_new = [];
var html = "";
$(".category_name").html();
for (let r=0;r<child_arr.length;r++){
if(child_arr[r].pid == info_num){
arr_new.push(child_arr[r]);
// html += "<option value="+child_arr[r]['id']+">"+child_arr[r]['name'] +"</option>"
if(child_arr[r]['id'] ==arr_new[0]['id'] ){
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' checked />"+child_arr[r]['name']+"</label>";
}else{
html += "<label style='min-height: 33px;padding-left: 32px;zoom:1.4'> <input name='row[category_id]' value='"+child_arr[r]['id']+"' type='radio' />"+child_arr[r]['name']+"</label>";
}
}
}
$(".category_name").html(html);
});
Controller.api.bindevent();
},
api: {
bindevent: function () {
Form.api.bindevent($("form[role=form]"));
}
}
};
return Controller;
});
~~~
```