[BD]远程下拉列表-新增表单中

80 阅读1分钟
1.在封装API中定义URL
// remoteMenuUrl
export function remoteMenuUrl() {
    const adminInfo = useAdminInfo()
    let url = getUrl() + '/admin/api/remoteMenuUrl' + '?server=1' + '&batoken=' +  adminInfo.getToken()
    return url;
}
2.在新增表单中使用
 <FormItem
    type="remoteSelect"
    prop="id"
    :label="菜单"
    v-model="baTable.form.items!.id"
    :input-attr="{
        pk: 'menu_rule.id',
        field: 'title',
        'remote-url': '/admin/api/remoteMenuUrl' ,
        onChange: getAdd,
    }"
/>
import { remoteMenuUrl } from '/@/api/backend/adminapi'
let remoteUrl = remoteMenuUrl()

后端返回数据

{
    "code": 1,
    "msg": "",
    "time": 1684976928,
    "data": {
        "list": [
            {
                "id": 1,
                "title": "待审核"
            }
        ],
        "total": 12
    }
}

总结: 重点是: pk: 'menu_rule.id' 需要对应数据表中的字段

后端换成树形目录数据

    /**
     * 获取远程下拉数据(菜单树形目录)
     */
    public function remoteMenuUrl()
    {
        // 读取用户组所有权限规则
        $where = [
            ['type', 'in', ['menu_dir', 'menu']], 
            ['status', '=', '1']
        ];

        $model = new \app\admin\model\MenuRule();
        $rules = $model
            ->where($where)
            ->order('weigh desc,id asc')
            ->select()->toArray();
        $data = $this->tree->assembleChild($rules);
        $data = $this->tree->assembleTree($this->tree->getTreeArray($data, 'title'));
        $this->success('', [
            'options' => $data
        ]);
    }