前端开发规范

eu- 标签

  1. 1. eu- 标签 在我们的el- 标签上的基础上拓展出来的
  2. 2. 具体的一些组件 和 使用方法 详见文档 https://element.eleme.cn/#/zh-CN/component/installation

说明

  1. 1.在前端工程目录里 我们一个文件夹就相当于一个页面
  2. 2.这个文件夹里包含 暂时包含六个部分 如下图所示
  3. 3.针对于增删改查 四个方向 把每个动作 都拆分成对应的文件 如 增 我们就在新增的弹框文件里完成我们的业务逻辑 改 就在我们的编辑的弹框文件里 完成我们的业务逻辑 查 就在我们的查看弹框里 完成我们的业务逻辑

1.png

页面效果展示

2.png

页面布局文件 index.vue

  1. 1.需要引入我们add,edit,view,searchForm,文件夹下的文件
  2. 2.主要用来布局 
  3. 3.可以查询列表 和 展示列表
  4. 4.当点击新增 查看 编辑的功能按钮时 需要调取 引入的对应的弹框
  5. 5.详细代码见 src\renderer\views\demo\base1\index.vue
  1. //首先需要在 script 标签下 引入我们对应的文件  并注册
  2. // 引入搜索表单 searchForm 文件夹下的index.vue
  3. <script>
  4. // 引入搜索表单 searchForm 文件夹下的index.vue
  5. import euSearchForm from './searchForm/index.vue'
  6. // 引入搜索表单的配置项 searchForm 文件夹下的form.js
  7. import { formOption } from './searchform/form.js'
  8. // 获取列表数据接口
  9. import { queryList, delObj } from '@/api/demotwo/index.js'
  10. import { getAllDic } from '@/utils/setAllDic'
  11. // 引入弹框 新增 编辑 查看
  12. import euAdd from './add'
  13. import euEdit from './edit'
  14. import euView from './view'
  15. //需要把我们引入的上述文件 注册成标签形式
  16. components: {
  17.     euSearchForm,
  18.     euAdd,
  19.     euEdit,
  20.     euView
  21.   },
  22. </script>
  1. <!-- 注册完毕之后 我们就可以用标签的形式 在我们的template模板上以标签的形式使用 -->
  2. <template>
  3.   <eu-card class="card-container">
  4.     <div slot="header" class="clearfix">
  5.      <span>前端开发规范base</span>
  6.     </div>
  7.     <!--这是引入了searchForm 下的index.vue文件 主要负责搜索列表 通过组件标签的形式写入  start-->
  8.     <div class="searchForm-container">
  9.       <eu-search-form :searchform="searchform" :option="option" :span='6'>
  10.           <eu-button  type="primary" @click="searchList" size="mini" icon="el-icon-search" :loading="searchBtnLoading">查 询</eu-button>
  11.           <eu-button  type="primary" @click="clearSearchForm" size="mini" icon="el-icon-delete">清 空</eu-button>
  12.       </eu-search-form>
  13.     </div>
  14.     <!--这是引入了searchForm 下的index.vue文件 主要负责搜索列表 通过组件标签的形式写入 end-->    
  15.     <!--这是eu-table列表组件 通过组件标签的形式写入 主要负责列表展示 start-->   
  16.     <div class='tabel-container'>
  17.         <eu-button icon='el-icon-plus' type='success' size='mini' style='margin-bottom:20px;' @click='add'>新增模型</el-button>
  18.         <eu-table
  19.         v-loading='tableloading'
  20.         size='mini'
  21.         stripe
  22.         :data='tableData'
  23.         :header-cell-style="{'text-align':'center','color':'#303133','background':'#FAFAFA'}"
  24.         :cell-style="{'text-align':'center','color':'#303133'}"
  25.         border
  26.         style='width: 100%'>
  27.             <eu-table-column
  28.             prop='modelCode'
  29.             label='模型代码'
  30.             >
  31.             </eu-table-column>
  32.             <eu-table-column
  33.             prop='modelName'
  34.             label='模型名称'
  35.             >
  36.             </eu-table-column>
  37.             <eu-table-column
  38.             prop='blCusType'
  39.             label='模型类型'
  40.             :formatter="typeFormatter"
  41.             >
  42.             </eu-table-column>
  43.             <eu-table-column
  44.             prop='enableFlag'
  45.             label='生效标志'
  46.             :formatter="flagFormatter"
  47.             >
  48.             </eu-table-column>
  49.             <eu-table-column
  50.             prop='bmversion'
  51.             label='模型版本号'
  52.             >
  53.             </eu-table-column>
  54.             <eu-table-column
  55.             label='操作'
  56.             width='180'>
  57.             <template slot-scope='scope'>
  58.                 <eu-button type='text' icon='el-icon-view' size='small' @click='view(scope.index,scope.row)'>查看</eu-button>
  59.                 <eu-button type='text' icon='el-icon-edit-outline' size='small' @click='edit(scope.index,scope.row)'>编辑</eu-button>
  60.                 <eu-button type='text' icon='el-icon-delete' size='small' @click='del(scope.index,scope.row)'>删除</eu-button>
  61.             </template>
  62.             </eu-table-column>
  63.         </eu-table>
  64.     </div>
  65.     <!--这是eu-table 列表组件 通过组件标签的形式写入 主要负责列表展示 end-->  
  66.     <!--这是eu-pagination 分页组件 通过组件标签的形式写入 主要负责分页 start-->  
  67.     <div class='pagination-container'>
  68.         <eu-pagination
  69.           background
  70.           layout='total, sizes, prev, pager, next, jumper'
  71.           :total='total'
  72.           @current-change='currentPage'
  73.           @size-change='sizePage'
  74.           :current-page.sync="page.currentPage"
  75.         >
  76.         </eu-pagination>
  77.     </div>
  78.     <!--这是eu-pagination 分页组件 通过组件标签的形式写入 主要负责分页 end-->  
  79.     <!--这是引入了add 下的index.vue文件 通过组件标签的形式写入 主要负责新增的弹框 start-->  
  80.     <!--这里要绑定ref 点击新增弹框的时候 打开对应的弹框--> 
  81.     <eu-add ref="add"  @initlist="getTableList"></eu-add>   
  82.     <!--这是引入了add 下的index.vue文件 通过组件标签的形式写入 主要负责新增的弹框 end--> 
  84.     <!--这是引入了edit 下的index.vue文件 通过组件标签的形式写入 主要负责编辑的弹框 start-->    
  85.     <eu-edit ref="edit"  @initlist="getTableList"></eu-edit> 
  86.     <!--这是引入了edit 下的index.vue文件 通过组件标签的形式写入 主要负责编辑的弹框 end-->     
  88.     <!--这是引入了view 下的index.vue文件 通过组件标签的形式写入 主要负责查看的弹框 start-->    
  89.     <eu-view ref="view"></eu-view>
  90.     <!--这是引入了view 下的index.vue文件 通过组件标签的形式写入 主要负责查看的弹框 end--> 
  91.   </eu-card>
  92. </template>
  1. //组件依赖的一些数据和方法
  2. <script>
  3. // 引入搜索表单 searchForm 文件夹下的index.vue
  4. import euSearchForm from './searchForm/index.vue'
  5. // 引入搜索表单的配置项 searchForm 文件夹下的form.js
  6. import { formOption } from './searchform/form.js'
  7. // 获取列表数据接口
  8. import { queryList, delObj } from '@/api/demotwo/index.js'
  9. import { getAllDic } from '@/utils/setAllDic'
  10. // 引入弹框 新增 编辑 查看
  11. import euAdd from './add'
  12. import euEdit from './edit'
  13. import euView from './view'
  14. export default {
  15.    //这里一定要与路由表的name一致  
  16.    name:'前端开发规范' ,
  17.   // 需要把我们上面引入的搜索表单的文件 新增 编辑 查看的文件 注册成组件 这样可以用标签的形式 写在 template里
  18.   components: {
  19.     euSearchForm,
  20.     euAdd,
  21.     euEdit,
  22.     euView
  23.   },
  24.   created() {
  25.     this.getTableList()
  26.   },
  27.   data() {
  28.     return {
  29.       // 表单组件的搜索配置项目
  30.       option: formOption(),
  31.       // 要搜索的表单项目
  32.       searchform: {
  33.         modelCode: '',
  34.         modelName: '',
  35.         blCusType: '',
  36.         enableFlag: ''
  37.       },
  38.       // 控制列表的loading状态
  39.       tableloading: false,
  40.       // 渲染表格所以依赖的数据
  41.       tableData: [],
  42.       // 分页控制
  43.       total: null,
  44.       page: {
  45.         currentPage: 1, // 当前页数
  46.         pageSize: 10 // 每页显示多少条
  47.       },
  48.       searchBtnLoading: false
  49.     }
  50.   },
  51.   methods: {
  52.     // 点击新增的按钮的动作 打开新增的弹框
  53.     add() {
  54.       this.$refs.add.dialogshow()
  55.     },
  56.     // 点击编辑的按钮的动作 打开编辑的弹框
  57.     edit(index, row) {
  58.       this.$refs.edit.dialogshow(row)
  59.     },
  60.     // 点击查看的按钮的动作 打开查看的弹框
  61.     view(index, row) {
  62.       this.$refs.view.dialogshow(row)
  63.     },
  64.     // 点击删除按钮的动作
  65.     del(index, row) {
  66.       this.$confirm('确认删除该项嘛?, 是否继续?', '提示', {
  67.         confirmButtonText: '确定',
  68.         cancelButtonText: '取消',
  69.         type: 'warning'
  70.       }).then(async() => {
  71.         await delObj(row.uuid)
  72.         this.getTableList()
  73.         return
  74.       }).catch(() => {
  76.       })
  77.     },
  78.     // 点击搜索按钮的动作
  79.     async searchList() {
  80.       this.searchBtnLoading = true
  81.       this.page.currentPage = 1
  82.       await this.getTableList(this.searchform)
  83.       this.searchBtnLoading = false
  84.     },
  85.     // 点击清空按钮的动作
  86.     clearSearchForm() {
  87.       for (const key in this.searchform) {
  88.         this.searchform[key] = ''
  89.       }
  90.     },
  91.     // 获取列表数据
  92.     async getTableList(params) {
  93.       this.tableloading = true
  94.       const { list, page } = await queryList(Object.assign({ pageNum: this.page.currentPage, size: this.page.pageSize }, params))
  95.       this.tableData = list
  96.       this.total = page.totalResult
  97.       this.tableloading = false
  98.     },
  99.     // 点击分页或者下一页时触发
  100.     currentPage(val) {
  101.       this.tableloading = true
  102.       this.page.currentPage = val
  103.       this.getTableList()
  104.       this.tableloading = true
  105.     },
  106.     // 点击每页显示多少条时触发
  107.     sizePage(val) {
  108.       this.page.currentPage = 1
  109.       this.page.pageSize = val
  110.       this.tableloading = true
  111.       this.getTableList()
  112.       this.tableloading = false
  113.     }
  114.   }
  115. }
  116. </script>

