若依框架显示详细信息功能

---

若依框架显示详细信息功能

1.在显示界面引入可预览详细信息选项

重点是引入detailView: true,detailFormatter: detailFormatter,这两个属性
代码如下：

var options = {
            url: prefix + "/list",
            createUrl: prefix + "/add",
            updateUrl: prefix + "/edit/{id}",
            removeUrl: prefix + "/remove",
            exportUrl: prefix + "/export",
            detailView: true,
            detailFormatter: detailFormatter,
            modalName: "工程",
            columns: [{
                checkbox: true
            },
                {
                    field: 'gcid',
                    title: '工程主键',
                    visible: false
                },
                {
                    field: 'gcmc',
                    title: '工程名称'
                },

2.编写detailFormatter的实现函数

可以直接用each函数循环数据，把每个数据元素都展示出来，也可以自定义需要展示的数据
代码如下：

function detailFormatter(index, row) {
        var html = [];
        html.push('
工程名称: ' + row.gcmc + '
');
        html.push('
工程编号: ' + row.gcbh + '
');
        html.push('
工程性质: ' + $.table.selectDictLabel(datas2, row.gcxz) + '
');
        html.push('
委托编号: ' + row.wtbh + '
');
        html.push('
委托单位: ' + row.wtdw + '
');
        html.push('
完成状态: ' + $.table.selectDictLabel(datas1, row.wczt) + '
');
        html.push('
创建时间: ' + row.createTime + '
');
        html.push('
联系人: ' + (row.lxr == null ? "" : row.lxr) + '  联系人电话:' + (row.lxrphone == null ? "" : row.lxrphone) + '
');
        // $.each(row, function(key, value) {
        // 	html.push('
' + key + ': ' + value + '
');
        // });
        return html.join('');
    }

3.效果实现

---