CQ_JD
/
nazw


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482
							<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name=”SiteName” content=”重庆市南岸区人民政府”>
    <meta name="SiteDomain" content="http://www.cqna.gov.cn" />
    <meta name="SiteIDCode" content="5001080014">
    <meta name="ColumnName" content="政务全景通">
    <meta name="ColumnDescription" content="政务全景通" />
    <meta name="ColumnKeywords" content="政务全景通" />
    <meta name="ColumnType" content="政务全景通" />
    <title>政务全景通-重庆市南岸区人民政府网</title>
    <link rel="stylesheet" href="https://www.cqna.gov.cn/syygapi/naxsb/css/floorcon.css">
    <!-- jquery-->
    <script src="https://www.cqna.gov.cn/syygapi/naxsb/js/jquery-3.5.1.min.js"></script>
    <script src="https://www.cqna.gov.cn/syygapi/naxsb/js/urljson.js"></script>
</head>
<style>
    .container {
        position: relative;
        background-image: url(https://www.cqna.gov.cn/syygapi/naxsb/images/indexbgfloor.png);
        background-size: 100% 100%;
        width: 100%;
        min-height: 900px;
        height: 100%;
    }

    .el-pagination {
        text-align: center;
    }

    .el-pagination.is-background .btn-next,
    .el-pagination.is-background .btn-prev,
    .el-pagination.is-background .el-pager li {
        background-color: #A6D2EC !important;
        color: #fff !important;
    }

    .el-pagination.is-background .el-pager li:not(.disabled).active {
        background-color: #2895FF !important;
    }

    .el-tab-pane {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .moxing .namebtn {
        padding: 0 5px;
        border-radius: 4px;
        font-size: 14px;
        color: #FFFFFF;
        background: #A7C4E0;
        text-shadow: 3px 1px 2px rgb(40 149 255 / 80%);
        position: absolute;
        cursor: pointer;
    }

    .moxing .namebtnl {
        padding: 0;
        background-color: rgb(239 41 19 / 40%);
        border-radius: 6px;
        line-height: 17px;
        font-size: 14px;
        color: #FFFFFF;
        position: absolute;
        text-shadow: 3px 1px 2px rgb(217 112 100 / 100%);
    }

    #lines {
        position: absolute;
        height: 150px;
        transition: top 0.3s;
        width: 0;
        border: 1px dashed #1A95EB;
        z-index: 111;
    }

    #lineh {
        position: absolute;
        height: 0;
        transition: top 0.3s;
        width: 100px;
        border: 1px dashed #1A95EB;
        z-index: 111;
    }

    #redio {
        width: 13px;
        height: 13px;
        background: #2896FF;
        border-radius: 50%;
        position: absolute;
        z-index: 111;
    }

    .vrdiv {
        width: 28px;
        height: 28px;
        position: absolute;
        cursor: pointer;
        background-image: url(https://www.cqna.gov.cn/syygapi/naxsb/images/logo-vr.png);
        background-size: 100% 100%;

    }

    .vrdiv .vrDname,
    .vrdiv .vrDname2 {
        position: absolute;
        display: inline-flex;
        flex-direction: column;
        color: #2895FF;
        font-size: 14px;
        justify-content: center;
        align-items: center;
        right: -26px;
        width: 80px;
    }

    .vrdiv .vrDname .vrNameLine,
    .vrdiv .vrDname2 .vrNameLine {
        display: inline-block;
        border-left: 2px dashed #2895FF;
        height: 36px;
    }

    .vrdiv .vrDname {
        top: -50px;
    }

    .vrdiv .vrDname2 {
        bottom: -50px;
    }

    .btable {
        height: calc(100% - 67px);
        /* margin-top: 20px; */
        background-color: #fff;
        /* padding: 15px 10px; */
        box-sizing: border-box;
    }

    .jysm {
        color: #2895FF;
        display: flex;
        align-items: center;
        font-weight: bold;
    }

    .btable table {
        margin-top: 10px;
        border: 1px solid #64A8F6;
    }

    .btable tr td {
        border: 1px solid #64A8F6;
        padding: 5px;
    }

    .btable tr td.tit {
        font-size: 16px;
        color: #64A8F6;
    }

    .global-dialog .el-dialog__body {
        max-height: calc(100vh - 300px);
        overflow: auto;
        padding: 0 20px !important;
        padding-bottom: 20px !important;
    }


    .sxqd::-webkit-scrollbar {
        width: 0;
    }

    .global-dialog .el-tabs__header {
        margin: 0 !important;
    }

    .global-dialog .el-dialog__title {
        color: #64A8F6 !important
    }

    @media screen and (max-width:1700px) {

        html,
        body {
            font-size: 14px;
        }

        .sxqd li {
            cursor: pointer;
            margin-top: 5px;
        }

        .zxfw {
            top: 66%;
        }

        .zxfw .button {
            width: 215px;
            height: 85px;
            line-height: 30px;
            margin-right: 13px;
        }

    }

    @media screen and (max-width:1800px) {
        .moxing {
            left: 100px;
        }

        .detailDiv {
            max-height: 500px;
        }

    }

    .hide {
        display: none;
    }

    .search {
        width: 249px;
        height: 40px !important;
        display: flex;
        position: absolute;
        right: 20px;
        top: 90px;
        z-index: 999;
    }

    .search input {
        width: calc(100% - 44px);
        overflow: unset;
        background: #A6D2EC;
        border: 0;
        padding: 0;
        outline: none;
        height: 40px;
        padding-left: 10px;
        color: #2895FF;
    }

    .search input::placeholder {
        color: #E7F7FF;
    }

    .search .btn {
        width: 44px;
        height: 40px;
        background: #2895FF;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .zwsj {
        width: 100%;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* 楼层指引 start */
    .floorGuide {
        position: absolute;
        left: 300px;
        top: 60px;
        width: 871px;
        height: 730px;
        z-index: 11;
    }

    .floorGuide .floorGuideBg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .floorGuide .floorGuideTit {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 70px;
        font-weight: bold;
        font-size: 26px;
        color: #004A93;
        display: flex;
        align-items: center;
    }

    .floorGuideTit .floorGuideIcon {
        width: 15px;
        height: 24px;
        margin: 0 13px 0 26px;
    }

    .floorGuideTit span {
        line-height: 30px;
        margin-bottom: 3px;
    }

    .floorGuide .floorGuideTable {
        position: absolute;
        top: 86px;
        left: 44px;
        width: calc(100% - 88px);
    }

    .floorGuideTable .floorGuide-row .el-col {
        margin-bottom: 20px;
        display: flex;
        justify-content: start;
    }

    .floorGuideTable .floorNum-col,
    .floorGuideTable .floorName-col {
        line-height: 30px;
        display: inline-block;
        border-bottom: 1px solid #3D86CE;
    }

    .floorGuideTable .floorName-col {
        font-weight: 400;
        font-size: 24px;
        color: #004A93;
        width: 310px;
    }

    .floorGuideTable .floorNum-col {
        font-weight: 400;
        font-size: 22px;
        color: #FFFFFF;
        width: 60px;
        height: 30px;
        position: relative;
        top: 0;
        left: 0;
    }

    .floorNum-col img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .floorNum-col span {
        position: absolute;
        top: 0;
        left: 0;
        display: inline-flex;
        height: 100%;
        align-items: center;
        margin: 0 0 0 7px;
    }

    .activeGuide {
        background-color: #25A8AA !important;
    }

    .el-carousel--horizontal {
        width: 100%;
    }


    /* 楼层指引 end */
    .moxing .title {
        font-size: 26px;
        color: #004A93;
        text-align: center;
    }

    .gaimg {
        display: inline-flex;
        align-items: center;
        position: relative;
    }

    .gaimg .left {
        position: absolute;
        left: 20px;
        top: 50%;
        cursor: pointer;
    }

    .gaimg .right {
        position: absolute;
        right: 20px;
        top: 50%;
        cursor: pointer;
    }

    .ckh {
        width: 80px;
        height: 50px;
        position: absolute;
        top: 10px;
        cursor: pointer;
    }

    .imglogo {
        position: absolute;
        left: 92px;
        top: 52px;
        display: flex;
        align-items: center;
        color: #333;
    }

    .imglogo img {
        width: 36px;
        height: 36px;
        margin-right: 20px;
    }

    .detailDiv .top {
        align-items: center;
    }
</style>

<body>
    <div style="width:100%;" class="header"></div>
    <div class="container hide" id="app" style="">
        <div class="floorTabs" v-show="currentIndex==1">
            <div class="list" :class="{ active: currentFloor == tab.id }" v-for="(tab,index) in floorList" :key="index"
                @click="floorChange(tab.id)">
                {{tab.name}}
            </div>
            <div class="list" @click="backsw">返回室外</div>
            <div class="list" :class="{ activeGuide: floorGuideShow }" @click="floorGuideShow=true">楼层指引</div>
        </div>
        <div class="floorTabs" v-show="currentIndex==3">
            <div class="list" @click="backdt">返回大厅</div>
        </div>
        <div class="floorGuide" v-show="floorGuideShow">
            <img class="floorGuideBg" src="./images/floor-floorGuide-bg.png" alt="" srcset="">
            <div class="floorGuideTit">
                <img class="floorGuideIcon" src="./images/floor-floorGuide-icon.png" alt="" srcset="">
                <span>2号楼楼层指引</span>
            </div>
            <div class="floorGuideTable">
                <el-row :gutter="20" class="floorGuide-row">
                    <el-col :span="12" v-for="item in floorGuideList" :key="item.floorNum">
                        <span class="floorNum-col">
                            <img src="./images/floor-floorGuide-numBg.png" alt="" srcset="">
                            <span>{{item.floorNum}}</span>
                        </span>
                        <span class="floorName-col" v-if="item.name.length<=12">{{item.name}}</span>
                        <span class="floorName-col" :title="item.name" v-else>{{item.name.substring(0,11)}}...</span>
                    </el-col>
                </el-row>
            </div>
        </div>
        <el-dialog title="窗口电话" class="global-dialog" :visible.sync="dialogVisible" width="60%"
            :before-close="handleClose" :close-on-click-modal="false">
            <div class="btable">
                <table border="0" cellspacing="0" style="width: 100%;">
                    <tbody>
                        <tr>
                            <td class="tit">楼层</td>
                            <td class="tit">窗口名称</td>
                            <td class="tit">窗口号</td>
                            <td class="tit">对外咨询窗口电话</td>
                        </tr>
                        <tr>
                            <td class="tit" rowspan="2">一楼</td>
                            <td>社保卡窗口</td>
                            <td>1、2、3、4</td>
                            <td>023-62525236、023-62602939</td>
                        </tr>
                        <tr>
                            <td>咨询窗口</td>
                            <td>一楼咨询台</td>
                            <td>023-62606771</td>
                        </tr>
                        <tr>
                            <td class="tit" rowspan="8">二楼</td>
                            <td>财政综合窗口</td>
                            <td>206</td>
                            <td>023-62988007</td>
                        </tr>
                        <tr>
                            <td>无差别综合窗口</td>
                            <td>207、209</td>
                            <td>023-62980273</td>
                        </tr>
                        <tr>
                            <td>一件事一次办</td>
                            <td>208</td>
                            <td>023-62980273</td>
                        </tr>
                        <tr>
                            <td>文旅综合窗口</td>
                            <td>210</td>
                            <td>023-62606250</td>
                        </tr>
                        <tr>
                            <td>档案综合窗口</td>
                            <td>211</td>
                            <td>023-62980244</td>
                        </tr>
                        <tr>
                            <td>卫健综合窗口</td>
                            <td>212-215</td>
                            <td>023-62980379</td>
                        </tr>
                        <tr>
                            <td>交通综合窗口</td>
                            <td>217-221</td>
                            <td>023-62982072</td>
                        </tr>
                        <tr>
                            <td>公安综合窗口</td>
                            <td>224-235</td>
                            <td>023-62985279</td>
                        </tr>
                        <tr>
                            <td class="tit" rowspan="17">三楼</td>
                            <td>经开区企业开办综合窗口</td>
                            <td>301-307</td>
                            <td>023-62980204，023-62980207</td>
                        </tr>
                        <tr>
                            <td>经开区立项用地规划综合窗口</td>
                            <td>308</td>
                            <td>023-62980243</td>
                        </tr>
                        <tr>
                            <td>经开区南岸区工程建设许可（小型建设项目）</td>
                            <td>310</td>
                            <td>023-62606752</td>
                        </tr>
                        <tr>
                            <td>经开区施工许可 竣工验收 综合窗口</td>
                            <td>311</td>
                            <td>023-62980249</td>
                        </tr>
                        <tr>
                            <td>南岸区施工许可 竣工验收 综合窗口 帮代办窗口</td>
                            <td>312</td>
                            <td>023-62606780</td>
                        </tr>
                        <tr>
                            <td>经开市政综合窗口</td>
                            <td>313</td>
                            <td>023-62789342</td>
                        </tr>
                        <tr>
                            <td>交通建设综合窗口</td>
                            <td>314</td>
                            <td>023-62392861</td>
                        </tr>
                        <tr>
                            <td>生态环境综合窗口</td>
                            <td>315</td>
                            <td>023-62606735</td>
                        </tr>
                        <tr>
                            <td>涉农事务综合窗口</td>
                            <td>316</td>
                            <td>023-62606735</td>
                        </tr>
                        <tr>
                            <td>发改委综合窗口</td>
                            <td>317</td>
                            <td>023-62606782</td>
                        </tr>
                        <tr>
                            <td>消防综合窗口</td>
                            <td>318</td>
                            <td>023-62606739</td>
                        </tr>
                        <tr>
                            <td>城市管理综合窗口</td>
                            <td>319-320</td>
                            <td>023-62606760</td>
                        </tr>
                        <tr>
                            <td>经开区办不成事反应窗口</td>
                            <td>322</td>
                            <td>023-62606905</td>
                        </tr>
                        <tr>
                            <td>经开区项目帮代办综合窗口</td>
                            <td>324</td>
                            <td>023-62519346</td>
                        </tr>
                        <tr>
                            <td>经开区税务综合窗口</td>
                            <td>325</td>
                            <td>023-62980241</td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </el-dialog>
        <div id="lines" style="display: none;"></div>
        <div id="lineh" style="display: none;"></div>
        <div id="redio" style="display: none;"></div>
        <div class="detailDiv" style="display: none;" style="position: relative;">
            <div v-show="popupType == '1'">
                <div class="top">
                    <div style="font-weight: bold;font-size: 1.625rem;">{{btnName}}您可以办理：</div>
                    <div class="right" style="font-size: 1rem;">
                        <span>工作时间：</span>
                        <span>法定工作日 9:00-12:00 14:00-17:30</span>
                    </div>
                </div>
                <el-tabs v-model="activeName" @tab-click="handleClick">
                    <el-tab-pane label="申请接受区" name="second">
                        <ul class="sxqd" style="overflow-y: scroll;">
                            <li><span
                                    @click="goToLink('https://www.cqna.gov.cn/zwgk_254/ysqgk/202411/t20241101_13763538.html')">依申请公开流程图</span>
                            </li>
                            <li><span
                                    @click="goToLink('https://www.cqna.gov.cn/zwgk_254/zfxxgkzn/qzfgkzn/202402/t20240202_12897323.html')">政府信息公开申请表</span>
                            </li>
                            <li><span
                                    @click="goToLink('https://www.cqna.gov.cn/zwgk_254/zfxxgkzn/qzfgkzn/202402/t20240202_12897323.html')">政府信息公开指南</span>
                            </li>
                        </ul>
                    </el-tab-pane>
                    <el-tab-pane label="政策咨询区" name="third">
                        <ul class="sxqd" style="overflow-y: scroll;">
                            <li><span @click="goToLink('https://www.cqna.gov.cn/ghwd/znwd/index.html')">在线政策咨询</span>
                            </li>
                            <li><span @click="goToLink('https://www.cqna.gov.cn/zczs/')">政策通</span></li>
                        </ul>
                    </el-tab-pane>
                    <el-tab-pane label="资料阅览区" name="fourth">
                        <ul class="sxqd" style="overflow-y: scroll;">
                            <li v-for="(item,index) in zlylqList">
                                <span @click="goToLink(item.addr)" v-if="item.addr"
                                    :title="item.mattersName">{{item.mattersName}}</span>
                            </li>
                        </ul>
                    </el-tab-pane>
                    <el-tab-pane label="自助查询区" name="fifth">
                    </el-tab-pane>
                </el-tabs>
            </div>
            <div v-show="popupType == '2'">
                <div class="search"><input type="text" placeholder="请输入关键字" v-model="inputValue">
                    <div class="btn" @click="searchData(1)"><img
                            src="https://www.cqna.gov.cn/syygapi/naxsb/images/flsearch.png" alt=""></div>
                </div>
                <div class="top">
                    <div style="font-weight: bold;font-size: 1.625rem;width: 70%;">{{btnName}}您可以办理：
                    </div>
                    <div class="right" style="font-size: 1rem;" v-show="btnName!=='24h自助服务区'">
                        <span>工作时间：</span>
                        <span>法定工作日 9:00-12:00 14:00-17:30</span>
                    </div>
                </div>
                <el-tabs v-model="activeNametwo" @tab-click="handleClicktwo">
                    <el-tab-pane label="事项清单" name="sxqd">
                        <ul class="sxqd">
                            <div class="zwsj" v-if="!this.sxqdList||!this.sxqdList.length">暂无数据</div>
                            <li v-for="(item,index) in sxqdList">
                                <span @click="goToLink(item.addr)" v-if="item.addr">{{item.mattersName}}</span>
                                <span @click="goToLink('https://zwykb.cq.gov.cn/qxzz/naq/bszn/?rowGuid='+item.url)"
                                    v-else-if="item.url">{{item.mattersName}}</span>
                                <span v-else>{{item.mattersName}}</span>
                            </li>
                        </ul>
                        <el-pagination background @current-change="handleCurrentChange" :current-page.sync="currentPage"
                            :page-size="7" layout="prev, pager, next" :total="total" class="popuppage">
                        </el-pagination>
                    </el-tab-pane>
                    <el-tab-pane label="入驻部门" name="rzbm">
                        <div class="zwsj" v-if="!this.rzbmList||!this.rzbmList.length">暂无数据</div>
                        <ul class="sxqd" style="overflow-y: scroll;">
                            <li v-for="(item,index) in rzbmList">
                                <span>{{item.deptName}}</span>
                            </li>
                        </ul>
                    </el-tab-pane>
                </el-tabs>
            </div>
        </div>
        <div class="moxing" v-show="currentFloor == 1&&currentIndex==1">
            <div class="imgDiv">
                <img src="https://www.cqna.gov.cn/syygapi/naxsb/images/floordetail1.png" alt="">
                <img src="https://www.cqna.gov.cn/syygapi/naxsb/images/floorArowRigt.png" alt=""
                    style="position:absolute; left:52px;bottom: 73px;width: 40px;height: 34px;">
                <img src="https://www.cqna.gov.cn/syygapi/naxsb/images/floorArowTop.png" alt=""
                    style="position:absolute; right: 220px;top: 22px;width: 34px;height: 39px;">
                <div class="imglogo">
                    <img src="images/logo-wsj.png" alt="">
                    <span>卫生间</span>
                </div>
                <div class="imglogo" style="top: 10px;">
                    <img src="images/logo-dt.png" alt="">
                    <span>低层电梯</span>
                </div>
                <div class="vrdiv" style="left: 176px;bottom: 110px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=1')">
                    <span class="vrDname">大厅1<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="left: 284px;bottom: 120px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=3')">
                    <span class="vrDname">大厅2<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="left: 277px;bottom: 69px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=2')">
                    <span class="vrDname2"><span class="vrNameLine"></span>自助服务区</span>
                </div>
                <div class="vrdiv" style="left: 384px;bottom: 146px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=4')">
                    <span class="vrDname">大厅电梯口<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 240px;bottom: 103px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=5')">
                    <span class="vrDname">过道<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 195px;top: 73px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=6')">
                    <span class="vrDname">婚姻登记处<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 284px;top: 99px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=7')">
                    <span class="vrDname">颁证厅<span class="vrNameLine"></span></span>
                </div>
                <div class="namebtnl threed" style="left: 150px;bottom: 88px;background-color: #D97064;
        text-shadow: 3px 1px 2px rgb(217 112 100 / 80%);">咨询台
                </div>
                <div class="namebtn threed" style="left: 217px;bottom: 119px;" @click="gozwgk">政务公开专区
                </div>
                <div class="namebtn threed" style="left: 217px;bottom: 72px;" @click="goConbtn(2,3)">24h自助服务区
                </div>
                <div class="namebtn threed" style="left: 331px;bottom: 97px;" @click="goConbtn(3,2)">社保卡办理区
                </div>
                <div class="namebtnl threed" style="right: 220px;bottom: 82px;">免费婚检室</div>
                <div class="namebtnl threed" style="left: 470px;bottom: 203px;">颁证厅</div>
                <div class="namebtnl threed" style="right: 88px;bottom: 194px;">婚姻家庭辅导室</div>
                <div class="namebtn threed" style="right: 110px;top: 54px;" @click="goConbtn(4,1)">婚姻登记处</div>
            </div>
            <div style="font-size: 26px;color: #004A93;">2号楼一楼婚姻登记处社保卡办理</div>
            <div style="font-size: 20px;color: #547596;">（您可以点击图中的按钮查看详情）</div>
        </div>
        <div class="moxing" v-show="currentFloor == 2&&currentIndex==1">
            <div class="imgDiv">
                <img src="https://www.cqna.gov.cn/syygapi/naxsb/images/floordetail2.png" alt="">
                <div class="imglogo">
                    <img src="images/logo-wsj.png" alt="">
                    <span>卫生间</span>
                </div>
                <div class="imglogo" style="top: 10px;">
                    <img src="images/logo-dt.png" alt="">
                    <span>低层电梯</span>
                </div>
                <div class="vrdiv" style="left: 360px;bottom: 120px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=9')">
                    <span class="vrDname">办事处2<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="left: 313px;bottom: 94px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=8')">
                    <span class="vrDname2"><span class="vrNameLine"></span>办事处1</span>
                </div>
                <div class="vrdiv" style="right: 216px;bottom: 156px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=10')">
                    <span class="vrDname2"><span class="vrNameLine"></span>办事处3</span>
                </div>
                <div class="vrdiv" style="right: 260px;top: 120px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=11')">
                    <span class="vrDname">办事处4<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 226px;top: 33px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=12')">
                    <span class="vrDname">办事处5<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 175px;top: 105px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=13')">
                    <span class="vrDname">办事处6<span class="vrNameLine"></span></span>
                </div>

                <div class="namebtn threed" style="left: 286px;bottom: 91px;" @click="goConbtn(10,9)">自助服务区</div>
                <div class="namebtn threed" style="left: 326px;bottom: 215px;" @click="goConbtn(5,4)">公安综合办理区
                </div>
                <div class="namebtnl threed" style="right: 175px;bottom: 156px;">自助服务区</div>
                <div class="namebtn threed" style="right: 110px;top: 87px;" @click="goConbtn(6,5)">无差别综合办理区
                </div>
                <div class="namebtnl threed" style="right: 187px;top: 15px;">母婴室</div>
            </div>
            <div style="font-size: 26px;color: #004A93;">2号楼二楼无差别、区公安办理区</div>
            <div style="font-size: 20px;color: #547596;">（您可以点击图中的按钮查看详情）</div>
        </div>
        <div class="moxing" v-show="currentFloor == 3&&currentIndex==1">
            <div class="imgDiv">
                <img src="images/floordetail3.png" alt="">
                <div class="imglogo">
                    <img src="images/logo-wsj.png" alt="">
                    <span>卫生间</span>
                </div>
                <div class="imglogo" style="top: 10px;">
                    <img src="images/logo-dt.png" alt="">
                    <span>低层电梯</span>
                </div>
                <div class="vrdiv" style="right:240px;top: 33px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=14')">
                    <span class="vrDname">电梯口<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right:201px;top: 84px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=15')">
                    <span class="vrDname">办事处1<span class="vrNameLine"></span></span>
                </div>
                <div class="vrdiv" style="right: 175px;top: 185px;"
                    @click="window.open('https://www.cqna.gov.cn/vr/dating3/tour.html?startscene=16')">
                    <span class="vrDname">办事处2<span class="vrNameLine"></span></span>
                </div>
                <div class="namebtnl threed"
                    style="left: 7px;bottom: 50px;display: flex;flex-direction: column;align-items: center;">
                    <span>314工程建设项目</span><span>审批会议室</span>
                </div>
                <div class="namebtn threed" style="left: 341px;top: 114px;" @click="goConbtn(7,6)">经开区企业开办办理区
                </div>
                <div class="namebtnl threed" style="right: 189px;top: 59px;">自助服务区</div>
                <div class="namebtn threed" style="right: 67px;top: 123px;" @click="goConbtn(9,8)">工程建设领域办理区
                </div>
                <div class="namebtn threed" style="right: 85px;top: 0;" @click="goConbtn(8,7)">
                    不动产登记办理区</div>
            </div>
            <div style="font-size: 26px;color: #004A93;">2号楼三楼婚姻登记处社保卡办理</div>
            <div style="font-size: 20px;color: #547596;">（您可以点击图中的按钮查看详情）</div>
        </div>
        <div class="moxing" v-show="currentIndex==3">
            <!-- 24h自助服务区 -->
            <div v-show="currentBtn==2">
                <div class="ckh" style="left: 170px;" @click="getPopuData1(999,'不动产自助查询机')"></div>
                <div class="ckh" style="left: 270px;" @click="getPopuData1(991,'住房公积金自助一体机')"></div>
                <div class="ckh" style="right: 311px;" @click="getPopuData1(993,'社保自助服务一体机')"></div>
                <div class="ckh" style="right: 260px;width: 50px;" @click="getPopuData1(992,'自助申领发票机')"></div>
                <div class="ckh" style="right: 170px;" @click="getPopuData1(994,'社保卡自助服务一体机')"></div>
                <div class="ckh" style="right: 65px;width: 100px;" @click="getPopuData1(998,'港澳智能签注机')"></div>
                <img src="images/floorone2.png" alt="" style="width: 750px;">
                <div class="title">2号楼24h自助服务区办理(1/1)</div>
            </div>
            <!-- 社保卡办理区 -->
            <div v-show="currentBtn==3">
                <img src="images/floorone3.png" alt="" style="width: 750px;">
                <div class="title">2号楼社保卡办理区办理(1/1)</div>
            </div>
            <!-- 婚姻登记处 -->
            <div v-show="currentBtn==4">
                <div v-if="hydjc==1" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="hydjc=2"></i>
                    <img src="images/floorone4.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="hydjc=2"></i>
                </div>
                <div v-if="hydjc==2" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="hydjc=1"></i>
                    <img src="images/floorone5.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="hydjc=1"></i>
                </div>
                <div class="title" v-if="hydjc==1">2号楼婚姻登记处办理(1/2)</div>
                <div class="title" v-if="hydjc==2">2号楼婚姻登记处办理(2/2)</div>
            </div>
            <!-- 自助服务区 -->
            <div v-show="currentBtn==10">
                <div class="ckh" style="left: 140px;width: 100px;" @click="getPopuData1(996,'驾驶员自助体检机')"></div>
                <div class="ckh" style="right: 327px;width: 100px;" @click="getPopuData1(995,'出入境自助照相机')"></div>
                <div class="ckh" style="right: 133px;width: 100px;" @click="getPopuData1(997,'身份证自助机')"></div>
                <img src="images/floortwo6.png" alt="" style="width: 750px;">
                <div class="title">2号自助服务区办理(1/1)</div>
            </div>
            <!-- 公安综合办理区 -->
            <div v-show="currentBtn==5">
                <div v-if="gazhbl==1" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="gazhbl=3"></i>
                    <div class="ckh" style="left: 152px;" @click="getPopuData(224)"></div>
                    <div class="ckh" style="left: 334px;" @click="getPopuData(225)"></div>
                    <div class="ckh" style="right: 165px;" @click="getPopuData(226)"></div>
                    <img src="images/floortwo1.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="gazhbl=2"></i>
                </div>
                <div v-if="gazhbl==2" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="gazhbl=1"></i>
                    <div class="ckh" style="left: 102px;" @click="getPopuData(227)"></div>
                    <div class="ckh" style="left: 260px;" @click="getPopuData(228)"></div>
                    <div class="ckh" style="right: 265px;" @click="getPopuData(229)"></div>
                    <div class="ckh" style="right: 115px;" @click="getPopuData(230)"></div>
                    <img src="images/floortwo2.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="gazhbl=3"></i>
                </div>
                <div v-if="gazhbl==3" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="gazhbl=2"></i>
                    <div class="ckh" style="left: 152px;" @click="getPopuData(231)"></div>
                    <div class="ckh" style="left: 334px;" @click="getPopuData(232)"></div>
                    <div class="ckh" style="right: 165px;" @click="getPopuData(233)"></div>
                    <img src="images/floortwo3.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="gazhbl=1"></i>
                </div>
                <div class="title" v-if="gazhbl==1">2号楼公安综合办理区(1/3)</div>
                <div class="title" v-if="gazhbl==2">2号楼公安综合办理区(2/3)</div>
                <div class="title" v-if="gazhbl==3">2号楼公安综合办理区(3/3)</div>
            </div>
            <!-- 无差别综合办理区 -->
            <div v-show="currentBtn==6">
                <div v-if="wcbzh==1" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="wcbzh=4"></i>
                    <div class="ckh" style="left: 182px;" @click="getPopuData1(204,'204无差别综合办理区')"></div>
                    <div class="ckh" style="left: 270px;" @click="getPopuData1(203,'203无差别综合办理区')"></div>
                    <div class="ckh" style="left: 384px;width: 110px;" @click="getPopuData1(202,'202无差别综合办理区 一件事一次办')">
                    </div>
                    <div class="ckh" style="right: 150px;width: 100px;" @click="getPopuData1(201,'201出证咨询窗口 川渝 跨省通办')">
                    </div>
                    <img src="images/floortwo9.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="wcbzh=2"></i>
                </div>
                <div v-if="wcbzh==2" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="wcbzh=1"></i>
                    <div class="ckh" style="left: 100px;" @click="getPopuData1(210,'210无差别综合办理区')"></div>
                    <div class="ckh" style="left: 195px;" @click="getPopuData1(209,'209无差别综合办理区')"></div>
                    <div class="ckh" style="left: 302px;" @click="getPopuData1(208,'208无差别综合办理区')"></div>
                    <div class="ckh" style="left: 390px;" @click="getPopuData1(207,'207无差别综合办理区')"></div>
                    <div class="ckh" style="right: 186px;" @click="getPopuData1(206,'206无差别综合办理区')"></div>
                    <div class="ckh" style="right: 100px;" @click="getPopuData1(205,'205无差别综合办理区')"></div>
                    <img src="images/floortwo5.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="wcbzh=3"></i>
                </div>
                <div v-if="wcbzh==3" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="wcbzh=2"></i>
                    <div class="ckh" style="left: 150px;" @click="getPopuData1(215,'215卫健综合窗口')"></div>
                    <div class="ckh" style="left: 230px;" @click="getPopuData1(214,'214卫健综合窗口')"></div>
                    <div class="ckh" style="left: 332px;" @click="getPopuData1(213,'213卫健综合窗口')"></div>
                    <div class="ckh" style="right: 156px;" @click="getPopuData1(211,'211档案综合窗口')"></div>
                    <img src="images/floortwo7.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="wcbzh=4"></i>
                </div>
                <div v-if="wcbzh==4" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="wcbzh=3"></i>
                    <div class="ckh" style="left: 120px;" @click="getPopuData1(221,'221交通综合窗口')"></div>
                    <div class="ckh" style="left: 252px;" @click="getPopuData1(220,'220交通综合窗口')"></div>
                    <div class="ckh" style="left: 350px;" @click="getPopuData1(219,'219交通综合窗口')"></div>
                    <div class="ckh" style="right: 186px;" @click="getPopuData1(218,'218交通综合窗口')"></div>
                    <div class="ckh" style="right: 100px;" @click="getPopuData1(217,'217交通综合窗口')"></div>
                    <img src="images/floortwo8.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="wcbzh=1"></i>
                </div>
                <div class="title" v-if="wcbzh==1">2号楼无差别综合办理区(1/4)</div>
                <div class="title" v-if="wcbzh==2">2号楼无差别综合办理区(2/4)</div>
                <div class="title" v-if="wcbzh==3">2号楼无差别综合办理区(3/4)</div>
                <div class="title" v-if="wcbzh==4">2号楼无差别综合办理区(4/4)</div>
            </div>
            <!-- 经开区企业开办办理区 -->
            <div v-show="currentBtn==7">
                <div v-if="jkqqy==1" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="jkqqy=2"></i>
                    <!-- <div class="ckh" style="left: 100px;" @click="getPopuData(301)"></div>
                    <div class="ckh" style="left: 200px;" @click="getPopuData(302)"></div>
                    <div class="ckh" style="left: 302px;" @click="getPopuData(303)"></div>
                    <div class="ckh" style="left: 390px;" @click="getPopuData(304)"></div>
                    <div class="ckh" style="right: 186px;" @click="getPopuData(305)"></div>
                    <div class="ckh" style="right: 100px;" @click="getPopuData(306)"></div> -->
                    <img src="images/floorthree5.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="jkqqy=2"></i>
                </div>
                <div v-if="jkqqy==2" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="jkqqy=1"></i>
                    <!-- <div class="ckh" style="left: 280px;" @click="getPopuData(323)"></div>
                    <div class="ckh" style="right: 290px;" @click="getPopuData(324)"></div> -->
                    <div class="ckh" style="right: 200px;" @click="getPopuData(325)"></div>
                    <img src="images/floorthree1.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="jkqqy=1"></i>
                </div>
                <div class="title" v-if="jkqqy==1">2号楼经开区企业开办办理区(1/2)</div>
                <div class="title" v-if="jkqqy==2">2号楼经开区企业开办办理区(2/2)</div>
            </div>
            <!-- 不动产登记办理区 -->
            <div v-show="currentBtn==8">
                <div class="ckh" style="left: 105px;" @click="getPopuData(322)"></div>
                <img src="images/floorthree2.png" alt="" style="width: 750px;">
                <div class="title">2号楼不动产登记办理区办理(1/1)</div>
            </div>
            <!-- 工程建设领域办理区 -->
            <div v-show="currentBtn==9">
                <div v-if="gcjsly==1" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="gcjsly=2"></i>
                    <div class="ckh" style="left: 126px;" @click="getPopuData1(312,'312工程建设领域办理区')"></div>
                    <div class="ckh" style="left: 265px;" @click="getPopuData1(311,'311工程建设领域办理区')"></div>
                    <div class="ckh" style="right: 266px;" @click="getPopuData1(310,'310工程建设领域办理区')"></div>
                    <div class="ckh" style="right: 106px;" @click="getPopuData1(308,'308工程建设领域办理区')"></div>
                    <img src="images/floorthree3.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="gcjsly=2"></i>
                </div>
                <div v-if="gcjsly==2" class="gaimg">
                    <i class="el-icon-arrow-left left" @click="gcjsly=1"></i>
                    <div class="ckh" style="left: 100px;" @click="getPopuData1(318,'318消防综合窗口')"></div>
                    <div class="ckh" style="left: 200px;" @click="getPopuData1(317,'317发改委综合窗口')"></div>
                    <div class="ckh" style="left: 302px;" @click="getPopuData1(316,'316涉农事务综合窗口')"></div>
                    <div class="ckh" style="left: 390px;" @click="getPopuData1(315,'315生态环境综合窗口')"></div>
                    <!-- <div class="ckh" style="right: 186px;" @click="getPopuData1(314,'314交通建设综合窗口')"></div> -->
                    <div class="ckh" style="right: 100px;" @click="getPopuData1(313,'313经开市政综合窗口')"></div>
                    <img src="images/floorthree4.png" alt="" style="width: 750px;">
                    <i class="el-icon-arrow-right right" @click="gcjsly=1"></i>
                </div>
                <div class="title" v-if="gcjsly==1">2号楼工程建设领域办理区(1/2)</div>
                <div class="title" v-if="gcjsly==2">2号楼工程建设领域办理区(2/2)</div>
            </div>
        </div>
        <div class="bottomBtn" v-show="currentIndex==1">
            <div class="btn active" id="threed" @click="showthreed">3D</div>
            <div class="btn" id="vrdiv" @click="showvrdiv">VR</div>
        </div>
        <div class="zxfw">
            <div style="color: #004A93;margin: 15px 0;">特色服务</div>
            <div class="buttonList">
                <div class="button" @click="goToLink('https://www.cqna.gov.cn/syygapi/naxsb/wyyy.html')">延时办</div>
                <div class="button" @click="goToLink('https://www.cqna.gov.cn/syygapi/naxsb/wybdb.html')">帮代办</div>
                <div class="button" @click="goToLink('https://www.cqna.gov.cn/ykb_254/')">主题服务</div>
                <div class="button" @click="goToLink('https://www.cqna.gov.cn/zwgk_254/zfxxgkml/msjxjsbmp/index.html')">
                    免申即享</div>
                <!-- <div class="button" @click="goToLink('https://www.cqna.gov.cn/ghwd/znwd/index.html')">智能问答</div> -->
                <div class="button" @click="goToLink('https://www.cqna.gov.cn/syygapi/naxsb/zwfwtyy.html')">体验员招募</div>
                <div class="button" @click="dialogVisible=true">窗口电话</div>
            </div>
        </div>
    </div>
    <div style="width:100%;" class="footer"></div>
</body>
<script>
    $(function () {
        $(".header").load('https://www.cqna.gov.cn/syygapi/naxsb/top/top_style.html');
        $(".footer").load('https://www.cqna.gov.cn/syygapi/naxsb/footer/footer.html');
    });
</script>
<!-- 引入 Vue -->
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/vue.min.js"></script>
<!-- 引入样式 -->
<link rel="stylesheet" href="https://www.cqna.gov.cn/syygapi/naxsb/css/index.css">
<!-- 引入组件库 -->
<script src="https://www.cqna.gov.cn/syygapi/naxsb/js/index.js"></script>
<script>
    function isMobileUserAgent() {
        return /iphone|ipod|android.*mobile|windows.*phone|blackberry.*mobile/i.test(
            window.parent.navigator.userAgent.toLowerCase("")
        );
    }

    if (isMobileUserAgent()) {
        window.location = 'https://www.cqna.gov.cn/syygapi/naxsb/mobile/flooroneMobile.html'
    }
</script>
<script>
    var nowDiv = new Vue({
        el: "#app",
        data: function () {
            return {
                activeName: 'second',
                activeNametwo: 'rzbm',
                popupShow: false,
                btnName: '',
                currentBtn: null,
                currentFloor: 1,
                popupType: "other",
                currentPage: 1,
                total: 0,
                btnid: 1,
                gazhbl: 1,
                wcbzh: 1,
                hydjc: 1,
                gcjsly: 1,
                jkqqy: 1,
                windowNum: '',
                currentIndex: 1,
                dialogVisible: false,
                inputValue: '',
                floorList: [
                    {
                        id: 1,
                        name: "一楼"
                    },
                    {
                        id: 2,
                        name: "二楼"
                    },
                    {
                        id: 3,
                        name: "三楼"
                    },
                ],
                rzbmList: [],
                zlylqList: [{
                    id: 1,
                    mattersName: '《2024国务院公报》',
                    addr: 'https://www.gov.cn/gongbao/2024/issue_11606/'
                }, {
                    id: 7,
                    mattersName: '《2024重庆市人民政府公报》',
                    addr: 'https://www.cq.gov.cn/zwgk/zfxxgkml/zfgb/2024/'
                }, {
                    id: 8,
                    mattersName: '《2023重庆市南岸区人民政府工作报告》',
                    addr: 'https://www.cqna.gov.cn/zwgk_254/zfxxgkml/zfgzbg/index.html'
                },
                {
                    id: 2,
                    mattersName: '《政务公开重点领域的标准目录》',
                    addr: 'https://www.cqna.gov.cn/zwgk_254/jczwgk/'
                },
                {
                    id: 3,
                    mattersName: '《惠农惠民补贴资金发放汇总、公示材料、政策清单》',
                    addr: 'https://www.cqna.gov.cn/bm/qczj/zwgk_59968/zfxxgkml/hmhnzj/btzcqd/202410/t20241028_13746703.html'
                },
                {
                    id: 4,
                    mattersName: '《2024本（镇）街道政府信息公开指南》',
                    addr: 'https://www.cqna.gov.cn/zwgk_254/zfxxgkzn/'
                },
                {
                    id: 5,
                    mattersName: '《2023本（镇）街道政府信息公开年报》',
                    addr: 'https://www.cqna.gov.cn/zwgk_254/zfxxgknb/'
                },
                {
                    id: 6,
                    mattersName: '《20.21.22.23年行政规范性文件汇编》',
                    addr: 'https://www.cqna.gov.cn/zwgk_254/zfxxgkml/zcwj/xzgfxwjk/'
                },
                {
                    id: 9,
                    mattersName: '《2019版政府信息公开条例》',
                    addr: 'https://flk.npc.gov.cn/detail2.html?ZmY4MDgwODE2ZjNlOThiZDAxNmY0MWYyODYyZTAyMTE'
                }
                ],
                sxqdList: [
                    {
                        id: 1,
                        title: "残疾人证新办",
                        url: ""
                    },
                    {
                        id: 1,
                        title: "残疾人证换领",
                        url: ""
                    },
                    {
                        id: 1,
                        title: "残疾人证迁移",
                        url: ""
                    },
                    {
                        id: 1,
                        title: "残疾人证挂失补办",
                        url: ""
                    },
                    {
                        id: 1,
                        title: "残疾人证注销",
                        url: ""
                    },
                    {
                        id: 1,
                        title: "残疾类别/等级变更",
                        url: ""
                    }
                ],
                /* 楼层指引 start */
                floorGuideShow: false,//楼层指引显示控制
                floorGuideList: [
                    {
                        floorNum: '-1F',
                        name: '地下车库'
                    },
                    {
                        floorNum: '11F',
                        name: '区商务委'
                    },
                    {
                        floorNum: '-2F',
                        name: '地下车库'
                    },
                    {
                        floorNum: '12F',
                        name: '区商务委、区违整办'
                    },
                    {
                        floorNum: '1F',
                        name: '区政务服务大厅'
                    },
                    {
                        floorNum: '13F',
                        name: '区交通运输委'
                    },
                    {
                        floorNum: '2F',
                        name: '区政务服务大厅'
                    },
                    {
                        floorNum: '14F',
                        name: '区道路运输事务中心'
                    },
                    {
                        floorNum: '3F',
                        name: '南岸区经开区政务大厅'
                    },
                    {
                        floorNum: '15F',
                        name: '区生态环境局'
                    },
                    {
                        floorNum: '4F',
                        name: '区公共资源交易中心'
                    },
                    {
                        floorNum: '16F',
                        name: '区生态环境局'
                    },
                    {
                        floorNum: '5F',
                        name: '南岸区经开区行政服务中心'
                    },
                    {
                        floorNum: '17F',
                        name: '区城管局、区生态环境局'
                    },
                    {
                        floorNum: '6F',
                        name: '区民政局'
                    },
                    {
                        floorNum: '18F',
                        name: '区城管局'
                    },
                    {
                        floorNum: '7F',
                        name: '区民政局'
                    },
                    {
                        floorNum: '19F',
                        name: '区城管局'
                    },
                    {
                        floorNum: '8F',
                        name: '区科技局、区民政局'
                    },
                    {
                        floorNum: '20F',
                        name: '区供销社'
                    },
                    {
                        floorNum: '9F',
                        name: '区文化旅游委、区工商联（区总商户）'
                    },
                    {
                        floorNum: '21F',
                        name: '重庆市南岸区隧道轨道交通建设服务中心'
                    },
                    {
                        floorNum: '10F',
                        name: '区文化旅游委'
                    },
                    {
                        floorNum: '22F',
                        name: ''
                    },
                ]
                /* 楼层指引 end */
            };
        },
        created() {
            this.unitBtnClick();
        },
        mounted() {
            const url = new URL(window.location.href);
            const id = url.searchParams.get('floorid');
            $('.threed').show();
            $('.vrdiv').hide();
            document.querySelector('#app').classList.remove('hide');
            // 启动整个文档点击事件监听
            this.$nextTick(() => {
                document.addEventListener("click", this.floorGuideHideFun, true);
            });
        },
        methods: {
            gozwgk() {
                this.popupType = 1;
                this.btnName = '政务公开专区';
                var detailDivs = document.getElementsByClassName('detailDiv');
                detailDivs[0].style.display = 'block'; // 强制显示元素
                //初始化tab栏
                this.activeNametwo = "sxqd";
                this.inputValue = '';
            },
            goConbtn(ImgType, id, type) {
                if (!type) {
                    this.windowNum = '';
                    this.btnName = '';
                }
                this.rzbmList = []
                var detailDivs = document.getElementsByClassName('detailDiv');
                detailDivs[0].style.display = 'block'; // 强制显示元素
                this.popupShow = true;

                this.currentBtn = ImgType;
                this.popupType = 2;

                //初始化tab栏
                this.activeNametwo = "sxqd";
                this.inputValue = '';
                this.currentIndex = 3;

                this.currentPage = 1;

                $('#tab-rzbm').css('display', 'inline-block')
                $('.popuppage').css('display', 'block')
                $('.search').css('display', 'flex')
                this.btnid = id;
                this.getItemList(1, id)
            },
            getPopuData(windowNum) {
                this.windowNum = windowNum;
                // 传参形式   this.goConbtn(ImgType, id, 1);ImgType表示第三层图片，id弹框的数据id，1是表示窗口传参
                if (this.currentBtn == 5) {
                    this.goConbtn(5, 4, 1);
                } else if (this.currentBtn == 6) {
                    this.goConbtn(6, 5, 1);
                } else if (this.currentBtn == 7) {
                    this.goConbtn(7, 6, 1);
                } else if (this.currentBtn == 8) {
                    this.goConbtn(8, 7, 1);
                } else if (this.currentBtn == 9) {
                    this.goConbtn(9, 8, 1);
                }
            },
            getPopuData1(windowNum, name) {
                this.windowNum = windowNum;
                this.btnName = name;
                // 传参形式   this.goConbtn(ImgType, id, 1);ImgType表示第三层图片，id弹框的数据id，1是表示窗口传参
                if (this.currentBtn == 10) {
                    this.goConbtn(10, 9, 1);
                } else if (this.currentBtn == 2) {
                    this.goConbtn(2, 3, 1);
                } else if (this.currentBtn == 6) {
                    this.goConbtn(6, 5, 1);
                } else if (this.currentBtn == 9) {
                    this.goConbtn(9, 8, 1);
                }
            },
            handleClose(done) {
                this.dialogVisible = false;
            },
            handleCurrentChange(val) {
                this.currentPage = val;
                if (this.inputValue) {
                    this.searchData(val);
                } else {
                    this.getItemList(val, this.btnid)
                }
            },
            handleClick(tab, event) {
                if (tab.name == 'fifth') {
                    window.open('https://www.cqna.gov.cn/zwgk_254/')
                }
            },
            searchData(val) {
                var that = this;
                this.currentPage = val;
                $.ajax({
                    url: conpath + "/handleBusiness/search",
                    type: "post",
                    contentType: 'application/json',
                    data: JSON.stringify({
                        "keyword": that.inputValue,
                        "currentPage": val,
                        "pageSize": 7,
                        "businessId": that.btnid,
                        "windowNum": that.windowNum ? String(that.windowNum) : ''
                    }),
                    dataType: "json",
                    success: function (data) {
                        that.sxqdList = data.data.handleMatters.slice(0, 7);
                        that.total = data.data.total;
                        that.rzbmList = data.data.handleDepts;
                    }
                })
            },
            goToLink(url) {
                if (url) {
                    window.open(url);
                }
            },
            floorChange(id) {
                this.currentFloor = id;
                this.currentIndex = 1;
                this.popupType = 'other'
                this.popupShow = false;
                $('.threed').show();
                $('.vrdiv').hide();
                this.unitBtnClick();
                this.showthreed();
                var detailDivs = document.getElementsByClassName('detailDiv');
                detailDivs[0].style.display = 'none'; // 强制显示元素
            },
            showthreed() {
                $('.threed').show();
                $('.vrdiv').hide();
                $('#vrdiv').removeClass('active');
                $('#threed').addClass('active');
            },
            showvrdiv() {
                $('.threed').hide();
                $('.vrdiv').show();
                $('#threed').removeClass('active');
                $('#vrdiv').addClass('active');
                this.unitBtnClick();
                var detailDivs = document.getElementsByClassName('detailDiv');
                detailDivs[0].style.display = 'none'; // 强制显示元素
            },
            handleClicktwo() { },
            backsw() {
                window.location.href = "https://www.cqna.gov.cn/syygapi/naxsb/qjt.html"
            },
            backdt() {
                this.currentIndex = 1;
                var detailDivs = document.getElementsByClassName('detailDiv');
                detailDivs[0].style.display = 'none'; // 强制显示元素
            },
            unitBtnClick() {
                lines.style.display = 'none';
                lineh.style.display = 'none';
                redio.style.display = 'none';
            },
            getItemList(currentPage, businessId) {
                var that = this;
                $.ajax({
                    url: conpath + "/handleBusiness/query",
                    type: "post",
                    contentType: 'application/json',
                    data: JSON.stringify({
                        "currentPage": currentPage,
                        "pageSize": 7,
                        "businessId": businessId,
                        "windowNum": that.windowNum ? String(that.windowNum) : ''
                    }),
                    dataType: "json",
                    success: function (data) {
                        that.sxqdList = data.data.handleMatters;
                        if (businessId != 9 & businessId != 3 & businessId != 5) {
                            that.btnName = that.windowNum + data.data.handleBusiness.handleName;
                        } else {
                            if (!that.windowNum) {
                                that.btnName = data.data.handleBusiness.handleName;
                            }
                        }
                        that.rzbmList = data.data.handleDepts;
                        that.total = data.data.total;
                    }
                })
            },
            // 监听文档点击事件若不在楼层索引展示区则隐藏此弹窗
            floorGuideHideFun(e) {
                let parentNode = e.target.parentNode
                if (parentNode.className != 'floorGuide'
                    && parentNode.className != 'el-col el-col-12'
                    && parentNode.className != 'floorGuideTable'
                    && parentNode.className != 'floorNum-col'
                    && parentNode.className != 'floorName-col'
                    && this.floorGuideShow)
                    this.floorGuideShow = false;
            }
        },
        beforeDestroy() {
            document.removeEventListener("click", this.floorGuideHideFun); //页面销毁的时候移除事件
        },
    })
</script>

</html>