搜索组件文件 searchForm \ index .vue

  1. 1.主要用于我们在页面布局文件里 最上面的部分 展示
  2. 2.用于搜索满足我们条件的列表
  3. 3.进行了二次封装 需要 传入配置项
  1. //使用方法
  2. 需要在我们的布局文件用引入(不局限与布局文件 如果 有别的表单文件满足使用条件 也可以使用) 
  3. <script>
  4. // 引入搜索表单 searchForm 文件夹下的index.vue
  5. import euSearchForm from './searchForm/index.vue'
  6. // 引入搜索表单的配置项 searchForm 文件夹下的form.js
  7. import { formOption } from './searchform/form.js'
  8.  // 需要把我们上面引入的搜索表单的文件 这样可以用标签的形式 写在 template里
  9. components: {
  10.    euSearchForm,
  11. },
  12. // 在data 函数里 定义我们的配置项目 和要搜索的表单字段 
  13. option: formOption(),
  14.       // 要搜索的表单项目
  15. searchform: {
  16.   modelCode: '',
  17.   modelName: '',
  18.   blCusType: '',
  19.   enableFlag: ''
  20. },    
  21. </script>
  1. <!--在我们当前文件的 template 标签里  以标签的形式写入我们的表单搜索组件 并且传入对应的配置项 -->
  2. <template>
  3.     <div class="searchForm-container">
  4.       <!--传入我们上面定义豪的配置项-->  
  5.       <eu-search-form :searchform="searchform" :option="option" :span='6'>
  6.           <!--以插槽的形式 插入我们对应的功能按钮-->
  7.           <eu-button  type="primary" @click="searchList" size="mini" icon="el-icon-search" :loading="searchBtnLoading">查 询</eu-button>
  8.           <eu-button  type="primary" @click="clearSearchForm" size="mini" icon="el-icon-delete">清 空</eu-button>
  9.       </eu-search-form>
  10.     </div>
  11. </template>

