• el-select 下拉框 获取后台数据展示


      option添加赋值

    <el-col :span="10">
         //<!-- 所属业务, 字典 -->
         <el-form-item label="所属业务:" prop="businessType" label-width="180px">
            <el-select v-model="ruleForm1.businessType" placeholder="请选择所属业务" style=" 80%" clearable >
                 <el-option v-for="item in businessTypeS" :key="item.id" :label="item.dictLabel" :value="item.dictLabel"></el-option>
            </el-select>
         </el-form-item>
    </el-col>

      

      data -> return 绑定变量

    
    
    <script>
    import api from "@/api/api.js";
     
    export default {
       components: {},
     data() {
         return {
             businessTypeS: [],
         }
     },

    created() {
         this.baseSysDicBtn()
     },


      methods: {
     
        // 产品基本信息 - 所属业务(字典)
        baseSysDicBtn(){
           api.baseSysDic("sys_business_type").then( res => {
           if( res.code != 200){ return this.message("系统错误,请重新查询") }
                this.businessTypeS = res.data
           })
        },

       }
     
    }
     

      后台数据格式:

      


      试图展示:


      api.js 接口封装

    import axios from 'axios';
    import { baseURL} from './sys.js';
    import { MessageBox } from 'element-ui';
    import {Base64} from 'js-base64';
    import website from '@/website.js'
    import Qs from 'qs'

    var _axios = axios.create({
        //baseURL: '/api'
        baseURL:baseURL
    })

    var nowTime = '';

    export const getList = (current, size, params) => {
        return request({
            url: '/finance-web/sys/user/list',
            method: 'get',
            params: {
                ...params,
                current,
                size,
            }
        })
    }
    _axios.interceptors.request.use(
        (config) => {
            nowTime = Date.now()
            let token = sessionStorage.getItem('token')
            config.headers['X-UserToken'] = token // 让每个请求携带token--['Authorization']为自定义key 请根据实际情况自行修改
            
            // config.headers['Content-Type'] = 'application/json;charset=UTF-8';
            // let token = sessionStorage.getItem('token')
            // if (token) {
            //     config.headers['X-UserToken'] = token // 让每个请求携带token--['Authorization']为自定义key 请根据实际情况自行修改
            // }
            return  config
        }, (error) => {
            return Promise.reject(error)
        }
    )

    _axios.interceptors.response.use(
        (response) => {
            return response.data;
        }, (error) => {
            if (error.response) {

                switch (error.response.status) {

                    case 401:
                        vm.$router.push({ path: '/Login' })
                        vm.$message.warning('登录过期')
                        sessionStorage.clear();

                        break;
                    case 500:
                        MessageBox.alert('服务器错误', '', {
                            type: 'error'
                        })
                        break;
                    case 504:
                        MessageBox.alert('连接服务器超时', '', {
                            type: 'error'
                        })
                        break;
                    case 408:
                        MessageBox.alert('请求超时', '', {
                            type: 'error'
                        })
                        break;
                    case 404:
                        MessageBox.alert('服务不存在', '', {
                            type: 'error'
                        })
                        break;
                        case 403:
                        vm.$router.push({ path: '/forbidden' })
                        vm.$message.warning('无权限访问')

                            break;
                }

            }
            return Promise.reject(error);
        }
    );
        


    export default {
        // 登录
        Login: function(data) {
            return _axios.post("cgrzzl-oauth/auth/getToken", data);
        },
        // 退出
        toLogout: function(data) {
            return _axios.delete(`cgrzzl-oauth/auth/removeToken/${data}`)
        },

        // 侧栏导航
        getSideNav: function(data) {
            return _axios.post("manage-service/system/menu/list", data);
        },

        // 公共字典接口
        baseSysDic: function(data) {
            return _axios.get(`/manage-service/system/dict/data/dictType/${data}`)
        },

      // *******************************************  产品管理  *******************************************
        // ---------------------------  产品信息管理  ---------------------------
        //新增 LPR利率
        addFactoryProductRate: function(data) {
            return _axios.post("/factory-service/factory/product", data)
        },

        // 删除LPR利率
        deleteFactoryProductRate: function(data) {
            return _axios.delete(`factory-service/factory/product/${data}`)
        },
        
        //修改 LPR利率
        updateFactoryProductRate: function(data) {
            return _axios.put("/factory-service/factory/product", data)
        },

        //修改 LPR利率状态
        upDateFactoryProductRateStatus: function(data) {
            return _axios.put("/factory-service/factory/product/onOrOff", data, { params: data });
        },

        // LPR利率列表
        getFactoryProductRateList: function(params) {
            return _axios.get("/factory-service/factory/product/list", { params: params })
        },
        
        // 查询LPR利率详情 (获取)
        getFactoryProductRateDetail: function(id) {
            return _axios.get(`/factory-service/factory/product/${id}`)
        },

        // ---------------------------    产品发布    ---------------------------
     

        // ---------------------------    产品试算    ---------------------------
       



      // *******************************************  产品策略管理  *******************************************
        // ---------------------------  冲抵策略管理  ---------------------------
        //新增 指标参数
        addFactoryOffset: function(data) {
            return _axios.post("/factory-service/factory/offset", data)
        },

        //删除 指标参数
        deleteFactoryOffset: function(data) {
            return _axios.delete(`factory-service/factory/offset/${data}`)
        },
        
        //修改 指标参数
        updateFactoryOffset: function(data) {
            return _axios.put("/factory-service/factory/offset", data)
        },

        //修改 指标参数状态
        upDateFactoryOffsetStatus: function(data) {
            return _axios.put("/factory-service/factory/offset/onOrOff", data, { params: data });
        },

        // 指标参数列表
        getFactoryOffsetList: function(params) {
            return _axios.get("/factory-service/factory/offset/list", { params: params })
        },
        
        // 查询指标参数详情
        getFactoryOffsetDetail: function(id) {
            return _axios.get(`/factory-service/factory/offset/${id}`)
        },

        // ---------------------------  代理商管理  ---------------------------
        //代理商树形结构数据
        getAgencyTree: function() {
            return _axios.get("/factory-service/factory/scopeCompany/getTree")
        },
        //还款计划列表
        getRepaymentScheduleList: function(params) {
            return _axios.get("/factory-service/factory/scopeCompany/list", { params: params })
        },



      // *******************************************  产品参数管理  *******************************************
        // ---------------------------  贷款市场利率管理LPR  ---------------------------
        //新增 LPR利率
        addFactoryLprInterestRate: function(data) {
            return _axios.post("/factory-service/factory/lprInterestRate", data)
        },

        // 删除LPR利率
        deleteFactoryLprInterestRate: function(data) {
            return _axios.delete(`factory-service/factory/lprInterestRate/${data}`)
        },
        
        //修改 LPR利率
        updateFactoryLprInterestRate: function(data) {
            return _axios.put("/factory-service/factory/lprInterestRate", data)
        },

        //修改 LPR利率状态
        upDateFactoryLprInterestRateStatus: function(data) {
            return _axios.put("/factory-service/factory/lprInterestRate/onOrOff", data, { params: data });
        },

        // LPR利率列表
        getFactoryLprInterestRateList: function(params) {
            return _axios.get("/factory-service/factory/lprInterestRate/list", { params: params })
        },
        
        // 查询LPR利率详情 (获取)
        getFactoryLprInterestRateDetail: function(id) {
            return _axios.get(`/factory-service/factory/lprInterestRate/${id}`)
        },


        // ---------------------------  产品期限管理  ---------------------------
        //新增 产品期限
        addFactoryTerm: function(data) {
            return _axios.post("/factory-service/factory/term", data)
        },

        // 删除 产品期限
        deleteFactoryTerm: function(data) {
            return _axios.delete(`factory-service/factory/term/${data}`)
        },
        
        //修改 产品期限
        updateFactoryTerm: function(data) {
            return _axios.put("/factory-service/factory/term", data)
        },

        //修改 产品期限状态
        upDateFactoryTermStatus: function(data) {
            return _axios.put("/factory-service/factory/term/onOrOff", data, { params: data });
        },

        // 产品期限列表
        getFactoryTermList: function(params) {
            return _axios.get("/factory-service/factory/term/list", { params: params })
        },
        
        // 查询产品期限详情
        getFactoryTermDetail: function(id) {
            return _axios.get(`/factory-service/factory/term/${id}`)
        },


        // ---------------------------  费用参数管理  ---------------------------
        //新增 指标参数
        addRepaymentInterval: function(data) {
            return _axios.post("/factory-service/factory/repaymentInterval", data)
        },

        //删除 指标参数
        deleteRepaymentInterval: function(data) {
            return _axios.delete(`factory-service/factory/repaymentInterval/${data}`)
        },
        
        //修改 指标参数
        updateRepaymentInterval: function(data) {
            return _axios.put("/factory-service/factory/repaymentInterval", data)
        },

        //修改 指标参数状态
        upDateRepaymentIntervalStatus: function(data) {
            return _axios.put("/factory-service/factory/repaymentInterval/onOrOff", data, { params: data });
        },

        // 指标参数列表
        getRepaymentIntervalList: function(params) {
            return _axios.get("/factory-service/factory/repaymentInterval/list", { params: params })
        },
        
        // 查询指标参数详情
        getRepaymentIntervalDetail: function(id) {
            return _axios.get(`/factory-service/factory/repaymentInterval/${id}`)
        },


        // ---------------------------  费用参数管理  ---------------------------
        //新增 费用参数
        addFactoryCost: function(data) {
            return _axios.post("/factory-service/factory/cost", data)
        },

        //删除 费用参数
        deleteFactoryCost: function(data) {
            return _axios.delete(`factory-service/factory/cost/${data}`)
        },
        
        //修改 费用参数
        updateFactoryCost: function(data) {
            return _axios.put("/factory-service/factory/cost", data)
        },

        //修改 费用参数状态
        upDateFactoryCostStatus: function(data) {
            return _axios.put("/factory-service/factory/cost/onOrOff", data, { params: data });
        },

        // 费用参数列表
        getFactoryCostList: function(params) {
            return _axios.get("/factory-service/factory/cost/list", { params: params })
        },
        
        // 查询费用参数详情
        getFactoryCostDetail: function(id) {
            return _axios.get(`/factory-service/factory/cost/${id}`)
        },
        // 费用下拉参数列表,供冲抵策略管理使用
        getSelectCostList: function() {
            return _axios.get("/factory-service/factory/cost/selectCost")
        },


        // ---------------------------  指标参数管理  ---------------------------
        //新增 指标参数
        addFactoryTarget: function(data) {
            return _axios.post("/factory-service/factory/target", data)
        },

        //删除 指标参数
        deleteFactoryTarget: function(data) {
            return _axios.delete(`factory-service/factory/target/${data}`)
        },
        
        //修改 指标参数
        updateFactoryTarget: function(data) {
            return _axios.put("/factory-service/factory/target", data)
        },

        //修改 指标参数状态
        upDateFactoryTargetStatus: function(data) {
            return _axios.put("/factory-service/factory/target/onOrOff", data, { params: data });
        },

        // 指标参数列表
        getFactoryTargetList: function(params) {
            return _axios.get("/factory-service/factory/target/list", { params: params })
        },
        
        // 查询指标参数详情
        getFactoryTargetDetail: function(id) {
            return _axios.get(`/factory-service/factory/target/${id}`)
        },


        // ---------------------------  贴息机构管理  ---------------------------
        //新增 贴息机构
        addDiscountAgency: function(data) {
            return _axios.post("/factory-service/factory/discountAgency", data)
        },

        // 删除贴息机构
        deleteDiscountAgency: function(data) {
            return _axios.delete(`/factory-service/factory/discountAgency/${data}`)
        },
        
        //修改 贴息机构
        updateDiscountAgency: function(data) {
            return _axios.put("/factory-service/factory/discountAgency", data)
        },

        //修改 贴息机构状态
        upDateDiscountAgencyStatus: function(data) {
            return _axios.put("/factory-service/factory/discountAgency/onOrOff/", data, { params: data });
        },

        // 贴息机构列表
        getDiscountAgencyList: function(params) {
            return _axios.get("/factory-service/factory/discountAgency/list", { params: params })
        },
       
        // 查询贴息机构详情
        getDiscountAgencyDetail: function(id) {
            return _axios.get(`/factory-service/factory/discountAgency/${id}`)
        },

    }
     
  • 相关阅读:
    JPA
    XMPP技术之Smack库的自定义消息扩展
    VMVare的窗口自适应
    linux c tcp p2p
    linux 消息队列
    基数排序-LSD
    基数排序-纪念欧某新
    归并排序
    锦标赛排序
    快速排序 之添加复合插入排序和原始序列取中值左pivot
  • 原文地址:https://www.cnblogs.com/Antwan-Dmy/p/13176924.html
Copyright © 2020-2023  润新知