美文网首页
async await

async await

作者: jesse28 | 来源:发表于2022-10-07 16:08 被阅读0次

    参考链接:https://www.jianshu.com/p/3f7db4a282f9

    
    <template>
      <div class="mainCountry" style="background:white">
        <div style="margin-bottom:5px;display: flex;justify-content: space-between;">
          <el-radio-group v-model="radio" @change="handleRadio">
            <el-radio :label="1">展开</el-radio>
            <el-radio :label="2">收缩</el-radio>
          </el-radio-group>
          <el-button @click="handlegoUp" type="primary" plain>返回</el-button>
        </div>
        <el-container class="pageBox">
          <el-aside style="margin-right:10px;height:100vh;" :class="[radio==1?'extendAside':'shrinkAside']">
            <el-tree  :props="defaultProps" node-key="id" :data="areaList" @node-click="handleNodeClick1" :highlight-current="highlightBd">
            </el-tree>
          </el-aside>
          <el-container>
            <el-main>
              <div class="right">
                <iframe :class="[radio==1?'shrink':'extend']" v-if="show" :src="iframeUrl" frameborder="0"></iframe>
                <div class="please" v-else>请选择左侧执法支队!!!</div>
              </div>
            </el-main>
          </el-container>
        </el-container>
      </div>
    
    </template>
    
    <script>
    import { getOrgListApi } from "@/api/system";
    import { formatDate } from "@/until/wordBook";
    
    export default {
      data() {
        return {
          radio: 1,
          areaList: [],
          highlightBd: true,
          show: false,
          tempData: null,
          iframeUrl: null,
          newToken: null, //调用单点登录获取token
          defaultProps: {
            children: "children",
            label: "orgName",
          },
        };
      },
      created() {
        // 获取树
        getOrgListApi().then((res) => {
          this.areaList = res.data;
        });
      },
      methods: {
        //返回上一层
        handlegoUp(){
          this.$router.go(-1)
        },
        async init(data) {
          await this.handleNewSingle();
          this.getAreaList(data);
        },
        // 单点登录获取token
        handleNewSingle() {
          return new Promise((resolve, reject) => {
            fetch(
              `${window.webConfig.newSingle}/law-case-api-service/payUrl/getAccountToken`,
              {
                method: "post",
                headers: {
                  "Content-Type": "application/json;charset=UTF-8",
                },
                body: JSON.stringify({
                  account: this.tempData.account,
                  phone: null,
                  idCard: null,
                  externalSystemId: null,
                  columnMap: null,
                }),
              }
            )
              .then((res) => res.json())
              .then((res) => {
                if (res.code == 200) {
                  this.newToken = JSON.parse(res.data).data;
                  resolve();
                }
              });
          }); //promise结束
        },
        // 获取重庆下面区县
        getAreaList(data) {
          getOrgListApi().then((res) => {
            if (res.data) {
              this.areaList = res.data.map((item) => {
                return {
                  account:item.account,
                  id: item.orgId,
                  orgId: item.orgId,
                  orgName: item.orgName,
                  orgOrder: item.orgOrder,
                  url: `${item.url}/home/productCase/productCaseListPage?token=${this.newToken}`,
                };
              });
              this.areaList.forEach((item) => {
                if (item.orgId == this.tempData.orgId) {
                  this.iframeUrl = item.url;
                }
              });
            }
          });
        },
        //点击tree触发的事件
        handleNodeClick1(data) {
          this.show = true;
          // 获取token
          this.tempData = data;
          this.init();
        },
        //展开收缩方法
        handleRadio(radio) {
          this.radio = radio;
        },
      },
    };
    </script>
    
    <style lang="less" scoped>
    .pageBox {
      // background: #e3e3e3 !important;
      .extendAside {
        width: 270px !important;
      }
      .shrinkAside {
        width: 0px !important;
      }
    
      /deep/ .el-tree-node:focus > .el-tree-node__content {
        background-color: rgba(135, 206, 235, 0.3);
        color: #409eff; //节点的字体颜色
        font-weight: bold;
      }
      /deep/ .page-body{
        background: red !important;
      }
    
      .right {
        overflow: hidden;
        .extend {
          width: calc(~"100vw - 0px");
          height: 100vh;
          position: relative;
          top: -140px;
          left: -200px;
        }
        .shrink {
          width: calc(~"100vw - 289px");
          height: 100vh;
          position: relative;
          top: -140px;
          left: -200px;
        }
        .please {
          margin-top: 80px;
          display: flex;
          justify-content: center;
        }
      }
    }
    </style>
    
        async init() {
        const aaa =  await this.getOrgList();
        console.log('aaa',aaa)
    
        },
        // 调用查看接口
        getInfo() {},
        // 获取部门
        getOrgList() {
          return new Promise((resolve, reject) => {
            apiOrgSearch().then((res) => {
              console.log("人机构列表", res);
              this.orgList = res.data;
              this.orgListTree = getTree(
                res.data,
                "orgId",
                "parentCode",
                "isParent",
                true
              );
              resolve(res.data)  //resolve中res.data就是上面aaa得到的
            })
          });
        },
    

    执行完一个要resolve(),不然不知道你是否成功就不会执行下一个代码

    相关文章

      网友评论

          本文标题:async await

          本文链接:https://www.haomeiwen.com/subject/ethwartx.html