搜索组件文件 searchForm \ form.js

  1. 1.主要编写我们搜索表单文件的 配置项目信息 
  2. 2.需要同我们的搜索表单文件 一起在 页面中引入
  1. //详细参数 需要我们写入一个数组对象 每个元素 是你的的字段 和 lable
  2. const option = [
  3.   { label: '模型代码',  //用来显示 中文名称
  4.    prop: 'modelCode',  //需要的字段
  5.    type :'input' //文本框的类型 目前有 input select data 三种 可以在自行拓展 
  6.   },
  7.   { label: '模型名称', 
  8.    prop: 'modelName' 
  9.   },
  10.   { label: '模型类型',
  11.     prop: 'blCusType',
  12.     type: 'select', 
  13.     dic: 'RATING_MODEL_TYPE', //当为select的时候 需要传入对应的字典名称 
  14.     filter: ['6', '7'], // 希望显示的字典项  数组的元素 对应选项的value值
  15.     efilter: ['6', '7'], //不希望展示字典项 数组的元素 对应选项的value值
  16.     filterable: true, //是否开启搜索
  17.     options:[{value:'1',text:'包子'}] //静态的字典项 跟dic只能用一个
  18.     :dynamic:{value:'1',text:'包子'} //需要动态加载的选项 value 不能与当前所有选项重复  
  19.   },
  20.   { label: '生效标志',
  21.     prop: 'enableFlag',
  22.     type: 'select',
  23.     dic: 'MODEL_STATUS'
  24.   }
  26. ]
  27. //最后导出我们的配置项信息 
  28. export const formOption = () => {
  29.   return option
  30. }

