|
@@ -2,24 +2,30 @@
|
|
|
<div class="patent-image">
|
|
|
<div class="block">
|
|
|
<div class="demonstration">图片大小:</div>
|
|
|
- <el-slider v-model="value" @change="changeWidth" :min="25" :max="100" style="padding-left:90px"></el-slider>
|
|
|
+ <el-slider v-model="value" @change="changeWidth" :min="25" :max="100" style="padding-left:90px"></el-slider>
|
|
|
</div>
|
|
|
<div class="imageCard">
|
|
|
- <el-card class="preview" v-for="(item, index) in patent.image" :key="index" shadow="hover" :style="{width:width}">
|
|
|
- <div slot="header" class="card-header" v-if="projectId">
|
|
|
- <span></span>
|
|
|
- <el-button :disabled="!$permission('/workspace/details/figureDelete')" class="delete" type="text" @click="handleDelete(item)">删除</el-button>
|
|
|
- <el-button :disabled="!$permission('/workspace/details/figuremodify')" class="edit" type="text" @click="handleEdit(item)">编辑</el-button>
|
|
|
- </div>
|
|
|
- <div class="text-align_center">
|
|
|
- <el-image :src="!projectId?item.url:getImagePath(item.url)" :preview-src-list="srcList" style="height: 100%; min-height:125px;"></el-image>
|
|
|
- </div>
|
|
|
+ <el-card class="preview" v-for="(item, index) in patent.image" :key="index" shadow="hover" :style="{ width: width }">
|
|
|
+ <div slot="header" class="card-header" v-if="projectId">
|
|
|
+ <span></span>
|
|
|
+ <el-button :disabled="!$permission('/workspace/details/figureDelete')" class="delete" type="text"
|
|
|
+ @click="handleDelete(item)">删除</el-button>
|
|
|
+ <el-button :disabled="!$permission('/workspace/details/figuremodify')" class="edit" type="text"
|
|
|
+ @click="handleEdit(item)">编辑</el-button>
|
|
|
+ </div>
|
|
|
+ <div class="text-align_center">
|
|
|
+ <el-image :src="outside ? item : $commonJS.checkViewer(item)" :preview-src-list="srcList"
|
|
|
+ style="height: 100%; min-height:125px;"></el-image>
|
|
|
+ </div>
|
|
|
</el-card>
|
|
|
</div>
|
|
|
|
|
|
- <div type="primary" class="up" v-if="$permission('/workspace/details/figureUpdata')&& projectId && $r(projectId,[1,2])" @click="handleAdd">上传图片</div>
|
|
|
+ <div type="primary" class="up"
|
|
|
+ v-if="$permission('/workspace/details/figureUpdata') && projectId && $r(projectId, [1, 2])" @click="handleAdd">上传图片
|
|
|
+ </div>
|
|
|
|
|
|
- <el-dialog :title="title" :visible.sync="visible" width="500px" append-to-body destroy-on-close :before-close="close" top="22vh">
|
|
|
+ <el-dialog :title="title" :visible.sync="visible" width="500px" append-to-body destroy-on-close :before-close="close"
|
|
|
+ top="22vh">
|
|
|
<el-form :model="form">
|
|
|
<el-form-item label="是否设置为摘要附图">
|
|
|
<el-radio-group v-model="form.status">
|
|
@@ -28,7 +34,8 @@
|
|
|
</el-radio-group>
|
|
|
</el-form-item>
|
|
|
<el-form-item label="上传图片">
|
|
|
- <el-upload class="upload-file" drag action="#" :auto-upload="false" :show-file-list="false" :on-change="onChange">
|
|
|
+ <el-upload class="upload-file" drag action="#" :auto-upload="false" :show-file-list="false"
|
|
|
+ :on-change="onChange">
|
|
|
<i :class="!file ? 'el-icon-upload' : 'el-icon-refresh'"></i>
|
|
|
<div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div>
|
|
|
<div class="el-upload__tip" slot="tip"></div>
|
|
@@ -49,8 +56,8 @@ export default {
|
|
|
mixins: [patentDetails],
|
|
|
data() {
|
|
|
return {
|
|
|
- value:25,
|
|
|
- width:"25%",
|
|
|
+ value: 25,
|
|
|
+ width: "25%",
|
|
|
srcList: [],
|
|
|
url: '',
|
|
|
title: '',
|
|
@@ -61,49 +68,60 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
watch: {
|
|
|
- patentId() {
|
|
|
- this.srcList = this.patent.image.map(item => this.getImagePath(item.url))
|
|
|
- },
|
|
|
- 'patent'(){
|
|
|
-
|
|
|
- },
|
|
|
- patentNo(){
|
|
|
- if(!this.projectId){
|
|
|
+ patentNo() {
|
|
|
+ if (this.outside) {
|
|
|
this.getData()
|
|
|
}
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
- if(this.patent.image){
|
|
|
- this.srcList = this.patent.image.map(item => this.getImagePath(item.url))
|
|
|
- }else{
|
|
|
- if(!this.projectId){
|
|
|
- this.getData()
|
|
|
- }
|
|
|
+ // outside为true是外部
|
|
|
+ if (this.outside) {//外部
|
|
|
+ this.getData()
|
|
|
+ } else {
|
|
|
+ this.refresh()
|
|
|
}
|
|
|
-
|
|
|
- // console.log(this.patent)
|
|
|
},
|
|
|
methods: {
|
|
|
- getData(){
|
|
|
+ // 获得外部的附图
|
|
|
+ getData() {
|
|
|
var params = {
|
|
|
- patentCell:4,
|
|
|
- patentNo:this.patent.publicNo,
|
|
|
- appNo:this.patent.applicationNo,
|
|
|
+ appNo: this.patent.rowApplicationNo,
|
|
|
+ }
|
|
|
+ this.$api.getExternalFigure(params).then(response => {
|
|
|
+ if (response.code == 200) {
|
|
|
+ if (response.data.length>0) {
|
|
|
+ this.$set(this.patent, 'image', response.data)
|
|
|
+ this.$set(this, 'srcList', response.data)
|
|
|
+ } else {
|
|
|
+ this.$set(this.patent, 'image', [])
|
|
|
+ this.$set(this, 'srcList', [])
|
|
|
}
|
|
|
- this.$api.getPatentPart(params).then(response=>{
|
|
|
- if(response.code == 200){
|
|
|
- if(Object.keys(response.data).length>0 && response.data.image.length>0){
|
|
|
- this.$set(this.patent,'image',response.data.image)
|
|
|
- }else{
|
|
|
- this.$set(this.patent,'image',[])
|
|
|
- }
|
|
|
- this.srcList = this.patent.image.map(item=>item.url)
|
|
|
- }
|
|
|
- })
|
|
|
+ }
|
|
|
+ })
|
|
|
},
|
|
|
- changeWidth(){
|
|
|
- this.width=this.value+'%'
|
|
|
+ // 获取内部的附图
|
|
|
+ refresh() {
|
|
|
+ var params = {
|
|
|
+ appNo: this.patent.appNo,
|
|
|
+ }
|
|
|
+ this.$api.getFigure(params).then(response => {
|
|
|
+ if (response.code == 200) {
|
|
|
+ if (response.data.length>0) {
|
|
|
+ this.$set(this.patent, 'image', response.data)
|
|
|
+ let srcList=response.data.map(item=>{
|
|
|
+ return this.$commonJS.checkViewer(item)
|
|
|
+ })
|
|
|
+ this.$set(this, 'srcList', srcList)
|
|
|
+ } else {
|
|
|
+ this.$set(this.patent, 'image', [])
|
|
|
+ this.$set(this, 'srcList', [])
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ changeWidth() {
|
|
|
+ this.width = this.value + '%'
|
|
|
},
|
|
|
close() {
|
|
|
this.visible = false
|
|
@@ -183,9 +201,9 @@ export default {
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
-.up{
|
|
|
+.up {
|
|
|
width: 70px;
|
|
|
- height:30px;
|
|
|
+ height: 30px;
|
|
|
line-height: 30px;
|
|
|
color: rgb(65, 65, 224);
|
|
|
cursor: pointer;
|
|
@@ -193,56 +211,67 @@ export default {
|
|
|
right: 20px;
|
|
|
top: 0px;
|
|
|
}
|
|
|
-.up:hover{
|
|
|
+
|
|
|
+.up:hover {
|
|
|
border-bottom: 1px solid rgb(45, 45, 235);
|
|
|
}
|
|
|
-.block{
|
|
|
+
|
|
|
+.block {
|
|
|
width: 60%;
|
|
|
margin: 0 auto;
|
|
|
}
|
|
|
-.imageCard{
|
|
|
+
|
|
|
+.imageCard {
|
|
|
display: flex;
|
|
|
flex-direction: row;
|
|
|
flex-wrap: wrap;
|
|
|
justify-content: center;
|
|
|
}
|
|
|
-.demonstration{
|
|
|
+
|
|
|
+.demonstration {
|
|
|
float: left;
|
|
|
line-height: 38px;
|
|
|
text-align: center;
|
|
|
}
|
|
|
+
|
|
|
.patent-image {
|
|
|
position: relative;
|
|
|
+
|
|
|
.delete {
|
|
|
float: right;
|
|
|
padding: 3px 0;
|
|
|
color: red;
|
|
|
padding-left: 10px;
|
|
|
}
|
|
|
+
|
|
|
.edit {
|
|
|
float: right;
|
|
|
padding: 3px 0;
|
|
|
}
|
|
|
+
|
|
|
.add {
|
|
|
font-size: 80px;
|
|
|
color: #6b6868;
|
|
|
margin-top: 60px;
|
|
|
}
|
|
|
+
|
|
|
.preview {
|
|
|
// height: 300px;
|
|
|
margin-right: 20px;
|
|
|
cursor: pointer;
|
|
|
text-align: center;
|
|
|
+
|
|
|
.card-header {
|
|
|
height: 20px;
|
|
|
}
|
|
|
+
|
|
|
.el-card__header {
|
|
|
border-bottom: 1px solid #EBEEF5;
|
|
|
font-weight: normal;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
.el-image {
|
|
|
width: 100%;
|
|
|
}
|
|
|
-}
|
|
|
-</style>
|
|
|
+}</style>
|