|
@@ -1,67 +1,543 @@
|
|
|
+<style>
|
|
|
+.ping .ant-modal-content .ant-modal-footer {
|
|
|
+ display: none !important;
|
|
|
+}
|
|
|
+.ping .ant-list-item-content {
|
|
|
+ justify-content: space-between;
|
|
|
+ cursor: pointer;
|
|
|
+}
|
|
|
+.ping-list .detele {
|
|
|
+ display: none;
|
|
|
+}
|
|
|
+/* .ping-list:hover span {
|
|
|
+ display: block;
|
|
|
+} */
|
|
|
+.ant-modal-body {
|
|
|
+ padding-top: 0px;
|
|
|
+}
|
|
|
+li {
|
|
|
+ list-style-type: none;
|
|
|
+}
|
|
|
+</style>
|
|
|
+<style lang="scss" scoped>
|
|
|
+.actor-photo-list {
|
|
|
+ display: flex;
|
|
|
+ padding-left: 0;
|
|
|
+ li {
|
|
|
+ width: 25%;
|
|
|
+ margin: 10px;
|
|
|
+ position: relative;
|
|
|
+ height: 250px;
|
|
|
+ border: 1px solid #f2f2f2;
|
|
|
+ img,
|
|
|
+ video {
|
|
|
+ width: 100%;
|
|
|
+ margin-top: auto;
|
|
|
+ margin-bottom: auto;
|
|
|
+ top: 0;
|
|
|
+ bottom: 0;
|
|
|
+ position: absolute;
|
|
|
+ max-height: 250px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
|
|
<template>
|
|
|
<div :class="[type === 'horizantal' ? 'vm-card-horizantal' : 'vm-card-vertical' , 'vm-panel']">
|
|
|
- <div class="card-img" style="height: 250px" :style="{backgroundImage: 'url(' +img+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}">
|
|
|
+ <div
|
|
|
+ class="card-img"
|
|
|
+ style="height:250px"
|
|
|
+ :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
|
|
|
+ >
|
|
|
<!-- <img :src="img" alt="" height="250"> -->
|
|
|
<div v-if="editable && type == 'vertical'" class="control">
|
|
|
<span class="edit">
|
|
|
<a :href="editUrl">
|
|
|
- <a-icon type="edit"></a-icon>
|
|
|
- </a>
|
|
|
+ <a-icon type="edit" @click="handleDetail(record)"></a-icon>
|
|
|
+ </a>
|
|
|
</span>
|
|
|
<span class="delete">
|
|
|
- <a-icon type="message"></a-icon>
|
|
|
+ <a-icon type="message" @click="getComment"></a-icon>
|
|
|
</span>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="card-desc panel-body">
|
|
|
<h2>{{ title }}</h2>
|
|
|
<p>{{ desc }}</p>
|
|
|
- <a :href="detailUrl">
|
|
|
- 详情 >
|
|
|
- </a>
|
|
|
+ <a :href="detailUrl" @click="getDetail">详情 ></a>
|
|
|
</div>
|
|
|
+ <a-modal title="评论" v-model="visible" class="ping">
|
|
|
+ <div>
|
|
|
+ <div style="height:300px;overflow:auto">
|
|
|
+ <a-list
|
|
|
+ v-if="comments.length"
|
|
|
+ :dataSource="comments"
|
|
|
+ :header="`${comments.length} ${comments.length > 1 ? 'replies' : 'reply'}`"
|
|
|
+ itemLayout="horizontal"
|
|
|
+ >
|
|
|
+ <a-list-item slot="renderItem" slot-scope="item, index" class="ping-list">
|
|
|
+ <a-comment
|
|
|
+ :author="item.createBy"
|
|
|
+ :avatar="item.avatar"
|
|
|
+ :content="item.comment"
|
|
|
+ :datetime="item.createTime"
|
|
|
+ ></a-comment>
|
|
|
+ <span class="detele" style="margin:20px;color:red;" @click="detele(item,index)">删除</span>
|
|
|
+ </a-list-item>
|
|
|
+ </a-list>
|
|
|
+ <div v-else style="height:300px;text-align:center;line-height:300px">暂无评论</div>
|
|
|
+ </div>
|
|
|
+ <a-comment>
|
|
|
+ <!-- <a-avatar
|
|
|
+ slot="avatar"
|
|
|
+ :src="loginInfo.value.avatar"
|
|
|
+ alt="Han Solo"
|
|
|
+ />-->
|
|
|
+ <img :src="loginInfo.value.avatar" alt slot="avatar" />
|
|
|
+ <div slot="content">
|
|
|
+ <a-form-item>
|
|
|
+ <a-textarea :rows="4" @change="handleChange" :value="value"></a-textarea>
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item>
|
|
|
+ <a-button
|
|
|
+ htmlType="submit"
|
|
|
+ :loading="submitting"
|
|
|
+ @click="handleSubmit"
|
|
|
+ type="primary"
|
|
|
+ >添加</a-button>
|
|
|
+ </a-form-item>
|
|
|
+ </div>
|
|
|
+ </a-comment>
|
|
|
+ </div>
|
|
|
+ </a-modal>
|
|
|
+
|
|
|
+ <a-modal title="详情" v-model="detail" class="ping" :width="800">
|
|
|
+ <a-tabs defaultActiveKey="1" @change="callback" v-model="indexDetail">
|
|
|
+ <a-tab-pane tab="演员信息" key="1">
|
|
|
+ <div style="display:flex;flex-direction:row;height:200px;">
|
|
|
+ <div
|
|
|
+ style="height:200px;width:30%;border:1px solid #f2f2f2;"
|
|
|
+ :style="{backgroundImage: img?'url(' +img+')':'url('+noImgUrl+')', backgroundSize:'contain', backgroundRepeat: 'no-repeat',backgroundPosition:'center center'}"
|
|
|
+ ></div>
|
|
|
+ <div style="flex:1;margin:15px">
|
|
|
+ <a-form :form="form">
|
|
|
+ <a-form-item label="姓名" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
|
|
|
+ <span>{{form.name}}</span>
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item label="性别" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
|
|
|
+ <span>{{form.sex==1?"男":"女"}}</span>
|
|
|
+ </a-form-item>
|
|
|
+ <a-form-item label="出生年月" :label-col="{ span: 5 }" :wrapper-col="{ span: 12 }">
|
|
|
+ <span>{{form.birthday}}</span>
|
|
|
+ </a-form-item>
|
|
|
+ </a-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div style="margin-top:20px">
|
|
|
+ <a-collapse accordion>
|
|
|
+ <a-collapse-panel header="个人信息" key="1">
|
|
|
+ <p>{{form.speciality}}</p>
|
|
|
+ </a-collapse-panel>
|
|
|
+ </a-collapse>
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ <a-tab-pane tab="演员图集" key="2" forceRender>
|
|
|
+ <div>
|
|
|
+ <a type="primary" style="margin-left:10px" @click="addPhoto=true">新增图集</a>
|
|
|
+ <ul class="actor-photo-list">
|
|
|
+ <li v-for="(item,index) of photoList" :key="index">
|
|
|
+ <a-icon
|
|
|
+ type="close-circle"
|
|
|
+ style="position:absolute;top:-5px;right:-5px;color:red;z-index:10;cursor: pointer;"
|
|
|
+ @click="deteleImg(item.id)"
|
|
|
+ />
|
|
|
+ <img :src="item.photoUrl" alt />
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div style="text-align:right">
|
|
|
+ <a-pagination
|
|
|
+ showQuickJumper
|
|
|
+ :total="total"
|
|
|
+ @change="pageChange"
|
|
|
+ :pageSize.sync="pageSize"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ <a-tab-pane tab="演员作品" key="3">
|
|
|
+ <div>
|
|
|
+ <a type="primary" style="margin-left:10px" @click="addVideo=true">新增作品</a>
|
|
|
+ <ul class="actor-photo-list">
|
|
|
+ <li v-for="(item,index) of videoList" :key="index">
|
|
|
+ <a-icon
|
|
|
+ type="close-circle"
|
|
|
+ style="position:absolute;top:-5px;right:-5px;color:red;z-index:10;cursor: pointer;"
|
|
|
+ @click="deteleVideo(item.id)"
|
|
|
+ />
|
|
|
+ <video
|
|
|
+ class="video"
|
|
|
+ :src="item.videoUrl"
|
|
|
+ controls="controls"
|
|
|
+ style="min-height:160px"
|
|
|
+ >您的浏览器不支持 video 标签。</video>
|
|
|
+ </li>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ <div style="text-align:right">
|
|
|
+ <a-pagination
|
|
|
+ showQuickJumper
|
|
|
+ :total="videoTotal"
|
|
|
+ @change="pageChange"
|
|
|
+ :pageSize.sync="pageSize"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ </a-modal>
|
|
|
+ <!-- 新增图集 -->
|
|
|
+ <a-modal
|
|
|
+ v-model="addPhoto"
|
|
|
+ title="新增图集"
|
|
|
+ @ok="handleOk('photo')"
|
|
|
+ @cancel="handleCancel('photo')"
|
|
|
+ >
|
|
|
+ <upload-to-ali
|
|
|
+ style="margin:10px"
|
|
|
+ v-model="imageUrl"
|
|
|
+ :customDomain="customDomain"
|
|
|
+ preview
|
|
|
+ :region="region"
|
|
|
+ :bucket="bucket"
|
|
|
+ :accept="acceptImage"
|
|
|
+ :max="1"
|
|
|
+ :size="1024000"
|
|
|
+ :accessKeyId="accessKeyId"
|
|
|
+ :accessKeySecret="accessKeySecret"
|
|
|
+ ></upload-to-ali>
|
|
|
+ </a-modal>
|
|
|
+ <!-- 新增作品 -->
|
|
|
+ <a-modal
|
|
|
+ v-model="addVideo"
|
|
|
+ title="新增作品"
|
|
|
+ @ok="handleOk('video')"
|
|
|
+ @cancel="handleCancel('video')"
|
|
|
+ >
|
|
|
+ <upload-to-ali
|
|
|
+ style="margin:10px"
|
|
|
+ v-model="videoUrl"
|
|
|
+ :customDomain="customDomain"
|
|
|
+ preview
|
|
|
+ :region="region"
|
|
|
+ :bucket="bucket"
|
|
|
+ :accept="acceptVideo"
|
|
|
+ :max="1"
|
|
|
+ :size="1024000"
|
|
|
+ :accessKeyId="accessKeyId"
|
|
|
+ :accessKeySecret="accessKeySecret"
|
|
|
+ ></upload-to-ali>
|
|
|
+ </a-modal>
|
|
|
+ <actor-modal ref="modalForm" @ok="modalFormOk" @updateList="updateList" @close="closeVideo"></actor-modal>
|
|
|
</div>
|
|
|
</template>
|
|
|
<script>
|
|
|
- export default {
|
|
|
- name: 'VmCard',
|
|
|
- props: {
|
|
|
- type: {
|
|
|
- type: String,
|
|
|
- default: 'vertical'
|
|
|
- },
|
|
|
- editable: {
|
|
|
- type: Boolean,
|
|
|
- default: false
|
|
|
- },
|
|
|
- title: {
|
|
|
- type: String,
|
|
|
- default: 'Title'
|
|
|
- },
|
|
|
- img: {
|
|
|
- type: String,
|
|
|
- default: require('@/assets/img/img-1.jpg')
|
|
|
- },
|
|
|
- desc: {
|
|
|
- type: String,
|
|
|
- default: 'Lorem Ipsum is simply dummy text of the printing and typesetting industry,Lorem Ipsum has been the industry\'s standard dummy text ever since the 1500s'
|
|
|
+import moment from 'moment'
|
|
|
+import {
|
|
|
+ actorDetail,
|
|
|
+ actorCommentList,
|
|
|
+ actorCommentAdd,
|
|
|
+ actorCommentDetele,
|
|
|
+ actorPhotoList,
|
|
|
+ actorVideoList,
|
|
|
+ actorPhotoDelete,
|
|
|
+ actorVideoDelete,
|
|
|
+ actorPhotoAdd,
|
|
|
+ actorVideoAdd
|
|
|
+} from '@/api/actor'
|
|
|
+import actorModal from './ActorModal'
|
|
|
+import UploadToAli from '@femessage/upload-to-ali'
|
|
|
+import { JeecgListMixin } from '@/mixins/JeecgListMixin'
|
|
|
+import { closeAllVideoFun } from '@/utils/videoControl'
|
|
|
+export default {
|
|
|
+ name: 'VmCard',
|
|
|
+ mixins: [JeecgListMixin],
|
|
|
+ components: {
|
|
|
+ actorModal,
|
|
|
+ UploadToAli
|
|
|
+ },
|
|
|
+ props: {
|
|
|
+ type: {
|
|
|
+ type: String,
|
|
|
+ default: 'vertical'
|
|
|
+ },
|
|
|
+ editable: {
|
|
|
+ type: Boolean,
|
|
|
+ default: false
|
|
|
+ },
|
|
|
+ title: {
|
|
|
+ type: String,
|
|
|
+ default: 'Title'
|
|
|
+ },
|
|
|
+ img: {
|
|
|
+ type: String,
|
|
|
+ default: require('@/assets/img/noImg.png')
|
|
|
+ },
|
|
|
+ desc: {
|
|
|
+ type: String,
|
|
|
+ default:
|
|
|
+ "Lorem Ipsum is simply dummy text of the printing and typesetting industry,Lorem Ipsum has been the industry's standard dummy text ever since the 1500s"
|
|
|
+ },
|
|
|
+ detailUrl: {
|
|
|
+ type: String,
|
|
|
+ default: '#'
|
|
|
+ },
|
|
|
+ editUrl: {
|
|
|
+ type: String,
|
|
|
+ default: '#'
|
|
|
+ },
|
|
|
+ id: {
|
|
|
+ default() {
|
|
|
+ return 0
|
|
|
+ }
|
|
|
+ },
|
|
|
+ record: {
|
|
|
+ default() {
|
|
|
+ return {}
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ data: function() {
|
|
|
+ return {
|
|
|
+ addPhoto: false,
|
|
|
+ addVideo: false,
|
|
|
+ indexDetail: '1',
|
|
|
+ to: null,
|
|
|
+ comments: [],
|
|
|
+ submitting: false,
|
|
|
+ value: '',
|
|
|
+ moment,
|
|
|
+ visible: false,
|
|
|
+ detail: false,
|
|
|
+ customDomain: '',
|
|
|
+ region: 'oss-cn-beijing',
|
|
|
+ bucket: 'ctop-media',
|
|
|
+ acceptVideo: 'video/mpeg,video/mp4',
|
|
|
+ acceptImage: 'image/jpeg,image/jpg,image/png',
|
|
|
+ accessKeyId: 'LTAIbNbqWzSOklQV',
|
|
|
+ accessKeySecret: '1rkPz7JNoXk8sJevPaeYHWqfkQXBGh',
|
|
|
+ form: {
|
|
|
+ name: '',
|
|
|
+ birthday: '',
|
|
|
+ sex: null,
|
|
|
+ speciality: ''
|
|
|
},
|
|
|
- detailUrl: {
|
|
|
- type: String,
|
|
|
- default: '#'
|
|
|
+ noImgUrl: require('@/assets/img/noImg.png'),
|
|
|
+ loginInfo: JSON.parse(localStorage.getItem('pro__Login_Userinfo')),
|
|
|
+ photoList: [],
|
|
|
+ imageUrl: '',
|
|
|
+ videoUrl: '',
|
|
|
+ total: 1,
|
|
|
+ videoTotal: 1,
|
|
|
+ pageSize: 4,
|
|
|
+ url: {
|
|
|
+ list: '/ctop/actor/list'
|
|
|
},
|
|
|
- editUrl: {
|
|
|
- type: String,
|
|
|
- default: '#'
|
|
|
+ columns: [
|
|
|
+ {
|
|
|
+ title: 'ID',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'id'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '姓名',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'name'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '生日',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'birthday'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '性别',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'sex_dictText'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '特长',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'speciality'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '创建时间',
|
|
|
+ align: 'center',
|
|
|
+ dataIndex: 'createTime'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '操作',
|
|
|
+ dataIndex: 'action',
|
|
|
+ align: 'center',
|
|
|
+ scopedSlots: { customRender: 'action' }
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ currentPage: 1,
|
|
|
+ videoList: []
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ updateList() {
|
|
|
+ this.$emit('updateList')
|
|
|
+ },
|
|
|
+ pageChange: function(page) {
|
|
|
+ console.log(page)
|
|
|
+ this.currentPage = page
|
|
|
+ if (this.indexDetail == '2') {
|
|
|
+ this.getPhoto()
|
|
|
+ } else if (this.indexDetail == '3') {
|
|
|
+ this.getVideo()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleSubmit() {
|
|
|
+ if (!this.value) {
|
|
|
+ return
|
|
|
}
|
|
|
+
|
|
|
+ this.submitting = true
|
|
|
+
|
|
|
+ actorCommentAdd({ actorId: this.id, comment: this.value }).then(res => {
|
|
|
+ this.submitting = false
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.getComment()
|
|
|
+ this.value = ''
|
|
|
+ }
|
|
|
+ })
|
|
|
+ // setTimeout(() => {}, 1000)
|
|
|
+ },
|
|
|
+ handleChange(e) {
|
|
|
+ this.value = e.target.value
|
|
|
+ },
|
|
|
+ getDetail() {
|
|
|
+ this.indexDetail = '1'
|
|
|
+ this.detail = true
|
|
|
+ actorDetail({ actorId: this.id }).then(res => {
|
|
|
+ console.log(res)
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.form.name = res.result.name
|
|
|
+ this.form.birthday = res.result.birthday
|
|
|
+ this.form.sex = res.result.sex
|
|
|
+ this.form.speciality = res.result.speciality
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- data: function () {
|
|
|
- return {
|
|
|
- to:null
|
|
|
+ getComment() {
|
|
|
+ this.visible = true
|
|
|
+ this.comments = []
|
|
|
+ actorCommentList({ actorId: this.id }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ console.log(res)
|
|
|
+ this.comments = res.result.records.reverse()
|
|
|
}
|
|
|
+ })
|
|
|
},
|
|
|
- methods: {
|
|
|
+ detele(item, index) {
|
|
|
+ console.log(item, index)
|
|
|
|
|
|
+ actorCommentDetele({ id: item.id }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ this.comments.splice(index, 1)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ closeVideo() {
|
|
|
+ closeAllVideoFun()
|
|
|
+ },
|
|
|
+ callback(key) {
|
|
|
+ console.log(key)
|
|
|
+ if (key == '2') {
|
|
|
+ this.closeVideo()
|
|
|
+ this.currentPage = 1
|
|
|
+ this.getPhoto()
|
|
|
+ } else if (key == '3') {
|
|
|
+ this.currentPage = 1
|
|
|
+ this.getVideo()
|
|
|
+ } else if (key == '1') {
|
|
|
+ this.closeVideo()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getPhoto() {
|
|
|
+ actorPhotoList({ pageNo: this.currentPage, pageSize: 4, actorId: this.id }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ console.log(res)
|
|
|
+ this.photoList = res.result.records
|
|
|
+ this.total = res.result.total
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getVideo() {
|
|
|
+ actorVideoList({ pageNo: this.currentPage, pageSize: 4, actorId: this.id }).then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ console.log(res)
|
|
|
+ this.videoList = res.result.records
|
|
|
+ this.videoTotal = res.result.total
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deteleImg(id) {
|
|
|
+ actorPhotoDelete({ id: id }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ console.log(res)
|
|
|
+ this.getPhoto()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deteleVideo(id) {
|
|
|
+ actorPhotoDelete({ id: id }).then(res => {
|
|
|
+ if (res.code == 200) {
|
|
|
+ console.log(res)
|
|
|
+ this.getPhoto()
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handleOk(type) {
|
|
|
+ const that = this
|
|
|
+ if (type == 'photo') {
|
|
|
+ actorPhotoAdd({ actorId: that.id, photoUrl: that.imageUrl })
|
|
|
+ .then(res => {
|
|
|
+ if (res.success) {
|
|
|
+ this.getPhoto()
|
|
|
+ this.handleCancel('photo')
|
|
|
+ } else {
|
|
|
+ that.$message.warning(res.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ that.confirmLoading = false
|
|
|
+ that.handleCancel('photo')
|
|
|
+ })
|
|
|
+ } else {
|
|
|
+ actorVideoAdd({ actorId: that.id, videoUrl: that.videoUrl })
|
|
|
+ .then(res => {
|
|
|
+ if (res.success) {
|
|
|
+ this.getVideo()
|
|
|
+ this.handleCancel('video')
|
|
|
+ } else {
|
|
|
+ that.$message.warning(res.message)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ that.confirmLoading = false
|
|
|
+ that.handleCancel('video')
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleCancel(type) {
|
|
|
+ if (type == 'photo') {
|
|
|
+ this.imageUrl = ''
|
|
|
+ this.addPhoto = false
|
|
|
+ } else {
|
|
|
+ this.videoUrl = ''
|
|
|
+ this.addVideo = false
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</script>
|