新增弹框文件 add \ index.vue

  1. 1.当我们点击页面布局上的新增的按钮时 打开新增弹框
  2. 2.新增弹框里面展示我们的表单 需要引入 form \ index.vue
  3. 3.点击保存的时候 发送 新增请求

3.png

  1. //首先在script标签中引入 我们对应的 文件 
  2. <script>
  3. // 引入 mixinsdialog 主要负责新增 编辑 查看 的公共方法
  4. import mixinsdialog from '@/components/dialogmixins/mixinsdialog.js'
  5. // 引入 我们新增的时候接口
  6. import { addObj } from '@/api/rating/model/tbRatBmConfModel_form'
  7. // 引入 我们form  \ index.vue 表单文件
  8. import addForm from '../form'
  9. export default {
  10.   name: 'add-dialog',
  11.   //混入我们刚才引入的公共的方法
  12.   mixins: [mixinsdialog],
  13.   //注册表单文件 用标签的形式 写入template中  
  14.   components: {
  15.     addForm
  16.   },
  17.   // 外部给我们传进来的属性 可以自定义  
  18.   props: {
  19.     titletext: {
  20.       type: String,
  21.       default() {
  22.         return '新增模型'
  23.       }
  24.     }
  25.   },  
  26.   data() {
  27.     return {
  28.       //用来控制点击保存按钮的时候 loading状态  
  29.       savebtn: false
  30.     }
  31.   },
  32.   methods: {
  33.     // 点击保存的时候动作
  34.     saveForm() {
  35.       //首先调取我们表单文件里的 验证方法  对我们输入的表单进行验证
  36.       this.$refs.dialogForm.validForm(async(valid) => {
  37.         //如果验证成功 就去发送对应的新增请求接口  
  38.         if (valid) {
  39.           //开启搜索按钮laoding  
  40.           this.savebtn = true
  41.           //发送新增请求 这里由于某些接口的返回结果 不太一样 根据实际业务场景自行判断  
  42.           const data = await addObj(this.$refs.dialogForm.form)
  43.           //如果有结果 就说明新增成功 
  44.           if (data) {
  45.             // 关闭 按钮laoding  
  46.             this.savebtn = false
  47.             //关闭弹框  
  48.             this.dialogVisible = false
  49.             //刷新列表  
  50.             this.$emit('initlist')
  51.           }
  52.         }
  53.       })
  54.     }
  55.   }
  56. }
  57. </script>
  1. <!-- 新增的弹框组件 -->
  2. <template>
  3.   <div class="adddialog-container">
  4.     <eu-dialog
  5.         :visible.sync="dialogVisible"
  6.         @close="closeDialog"
  7.         :fullscreen="isfullscreen"
  8.         :close-on-click-modal="false"
  9.         @closed="closed"
  10.         destroy-on-close
  11.         :width="width"
  12.         >
  13.         <div slot="title">
  14.           <span>{{titletext}}</span>
  15.           <div class="dialogtitle" @click="dialogmax"></div>
  16.         </div>
  17.         <slot></slot>
  18.         <add-form ref="dialogForm"></add-form>
  19.         <span slot="footer" class="dialog-footer">
  20.             <span>
  21.               <eu-button size="mini" type="primary" @click="saveForm" :loading="savebtn" icon="el-icon-check">保 存</eu-button>
  22.               <eu-button size="mini" @click="clearForm" icon="el-icon-delete">清 空</eu-button>
  23.             </span>
  24.         </span>
  25.     </eu-dialog>
  26.   </div>
  27. </template>

