接口平台(3)

接口用例页

列表页

树形控件

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
// show-checkbox 展示复选框
// default-checked-keys  默认选中
// default-expanded-keys 默认展开
// @check-change 监听选中的id ref="tree"
// this.$refs.tree.getCheckedKeys().toString() 获取选中的checkbox 将多个id 组成 "1,2,3"这样
// 按钮区别展示 v-if 判断一级type则展示

<el-tree id="left_div" style="width: 300px; overflow-y: auto;"
  :data="apis" show-checkbox node-key="id" :default-checked-keys="dck" :default-expanded-keys="dek"
  @check-change="handleCheckChange" ref="tree" >
      <span class="custom-tree-node" slot-scope="{data}">
        <span style="font-size:15px">{{data.label}} </span>
        <el-button type="text" size="mini" @click="() => set(data)"
        style="color: #95712d">设置</el-button>
        <el-button type="text" size="mini" @click="() => add_configure(data)"
        style="color: #166f1e" v-if="vif(data)">添加</el-button>
        <el-button type="text" size="mini" @click="() => remove(data)"
        style="color: darkred">删除</el-button>
      </span>
  </el-tree>

接口和配置页

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// v-if 判断点击设置按钮时获取的type是什么类型
<script>
methods:{
  // 展示接口详情界面和配置页
    set(data){
      if (data.type === "api"){
        this.right_api = true;
        this.right_configure = false;
        this.setting_api = data;
      } else {
        this.right_api = false;
        this.right_configure = true;
        this.setting_configure = data;
      }
    },
}
</script>

新增接口(一级接口)

1
2
3
4
5
6
7
8
9
10
11

def create_api(request):
    project_id = request.GET['project_id']
    print(project_id)
    new_api = DB_apis.objects.create(project_id=project_id)
    new_api.children = str([{"do_time": "before",
                             "type": "configure",
                             "label": "仅运行",
                             "id": f"{new_api.id}-1"}])  # 子配置层级的id
    new_api.save()
    return get_apis(request)

新增接口(二级配置)

1
2
3
4
5
6
7
8
9
10
11
def add_configure(request):
    children = eval(api.children)
    cid = int(children[-1]['id'].split('-')[1])+1 if children else 1  # 获取列表内最后一个id  有值根据最后一个增加1 为空则从1开始
    # 增加配置
    children.append({"do_time": "after",
                     "type": "configure",
                     "label": "新配置",
                     "id": f"{int(id)}-{cid}"})
    api.children = str(children)
    api.save()
    return get_apis(request)

删除接口

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
def remove_configure(request):
    id = request.GET['id']
    if '-' in id:
        api_id = id.split('-')[0]
        api = DB_apis.objects.filter(id=api_id)[0]
        children = eval(api.children)  # 找到children 还原列表
        for child in children:  # 遍历列表内的字典keyid
            if child['id'] == id:
                children.remove(child)
                break
        api.children = str(children)  # 再次还原 保存
        api.save()
    else:
        DB_apis.objects.filter(id=id).delete()
    return get_apis(request)