word+excle+pdf表格在线浏览通过iframe直接引用微软提供的方法 <div id="inkCollectWrapper" v-cloak> <el-dialog custom-class="ink-cd-dialog" @close="handleClose" @open="onOpen" title="收藏到主页" width="800px" :append-to-body="true" :visible.sync="visible"> <div class="ink-cd-category-selector flex justify-between"> <div class="ink-cd-sidebar"> <!-- 切换主页 --> <el-popover class="ink-cd-popover" placement="bottom" v-model="homepageVisible" :visible-arrow="false" width="240" trigger="click"> <el-button size="medium" class="ink-cd-change-homepage-btn" round plain slot="reference"> <div class="flex items-center justify-center"> <img :src="currentHomepage.iconSrc" width="16" alt=""> <p class="text-ellipsis homepage-title">{{ currentHomepage.title }}</p> <i class="el-icon-arrow-down"></i> </div> </el-button> <el-scrollbar class="ink-cd-homepage-list-scrollbar"> <ul class="ink-cd-homepage-list"> <li v-for="item in homepageList" :key="item.id" class="flex items-center content-item" :class="{active: activeHomepageId===item.id}" @click="changeHomepage(item.id)"> <div class="cover"><img width="16" :src="item.iconSrc" alt=""></div> <div class="info flex items-center"> <span class="info-tag" v-if="item.isDefault">默认</span> <h4 class="ft-14 text-darker">{{ item.title }}</h4> <i class="el-icon-lock ft-13 text-light" v-if="!item.isOpen" title="私有主页，他人不可见"></i> </div> </li> </ul> </el-scrollbar> </el-popover> <!-- 侧边模块栏 --> <el-scrollbar class="ink-cd-module-scrollbar"> <dl class="ink-cd-sidebar-module"> <dt class="module-title ft-12 text-lighter">常用</dt> <dd class="module-option flex items-center" :class="{active: commonlyModule ===activeModule}" @click="changeModuleOption(commonlyModule)"> <i class="ft-14 text-light iconfont nav-shoucang2"></i> <span class="ft-14 text-dark module-option-text">常用分类</span> </dd> </dl> <dl class="ink-cd-sidebar-module"> <dt class="module-title ft-12 text-lighter">模块</dt> <dd class="module-option flex items-center" v-for="item in moduleOptions" :key="item.moduleId" :class="{active: item.moduleId===activeModule}" @click="changeModuleOption(item.moduleId)"> <div class="ink-cd-render-icon" :style="{width: iconSize, height:iconSize, 'font-size':iconSize}"> <div v-if="!item.iconValue"> <i class="text-default ink-cd-render-iconfont iconfont nav-wenjianjia"></i> </div> <div v-else> <div class="ink-cd-render-color" v-if="item.iconType==='color'" :style="{background: item.iconValue}"></div> <i class="text-default ink-cd-render-iconfont iconfont" v-else-if="item.iconType==='font'" :class="item.iconValue"></i> <img v-else :src="item.iconValue" alt=""> </div> </div> <span class="ft-14 text-dark module-option-text">{{ item.title }}</span> </dd> </dl> </el-scrollbar> </div> <div class="ink-cd-main"> <div class="ink-cd-category-tree footer" v-loading="loading"> <div class="flex items-center justify-between ink-cd-bookmark-filter"> <el-input size="medium" clearable prefix-icon="el-icon-search" placeholder="快速搜索分类" v-model="filterText"> </el-input> </div> <div class="ink-cd-tree-wrapper"> <el-tree :data="treeData" class="ink-cd-el-tree" ref="move-dialog-tree" node-key="bid" default-expand-all :props="defaultProps" @node-click="handleNodeClick" :expand-on-click-node="false" :filter-node-method="filterNode" highlight-current> <div class="ink-cd-custom-tree-node" slot-scope="{ node, data }"> <div class="ink-cd-render-icon" :style="{width: iconSize, height:iconSize, 'font-size':iconSize}"> <div v-if="!data.iconValue"> <img src="https://img.bidianer.com/image/bookmark-default-icon-yellow.svg" v-if="currentModuleType===2" alt=""> <i class="text-default iconfont nav-wenjianjia" v-else></i> </div> <div v-else> <div class="ink-cd-render-color" v-if="data.iconType==='color'" :style="{background: data.iconValue}"></div> <i class="text-default ink-cd-render-iconfont iconfont" v-else-if="data.iconType==='font'" :class="data.iconValue"></i> <img v-else :src="data.iconValue" alt=""> </div> </div> <span class="label">{{ node.label }}</span> </div> </el-tree> </div> </div> <div class="ink-cd-main-footer flex items-center justify-center"> <div class="footer flex items-center justify-center"> <el-button size="small" @click="handleClose" plain>关闭</el-button> <el-button size="small" type="primary" :disabled="submitDisabled" :loading="loading" @click="handleSubmit"> 收藏 </el-button> </div> </div> </div> </div> </el-dialog> </div> <!-- 多条广告如下脚本只需引入一次 --> <script type="text/javascript" src="//cpro.baidustatic.com/cpro/ui/cm.js" async="async" defer="defer"> </script> </div> <footer class="page-footer"> <div class="inner"> <p class="link-nav"> <span><a href="https://m.bidianer.com?from=pc">手机/Pad版</a></span> <span><a target="_blank" href="/friend-links">友情链接</a></span> <span><a target="_blank" href="/sitemap.html">网站地图</a></span> <span>南京笔点信息技术有限公司版权所有</span> <span><a href="http://www.beian.miit.gov.cn">苏ICP备10202778号</a></span> <span>QQ群：471267427</span> <span> <a target="_blank" href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=32011502010827">苏公网安备 32011502010827号</a> </span> <script> var _hmt = _hmt || []; (function () { var hm = document.createElement("script"); hm.src = "https://hm.baidu.com/hm.js?165dd81054f7979b86e1d93162f10907"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(hm, s); })(); </script> </p> </div> </footer> <!--<script data-ad-client="ca-pub-3697889420210040" async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>--> <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3697889420210040" crossorigin="anonymous"></script> <script src="https://img.bidianer.com/static/common/vue-2.7.16.js"></script> <script src="https://img.bidianer.com/static/common/element-2.15.14/index.js"></script> <script src="https://img.bidianer.com/static/common/jquery.min.js"></script> <script src="https://img.bidianer.com/web/js/jquery.lazyload.min.js"></script> <script src="https://img.bidianer.com/web/js/discover.js"></script> <script src="https://img.bidianer.com/web/js/item.js?v=2025.06.13" 0="frontend\assets\AppAsset" 1="frontend\assets\AppAsset"></script> <script src="https://img.bidianer.com/web/js/ink.min.js?v=2025.06.13" 0="frontend\assets\AppAsset" 1="frontend\assets\AppAsset"></script> <script src="https://pic.bidianer.com/static/ink-collect-dialog.88ea3d5fb86c4088c29a.js?v=2025.06.13" 0="frontend\assets\AppAsset" 1="frontend\assets\AppAsset"></script></body> </html>