编辑弹框文件 edit \ index.vue

  1. 1.当我们点击页面布局上的编辑的按钮时 打开编辑弹框 需要传入我们当前行的信息
  2. 2.编辑弹框里面展示我们的表单 需要引入 form \ index.vue
  3. 3.点击保存的时候 发送 更新的请求

4.png

  1. //首先在script标签中引入 我们对应的 文件 
  2. <script>
  3. // 引入 mixinsdialog 主要负责新增 编辑 查看 的公共方法
  4. import mixinsdialog from '@/components/dialogmixins/mixinsdialog.js'
  5. // 引入 我们编辑的时候接口
  6. import { patchObj } from '@/api/rating/model/tbRatBmConfModel_form'
  7. // 引入 我们form  \ index.vue 表单文件
  8. import editForm from '../form'
  9. export default {
  10.   name: 'edit-dialog',
  11.   //混入我们刚才引入的公共的方法
  12.   mixins: [mixinsdialog],
  13.   //注册表单文件 用标签的形式 写入template中   
  14.   components: {
  15.     editForm
  16.   },
  17.   // 外部给我们传进来的属性 可以自定义  
  18.   props: {
  19.     titletext: {
  20.       type: String,
  21.       default() {
  22.         return '编辑模型'
  23.       }
  24.     }
  25.   },
  26.   data() {
  27.     return {
  28.       savebtn: false
  29.     }
  30.   },
  31.   methods: {
  32.     // 点击保存的时候动作
  33.     saveForm() {
  34.       //首先调取我们表单文件里的 验证方法  对我们输入的表单进行验证  
  35.       this.$refs.dialogForm.validForm(async(valid) => {
  36.         //如果验证成功 就去发送对应的新增请求接口   
  37.         if (valid) {
  38.           //开启搜索按钮laoding  
  39.           this.savebtn = true
  40.           const form = JSON.parse(JSON.stringify(this.$refs.dialogForm.form))
  41.           form.blCusType = [form.blCusType]
  42.           //发送编辑请求 这里由于某些接口的返回结果 不太一样 根据实际业务场景自行判断   
  43.           const data = await patchObj(form)
  44.           if (!data) {
  45.             // 关闭 按钮laoding    
  46.             this.savebtn = false
  47.             // 关闭 按钮弹框   
  48.             this.dialogVisible = false
  49.             // 通知列表更新
  50.             this.$emit('initlist')
  51.           }
  52.         }
  53.       })
  54.     }
  55.   }
  56. }
  57. </script>
  1. <!-- 编辑的弹框组件 -->
  2. <template>
  3.   <div class="editdialog-container">
  4.     <eu-dialog
  5.         :visible.sync="dialogVisible"
  6.         @close="closeDialog"
  7.         :fullscreen="isfullscreen"
  8.         :close-on-click-modal="false"
  9.         @closed="closed"
  10.         destroy-on-close
  11.         :width="width"
  12.         >
  13.         <div slot="title">
  14.           <span>{{titletext}}</span>
  15.           <div class="dialogtitle" @click="dialogmax"></div>
  16.         </div>
  17.         <slot></slot>
  18.         <edit-form ref="dialogForm">
  19.         </edit-form>
  20.         <span slot="footer" class="dialog-footer">
  21.             <span>
  22.               <eu-button size="mini" type="primary" @click="saveForm" :loading="savebtn" icon="el-icon-check">保 存</eu-button>
  23.               <eu-button size="mini" @click="clearForm" icon="el-icon-delete">清 空</eu-button>
  24.             </span>
  25.         </span>
  26.     </eu-dialog>
  27.   </div>
  28. </template>

