| | |
| | | <import src="index.skeleton.wxml" /> |
| | | <template is="skeleton" wx:if="{{loading}}" /> |
| | | |
| | | |
| | | <scroll-view scroll-y="{{scrollJudge}}" wx:else class="outsideContentBox"> |
| | | |
| | | <view> |
| | | |
| | | |
| | | |
| | | <view wx:else class="page-bookService"> |
| | | <scroll-view scroll-y="{{true}}" class="outsideContentBox"> |
| | | <view class="digital"> |
| | | <view class="book-box"> |
| | | <view class="digitalCoursesDetailsTitle"> |
| | | |
| | | <view class="imageBox"> |
| | | <image src="{{digitalsData.icon}}" mode="aspectFit" /> |
| | | </view> |
| | | |
| | | <view class="nameBox">{{digitalsData.name}}</view> |
| | | |
| | | |
| | | <view> |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 170rpx;"> ISBN: </view> |
| | | <view style="width: 200rpx"> ISBN: </view> |
| | | <view wx:if="{{digitalsData.isbn}}"> {{digitalsData.isbn}} </view> |
| | | <view wx:else="">-</view> |
| | | <view wx:else>-</view> |
| | | </viwe> |
| | | |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 200rpx">课程负责人:</view> |
| | | <view wx:if="{{digitalsData.courseLeader}}"> |
| | | {{digitalsData.courseLeader }} |
| | | </view> |
| | | <view wx:else>-</view> |
| | | </viwe> |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 170rpx;">出版时间:</view> |
| | | <view wx:if="{{digitalsData.publicationDate}}">{{digitalsData.publicationDate}} </view> |
| | | <view wx:else="">-</view> |
| | | <view style="width: 200rpx">课程负责人单位:</view> |
| | | <view wx:if="{{digitalsData.affiliatedUnit}}"> |
| | | {{ digitalsData.affiliatedUnit}} |
| | | </view> |
| | | <view wx:else>-</view> |
| | | </viwe> |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 170rpx;">课题负责人:</view> |
| | | <view wx:if="{{digitalsData.courseLeader}}"> {{digitalsData.courseLeader }}</view> |
| | | <view wx:else="">-</view> |
| | | <view style="width: 200rpx">出版单位:</view> |
| | | <view wx:if="{{digitalsData.publishingUnit}}"> |
| | | {{publishingUnit}} |
| | | </view> |
| | | <view wx:else>-</view> |
| | | </viwe> |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 170rpx;">所属单位:</view> |
| | | <view wx:if="{{digitalsData.affiliatedUnit}}"> {{ digitalsData.affiliatedUnit}}</view> |
| | | <view wx:else="">-</view> |
| | | <view style="width: 200rpx">出版时间:</view> |
| | | <view wx:if="{{digitalsData.publicationDate}}">{{digitalsData.publicationDate}} |
| | | </view> |
| | | <view wx:else>-</view> |
| | | </viwe> |
| | | <viwe class="styleCssBox"> |
| | | <view style="width: 170rpx;">出版单位:</view> |
| | | <view wx:if="{{digitalsData.publishingUnit}}">{{digitalsData.publishingUnit}} </view> |
| | | <view wx:else="">-</view> |
| | | </viwe> |
| | | <image src="/static/images/bookService/detail/square.png" class="right-background" /> |
| | | <image src="/static/images/bookService/detail/square.png" mode="aspectFit" class="right-background" /> |
| | | </view> |
| | | |
| | | </view> |
| | | |
| | | <view class="certificate"> |
| | | |
| | | <view style="margin-left: 30rpx;">价格: <text>¥{{digitalsData.price}}</text></view> |
| | | <view style="margin-right: 30rpx;">共<text>{{ digitalsData.classHours}}</text>课时</view> |
| | | |
| | | <view style="margin-left: 30rpx">价格: <text>¥{{digitalsData.price}}</text> <text class="old-price" wx:if="{{digitalsData.oldPrice != '0.00'}}">¥{{ digitalsData.oldPrice }}</text> </view> |
| | | <view style="margin-right: 30rpx">共<text>{{ digitalsData.classHours ? digitalsData.classHours : |
| | | '0'}}</text>课时</view> |
| | | </view> |
| | | </view> |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | </view> |
| | | |
| | | |
| | | <view class="tabBox"> |
| | | <t-tabs defaultValue="{{tabValue}}" bind:change="onTabsChange" t-class="custom-tabs" t-class-content="custom-panel"> |
| | | <t-tab-panel icon="{{ tabValue == '0' ? briefIconClick : briefIcon}}" label="基本信息" value="0" style="{{tabPanelstyle}}"> |
| | | <!-- <scroll-view scroll-y="{{true}}" class="outsideContentBox"> --> |
| | | |
| | | <t-tab-panel icon="{{ tabValue == '0' ? briefIconClick : briefIcon}}" label="基本信息" value="0"> |
| | | <view class="rubricBox"> |
| | | <view class="rubricimgBox"> |
| | | <image src="/static/images/bookService/detail/label.png" mode="" /> |
| | | <image src="/static/images/bookService/detail/label.png" mode="aspectFit" /> |
| | | </view> |
| | | <view class="basic"> 课程介绍</view> |
| | | </view> |
| | | <view style="margin: 30rpx; margin-bottom: 130rpx; min-height:260rpx ;"> |
| | | <rich-text wx:if="{{digitalsData.content}}" nodes="{{digitalsData.content}}" style="{{richStyle}}"></rich-text> |
| | | |
| | | |
| | | |
| | | <view class="course-content"> |
| | | <rich-text wx:if="{{digitalsData.content}}" nodes="{{digitalsData.content}}"></rich-text> |
| | | <view wx:else="" class="noDataBox"> |
| | | <t-empty icon="folder-open" description="暂无数据" font-size="80" /> |
| | | <!-- <t-empty icon="folder-open" description="暂无数据" font-size="80" /> --> |
| | | <empty /> |
| | | </view> |
| | | |
| | | |
| | | </view> |
| | | |
| | | <view class="rubricBox"> |
| | | <view class="rubricimgBox"> |
| | | <image src="/static/images/bookService/detail/label.png" mode="" /> |
| | | <image src="/static/images/bookService/detail/label.png" mode="aspectFit" /> |
| | | </view> |
| | | <view class="basic"> 主讲老师</view> |
| | | </view> |
| | | |
| | | <view class="lecturer"> |
| | | <view class="lecturerImangBox"> |
| | | <image src="" mode="" /> |
| | | </view> |
| | | <view class="lecturerInformation"> |
| | | |
| | | <view class="lecturerName"> |
| | | <view style="font-weight: bold; font-size: 29rpx; color: #333333;"> |
| | | |
| | | 林崇德 |
| | | |
| | | </view> |
| | | <view style="font-weight: 400; font-size: 25rpx; color: #949494;">讲师</view> |
| | | <view class="course-content" wx:if="{{lecturerList.length> 0}}"> |
| | | <view class="lecturer" wx:for="{{lecturerList}}" wx:key="index" wx:for-item="item"> |
| | | <view class="lecturerImangBox"> |
| | | <image src="{{item.icon}}" mode="aspectFit" wx:if="{{item.icon}}" /> |
| | | <image src="/static/images/lecturer.png" mode="aspectFit" wx:else /> |
| | | </view> |
| | | <view class="lecturerContent">中国学生发展核心素养研制首席专家,围绕大中小学教材建设开展了一系列开创性、奠基性工作。建立完善了我国发展心理学教材体系。</view> |
| | | |
| | | |
| | | <view class="lecturerInformation"> |
| | | <view class="lecturerName"> |
| | | <view class="name"> {{item.name}} </view> |
| | | <view class="title">{{item.title}}</view> |
| | | </view> |
| | | <view class="lecturerContent">{{item.description}}</view> |
| | | </view> |
| | | </view> |
| | | |
| | | </view> |
| | | |
| | | |
| | | |
| | | <!-- </scroll-view> --> |
| | | |
| | | |
| | | <view wx:if="{{lecturerList.length == 0}}" class="noDataBox"> |
| | | <empty /> |
| | | </view> |
| | | </t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '1' ? learnResourceClickIcon : learnResourceIcon}}" label="证书信息" value="1" style="{{tabPanelstyle}}"> |
| | | |
| | | <t-tab-panel icon="{{ tabValue == '1' ? learnResourceClickIcon : learnResourceIcon}}" label="证书信息" value="1"> |
| | | <view class="rubricBox"> |
| | | <view class="rubricimgBox"> |
| | | <image src="/static/images/digitalTextbooks/zhengshu@2x.png" mode="" /> |
| | | <image src="/static/images/digitalTextbooks/zhengshu@2x.png" mode="aspectFit" /> |
| | | </view> |
| | | <view class="basic"> 证书信息</view> |
| | | </view> |
| | | |
| | | |
| | | <view class="certificateChart"> |
| | | <view class="chart"> |
| | | <image src="" mode="" /> |
| | | </view> |
| | | <view class="chart"> |
| | | <image src="" mode="" /> |
| | | <view class="course-content"> |
| | | <view class="certificateChart"> |
| | | <view class="chart" bind:tap="onClick1"> |
| | | <image src="{{cbzsImg}}" mode="" /> |
| | | </view> |
| | | <view class="chart" bind:tap="onClick2"> |
| | | <image src="{{rzzsImg}}" mode="" /> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <!-- |
| | | <view class="noDataBox"> |
| | | <t-empty icon="folder-open" description="暂无数据" font-size="80" /> |
| | | |
| | | </view> --> |
| | | |
| | | |
| | | |
| | | <canvas canvas-id="myCanvas" style="height: 845px; width: 595px" wx:if="{{pubCertificateHide}}"></canvas> |
| | | <view id="pubCertificate" class="my_canvas" wx:if="{{pubCertificateHide}}"> |
| | | <image data-type="image" data-url="https://jsek.bnuic.com/home/certificate/szkc.jpg" src="https://jsek.bnuic.com/home/certificate/szkc.jpg" mode="" class="bgImg my_draw_canvas" /> |
| | | <view class="certificateInfo my_draw_canvas"> |
| | | <view class="bookName my_draw_canvas" data-type="text" data-text="{{digitalsData.name}}">{{digitalsData.name}}</view> |
| | | <view class="author my_draw_canvas" data-type="text" data-text="{{digitalsData.courseLeader}}">{{digitalsData.courseLeader || '-' }}</view> |
| | | <view class="affiliatedUnit my_draw_canvas" data-type="text" data-text="{{digitalsData.affiliatedUnit}}">{{digitalsData.affiliatedUnit || '-'}}</view> |
| | | <view class="affiliatedUnit my_draw_canvas" data-type="text" data-text="{{digitalsData.isbn}}"> |
| | | {{ digitalsData.isbn || '-'}} |
| | | </view> |
| | | <view class="affiliatedUnit my_draw_canvas" data-type="text" data-text="{{digitalsData.publicationDate}}">{{digitalsData.publicationDate}}</view> |
| | | <view class="affiliatedUnit my_draw_canvas" data-type="text" data-text="{{publishingUnit}}">{{publishingUnit}}</view> |
| | | <view class="website my_draw_canvas" data-type="text" data-text="{{website}}">{{website}}</view> |
| | | <view class="codeBox"></view> |
| | | </view> |
| | | </view> |
| | | <canvas canvas-id="myCanvas1" style="height:845px;width:595px" wx:if="{{pubCertificateHide}}"></canvas> |
| | | <view id="textCertificate" class="my_canvas1" wx:if="{{pubCertificateHide}}"> |
| | | <image data-type="image" data-url="https://jsek.bnuic.com/home/certificate/kczs.jpg" src="https://jsek.bnuic.com/home/certificate/kczs.jpg" mode="" class="bgImg my_draw_canvas1" /> |
| | | <view class="certificateInfo my_draw_canvas1"> |
| | | <view class="userIcon my_draw_canvas1"> |
| | | <view class="hexagon my_draw_canvas1"> |
| | | <image src="{{userPicture}}" class="img my_draw_canvas1" /> |
| | | </view> |
| | | </view> |
| | | <view class="userName my_draw_canvas1" data-type="text" data-text="{{userName}}">{{userName}}</view> |
| | | <view class="bookName my_draw_canvas1" data-type="text" data-text="{{digitalsData.name}}">{{digitalsData.name}}</view> |
| | | <view class="author my_draw_canvas1" data-type="text" data-text="{{digitalsData.courseLeader}}">{{digitalsData.courseLeader || '-' }}</view> |
| | | <view class="classHours my_draw_canvas1" data-type="text" data-text="{{digitalsData.classHours}}">{{digitalsData.classHours || '-' }}</view> |
| | | <view class="affiliatedUnit my_draw_canvas1" data-type="text" data-text="{{publishingUnit}}">{{publishingUnit || '-'}}</view> |
| | | <view class="studyTime my_draw_canvas1" data-type="text" data-text="{{digitalsData.classHours}}">{{digitalsData.classHours}}</view> |
| | | <view class="website my_draw_canvas1" data-type="text" data-text="{{website}}">{{website}}</view> |
| | | <view class="codeBox my_draw_canvas1"></view> |
| | | <view class="updateDate my_draw_canvas1" wx-if="{{isCertificate}}"> |
| | | {{ moment(isCertificate.updateDate).format('YYYY年MM月') }} |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '2' ? courseLearningClick : courseLearning}}" label="课程学习" value="2" style="{{tabPanelstyle}}">选项三内容</t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '3' ? learningNotesClick : learningNotes}}" label="学习笔记" value="3" style="{{tabPanelstyle}}">选项四内容</t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '4' ? onlineQuestioningClick : onlineQuestioning}}" label="在线提问" value="4" style="{{tabPanelstyle}}">选项五内容</t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '2' ? courseLearningClick : courseLearning}}" label="课程学习" value="2"> |
| | | <view class="course-content"> |
| | | <view class="tabsSelect"> |
| | | <view class="{{selectActive == 'learn' ? 'tabs-item selectActive' : 'tabs-item'}}" bind:tap="selectChange" data-value="{{'learn'}}">学习内容</view> |
| | | <view class="{{selectActive == 'test' ? 'tabs-item selectActive' : 'tabs-item'}}" bind:tap="selectChange" data-value="{{'test'}}">在线测试</view> |
| | | </view> |
| | | <view class="list-box"> |
| | | <view wx:if="{{selectActive == 'learn'}}"> |
| | | <view wx:if="{{relationTextBook}}" class="textBook"> |
| | | <view class="textTile"> |
| | | <image src="/static/images/bookService/detail/shuzijiaocai.png" mode="" class="leftImg" /> |
| | | <view>数字教材</view> |
| | | </view> |
| | | <view class="reabtn" bind:tap="readTextBook"> |
| | | <image src="/static/images/digitalCourses/shidu@2x.png" class="readImage"></image> |
| | | <view>{{isTextBookBuy ? '阅读' : '试看'}}</view> |
| | | </view> |
| | | </view> |
| | | <view wx:if="{{learnList.length > 0}}"> |
| | | <tree id="test-tree" openIds="{{openTeachids}}" bookInfo="{{digitalsData}}" treeList="{{learnList}}" isBuy="{{isBuy}}"> |
| | | </tree> |
| | | </view> |
| | | <view wx:if="{{learnList.length == 0}}" class="noData"> |
| | | <empty /> |
| | | </view> |
| | | </view> |
| | | <view wx:if="{{selectActive == 'test'}}"> |
| | | <view class="testBtnBox"> |
| | | <view class="textTile">共{{testCount}}个</view> |
| | | <view class="note-btn"> |
| | | <t-button theme="primary" class="make-note" bind:tap="goMycollect" data-answerType="errorQuestion" style="width: 220rpx"> |
| | | <view slot="content" class="btn-content"> |
| | | <image src="/static/images/bookService/detail/cuoti.png" /> |
| | | <text class="note-btn-text">我的错题</text> |
| | | </view> |
| | | </t-button> |
| | | <t-button theme="primary" class="make-note" bind:tap="goMycollect" data-answerType="collectQuestion" style="width: 220rpx; margin-left: 10rpx"> |
| | | <view slot="content" class="btn-content"> |
| | | <image src="/static/images/bookService/detail/wodeshoucang.png" /> |
| | | <text class="note-btn-text">我的收藏</text> |
| | | </view> |
| | | </t-button> |
| | | </view> |
| | | </view> |
| | | <testTree id="tree" openIds="{{openTeachids}}" bookInfo="{{digitalsData}}" tab="{{tab}}" treeList="{{testList}}" isBuy="{{isBuy}}"></testTree> |
| | | <view wx:if="{{testList.length == 0}}" class="noData"> |
| | | <empty /> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '3' ? learningNotesClick : learningNotes}}" label="学习笔记" value="3"> |
| | | <view class="course-content"> |
| | | <note bookInfo="{{digitalsData}}" id="note" class="note-list"></note> |
| | | <!-- <view class="topBox"> |
| | | <view></view> |
| | | <view class="note-btn"> |
| | | <t-button theme="primary" class="make-note" bind:tap="openDialog" style="width: 200rpx"> |
| | | <view slot="content" class="btn-content"> |
| | | <image src="/static/images/bookService/detail/makeNote.png" /> |
| | | <text class="note-btn-text">记笔记</text> |
| | | </view> |
| | | </t-button> |
| | | </view> |
| | | </view> --> |
| | | </view> |
| | | </t-tab-panel> |
| | | <t-tab-panel icon="{{ tabValue == '4' ? onlineQuestioningClick : onlineQuestioning}}" label="在线提问" value="4"> |
| | | <view class="course-content"> |
| | | <question bookInfo="{{digitalsData}}" id="question" class="note-list"></question> |
| | | <!-- <view class="topBox"> |
| | | <view>共{{questionTotalCount}}个</view> |
| | | <view class="note-btn"> |
| | | <t-button theme="primary" class="make-note" bind:tap="openDialog" style="width: 240rpx"> |
| | | <view slot="content" class="btn-content"> |
| | | <image src="/static/images/digitalCourses/bianji.png" /> |
| | | <text class="note-btn-text">提问</text> |
| | | </view> |
| | | </t-button> |
| | | </view> |
| | | </view> |
| | | <view class="list-box"> |
| | | <view wx:for="{{onlineQuestionsList}}" wx:key="index" wx:for-item="item" class="list-Item"> |
| | | <view class="quesTitle"> |
| | | <view class="titleLeft"> |
| | | <view class="icon"></view> |
| | | <text>{{ item.title }}</text> |
| | | </view> |
| | | <view class="titleRight"> |
| | | {{item.createDate}} |
| | | </view> |
| | | </view> |
| | | <view class="noteContent"> |
| | | {{ item.back }} |
| | | </view> |
| | | </view> |
| | | </view> --> |
| | | </view> |
| | | </t-tab-panel> |
| | | <t-tab-panel icon="{{tabValue == '5' ? testResourceClickIocn : testResourceIocn}}" value="5" label="相关课程" style="{{tabPanelstyle}}"> |
| | | <view class="rubricBox"> |
| | | <view class="rubricimgBox"> |
| | | <image src="/static/images/digitalTextbooks/Link@3x.png" mode="aspectFit" /> |
| | | </view> |
| | | <view class="basic"> 相关课程</view> |
| | | </view> |
| | | <view class="noDataBox" wx:if="{{relatedBookData.length <= 0}}"> |
| | | <empty /> |
| | | </view> |
| | | <view class="correlation" wx:else> |
| | | <view style="margin-bottom: 30rpx" wx:for="{{relatedBookData}}" wx:key="index" wx:for-item="item" wx:for-index="index" data-item="{{item}}" bind:tap="onCorrelationBook"> |
| | | <view class="correlationImage"> |
| | | <image src="{{item.icon}}" mode="aspectFit" /> |
| | | <img wx:if="{{item.icon == ''}}" src="/static/images/default-book-img.png" alt="" /> |
| | | </view> |
| | | <view class="correlationName">{{item.name}}</view> |
| | | <view class="correlationAuthor">{{digitalsData.author}}</view> |
| | | </view> |
| | | </view> |
| | | </t-tab-panel> |
| | | </t-tabs> |
| | | |
| | | </view> |
| | | |
| | | |
| | | <view class="box-bottom"> |
| | | |
| | | |
| | | |
| | | <view class="application" bind:tap="onCertificate"> |
| | | <view class="applicationImageBox"> |
| | | <image src="/static/images/digitalCourses/zhengshushenqing@2x.png" mode="" /> |
| | | <view class="bottom-btn" bind:tap="setCoolect"> |
| | | <view class="collectionImage"> |
| | | <image wx:if="{{!digitalsData.isFavourite}}" src="/static/images/digitalTextbooks/wodeshoucang@2x.png" /> |
| | | <image wx:else src="/static/images/bookService/detail/collecting.png" /> |
| | | </view> |
| | | <view>证书申请</view> |
| | | <view class="btn-text"> |
| | | 收藏 |
| | | </view> |
| | | </view> |
| | | |
| | | <view class="shopCarColor" bind:tap="addBookShopcCar" wx:if="{{!isBuy}}">加入购物车</view> |
| | | <view class="buyColor" bind:tap="buyBtn" wx:if="{{!isBuy}}">立即购买</view> |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | <view class="bottom-btn" bind:tap="onCertificate"> |
| | | <view class="applicationImageBox"> |
| | | <image src="/static/images/digitalCourses/zhengshushenqing@2x.png" /> |
| | | </view> |
| | | <view class="btn-text">证书申请</view> |
| | | </view> |
| | | <view class="bottom-btn shopCarColor" bind:tap="addBookShopcCar" wx:if="{{!isBuy && digitalsData.price != '0.00' }}">加入购物车</view> |
| | | <view class="bottom-btn buyColor" bind:tap="buyBtn" wx:if="{{!isBuy && digitalsData.price != '0.00'}}">立即购买</view> |
| | | <view class="bottom-btn buyColor" bind:tap="buyBtn" wx:if="{{!isBuy && digitalsData.price == '0.00'}}"> 免费领取</view> |
| | | </view> |
| | | <t-toast id="t-toast" /> |
| | | </view> |
| | | </scroll-view> |
| | | |
| | | |
| | | </scroll-view> |
| | | </view> |
| | | <!-- 弹窗 --> |
| | | <view wx:if="{{dialogBox}}"> |
| | | <view class="popup-box" bindtap="closeDialog"></view> |
| | | <view class="info-center" style="top:{{height*0.4}}px;"> |
| | | <view class="info-center"> |
| | | <view> |
| | | <view class="row-info"> |
| | | <view class="body"> |
| | | <view class="dialog-title">学习证书申请</view> |
| | | <view style="width: 100%; height: 2rpx; background-color: #F4F4F4;"></view> |
| | | <view style="width: 100%; height: 2rpx; background-color: #f4f4f4"></view> |
| | | <view class="input-box"> |
| | | <t-input style="{{inputStyle}}" class="input" placeholder="请输入真实姓名" value="{{input}}" bind:change="inputChange"></t-input> |
| | | <t-input class="input" borderless placeholder="请输入真实姓名" value="{{userInfo.fullName}}" bind:change="onFullNameInput"></t-input> |
| | | </view> |
| | | <view class="contentImg"> |
| | | <image src="{{userInfo.userPicture}}" mode="aspectFill" /> |
| | | </view> |
| | | <view class="buttonBox"> |
| | | <t-button size="small" class="right-btn" bind:tap="uploadPicture">上传照片</t-button> |
| | | </view> |
| | | </view> |
| | | <view class="row-btn"> |
| | |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | </view> |
| | | |
| | | <t-image-viewer usingCustomNavbar deleteBtn="{{deleteBtn}}" closeBtn="{{closeBtn}}" showIndex="{{showIndex}}" visible="{{visible}}" images="{{images}}" bind:change="onChange" bind:close="onClose"></t-image-viewer> |