查看弹框文件 view \ index.vue

  1. 1.当我们点击页面布局上的编辑的按钮时 打开查看弹框 需要传入我们当前行的信息
  2. 2.查看弹框里面展示我们的表单 需要引入 form \ index.vue 并且给他传入disabled 属性 让表单文件不可编辑

5.png

  1. //首先在script标签中引入 我们对应的 文件 
  2. <script>
  3. // 引入 mixinsdialog 主要负责新增 编辑 查看 的公共方法
  4. import mixinsdialog from '@/components/dialogmixins/mixinsdialog.js'
  5. // 引入 我们form  \ index.vue 表单文件
  6. import viewForm from '../form'
  7. export default {
  8.   //混入我们刚才引入的公共的方法
  9.   name: 'view-dialog',
  10.   mixins: [mixinsdialog],
  11.   //注册表单文件 用标签的形式 写入template中  
  12.   components: {
  13.     viewForm
  14.   },
  15.   // 外部给我们传进来的属性 可以自定义 
  16.   props: {
  17.     titletext: {
  18.       type: String,
  19.       default() {
  20.         return '查看模型'
  21.       }
  22.     }
  23.   }
  24. }
  25. </script>

表单文件 form \ index.vue

  1. 1.主要用于展示 新增弹框 编辑弹框 和查看弹框的 表单详情
  2. 2.当点击编辑和查看的时候 接收当前行信息 做字段验证 验证成功之后  并去 发送请求 获取表单 详情
  1. //在script 标签中 引入我对应需要的文件
  2. <script>
  3. //引入对应获取表单详情的接口    
  4. import { getObj } from '@/api/rating/model/tbRatBmConfModel_form'
  5. export default {
  6.   //外部给我们传进来的属性 这里只增加了disabled 不可编辑 可以根据实际业务场景 自定义   
  7.   props: {
  8.     disabled: {
  9.       type: Boolean,
  10.       default() {
  11.         return false
  12.       }
  13.     }
  14.   },
  15.   data() {
  16.     return {
  17.       //表单的验证规则 详细语法 参照 https://element.eleme.cn/#/zh-CN/component/layout 表单组件
  18.       rules: {
  19.         modelCode: [{ required: true, message: '请输入模型代码', trigger: 'blur' }],
  20.         modelName: [{ required: true, message: '请输入模型名称', trigger: 'blur' }],
  21.         blCusType: [{ required: true, message: '请选择模型类型', trigger: 'blur' }],
  22.         bmversion: [{ required: true, message: '请选择模型版本号', trigger: 'blur' }],
  23.         enableFlag: [{ required: true, message: '请开启生效标志', trigger: 'blur' }]
  24.       },
  25.       //定义表单需要的字段  
  26.       form: {
  27.         modelCode: '',
  28.         modelName: '',
  29.         blCusType: '',
  30.         enableFlag: '',
  31.         bmversion: '',
  32.         uuid: '',
  33.         bankCode: '27101'
  34.       },
  35.       options: JSON.parse(localStorage.getItem('RATING_MODEL_TYPE'))
  36.     }
  37.   },
  38.   methods: {
  39.     // 当外层弹框点击保存的时候 触发全表单校验并通过回调函数把成功的校验传递出去
  40.     validForm(callback) {
  41.       this.$refs.form.validate((valid) => {
  42.         if (valid) {
  43.           callback(valid)
  44.         } else {
  45.           return false
  46.         }
  47.       })
  48.     },
  49.     // 当外层弹框点击清空时候重置表单
  50.     resetForm() {
  51.       this.$refs.form.resetFields()
  52.     },
  53.     // 查询表单
  54.     async detail(row) {
  55.       const data = await getObj(row.uuid)
  56.       this.form = data
  57.     },
  58. }
  59. </script>

代码生成器

地址1：http://10.100.3.38:9083/fecode/forward

地址2：http://loan.git.com.cn/scms

6.png

内网地址: http://10.5.102.68:8081/fecode/forward