Skip to content

P
patzn-cloud-web-back-soil
Commit 1e24a10f by lichengming
Options

修改了照片上传和工程项目查询

parent f462e1d2
Showing with 2306 additions and 9 deletions
components/file/entrust-file-manage/FilesList.vue
......@@ -23,7 +23,7 @@
</Upload>
</label>
<Button @click="_batchUpload">批量上传</Button>
<Button @click="_exportList()">列表导出</Button>
<!-- <Button @click="_exportList()">列表导出</Button>-->
<!--一系列操作-->
<!--非表格-->
<!-- <Button v-if="viewStyle === 2 || viewStyle === 3" v-for="item in menusListA" :key="item.name" @click="_radioChange(item.value)"-->
......@@ -301,9 +301,9 @@ export default {
break
}
},
_exportList() {
console.log('列表导出')
},
// _exportList() {
// console.log('列表导出')
// },
_iconClick(res, data) {
switch (res) {
case '下载':
......
components/file/instock-file-manage/BatchUpload.vue 0 → 100644
<template>
<div>
<Modal v-model="showEditModal" :mask-closable="false" width="600">
<p slot="header">{{modalTitle}}</p>
<div>
<Upload
:action="action"
:show-upload-list="false"
:before-upload="_beupload"
multiple
>
<Button type="dashed" icon="ios-cloud-upload-outline">上传文件（小于50MB）</Button>
</Upload>
<div>
<Card :dis-hover="true" style="width: 100%;height: 400px;overflow: auto;">
<p slot="title">已上传文件列表</p>
<div v-for="(item,index) in fileList" :key="index" class="file-upload-list">
<div>
<div class="file-upload-list-cover">
<Icon @click.native.stop="_handleRemove(item)" type="md-trash" style="color: white;font-size: 20px;"></Icon>
</div>
</div>
{{item.fileName }}
</div>
</Card>
</div>
</div>
<div slot="footer" class="btn-width">
<Button @click="showEditModal = false">取消</Button>
<Button @click="_mutipleUpload" :loading="isLoading" type="primary">{{btnName}}</Button>
</div>
</Modal>
</div>
</template>
<script>
/**
* 上传文件，在文件夹下
*/
import axios from 'axios'
import global from '../../../api/config'
import loading from '../../../api/loading'
export default {
data() {
return {
id: '',
ID: '',
action: '',
modalTitle: '',
showEditModal: false,
name: '',
isLoading: false,
btnName: '上传',
fileList: []
}
},
methods: {
_open(obj) {
this.fileList = []
this.showEditModal = true
this.ID = obj
this.modalTitle = '上传文件'
},
_beupload(file) {
// 单个文件上传超过50M时，取消上传
const isLt50M = file.size / 1024 / 1024 < 50
const fileName = file.name.split('.')[0]
if (!isLt50M) {
this.$Message.warning({
content: '文件 ' + fileName + ' 大小超多50M，请重新上传!',
duration: 3
})
this.isLoading = false
} else {
// 动态循环给文件命名
const temObj = {
file: file,
fileName: fileName
}
this.fileList.push(temObj)
}
return false
},
_mutipleUpload() {
if (this.fileList.length > 0 && this.btnName === '上传') {
this.isLoading = true
this.btnName = '上传中...'
// 创建formula对象
const formData = new FormData()
formData.append('entrustId', this.ID)
// 多个文件
for (let i = 0; i < this.fileList.length; i++) {
formData.append('file' + i, this.fileList[i].file)
}
const config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
const instanceFile = axios.create()
instanceFile.defaults.withCredentials = true
// 发起请求
instanceFile
.post(
global.baseURL + '/soil/v1/entrust_annex/upload_bath/' + this.ID,
formData,
{
headers: config
}
)
.then(res => {
if (res.data.code === '1') {
this.$Message.success('上传成功！')
this.showEditModal = false
this.$emit('on-result-change')
} else if (res.data.code === '0') {
loading.toast.show(res.data.code, res.data.msg)
this.$Message.error('操作失败')
}
this._resetLoading()
})
.catch(err => {
console.log(err)
this._resetLoading()
})
} else {
this.$Message.warning('请至少上传一个文件')
this._resetLoading()
}
},
_resetLoading() {
this.isLoading = false
this.btnName = '上传'
},
// 删除对应的上传的文件
_handleRemove(data) {
const index = this.fileList.findIndex(item => item === data)
this.fileList.splice(index, 1)
}
}
}
</script>
<style>
.file-upload-list {
display: inline-block;
width: 100px;
height: 100px;
text-align: center;
line-height: 100px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
margin-right: 4px;
}
.file-upload-list:hover .file-upload-list-cover {
display: block;
}
.file-upload-list-cover {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
}
</style>
components/file/instock-file-manage/BatchUploadSample.vue 0 → 100644
<template>
<div>
<Modal v-model="showEditModal" :mask-closable="false" width="600">
<p slot="header">{{modalTitle}}</p>
<div>
<Upload
:action="action"
:show-upload-list="false"
:before-upload="_beupload"
multiple
>
<Button type="dashed" icon="ios-cloud-upload-outline">上传文件（小于50MB）</Button>
</Upload>
<div>
<Card :dis-hover="true" style="width: 100%;height: 400px;overflow: auto;">
<p slot="title">已上传文件列表</p>
<div v-for="(item,index) in fileList" :key="index" class="file-upload-list">
<div>
<div class="file-upload-list-cover">
<Icon @click.native.stop="_handleRemove(item)" type="md-trash" style="color: white;font-size: 20px;"></Icon>
</div>
</div>
{{item.fileName }}
</div>
</Card>
</div>
</div>
<div slot="footer" class="btn-width">
<Button @click="showEditModal = false">取消</Button>
<Button @click="_mutipleUpload" :loading="isLoading" type="primary">{{btnName}}</Button>
</div>
</Modal>
</div>
</template>
<script>
/**
* 上传文件，在文件夹下
*/
import axios from 'axios'
import global from '../../../api/config'
import loading from '../../../api/loading'
export default {
data() {
return {
id: '',
ID: '',
action: '',
modalTitle: '',
showEditModal: false,
name: '',
isLoading: false,
btnName: '上传',
fileList: []
}
},
methods: {
_open(obj) {
this.fileList = []
this.showEditModal = true
this.ID = obj
this.modalTitle = '文件上传'
},
_beupload(file) {
// 单个文件上传超过50M时，取消上传
const isLt50M = file.size / 1024 / 1024 < 50
const fileName = file.name.split('.')[0]
if (!isLt50M) {
this.$Message.warning({
content: '文件 ' + fileName + ' 大小超多50M，请重新上传!',
duration: 3
})
this.isLoading = false
} else {
// 动态循环给文件命名
const temObj = {
file: file,
fileName: fileName
}
this.fileList.push(temObj)
}
return false
},
_mutipleUpload() {
if (this.fileList.length > 0 && this.btnName === '上传') {
this.isLoading = true
this.btnName = '上传中...'
// 创建formula对象
const formData = new FormData()
formData.append('entrustId', this.ID)
// 多个文件
for (let i = 0; i < this.fileList.length; i++) {
formData.append('file' + i, this.fileList[i].file)
}
const config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
const instanceFile = axios.create()
instanceFile.defaults.withCredentials = true
// 发起请求
instanceFile
.post(
global.baseURL +
'/soil/v1/alone_sample_annex/upload_bath/' +
this.ID,
formData,
{
headers: config
}
)
.then(res => {
if (res.data.code === '1') {
this.$Message.success('上传成功！')
this.showEditModal = false
this.$emit('on-result-change')
} else if (res.data.code === '0') {
loading.toast.show(res.data.code, res.data.msg)
this.$Message.error('操作失败')
}
this._resetLoading()
})
.catch(err => {
console.log(err)
this._resetLoading()
})
} else {
this.$Message.warning('请至少上传一个文件')
this._resetLoading()
}
},
_resetLoading() {
this.isLoading = false
this.btnName = '上传'
},
// 删除对应的上传的文件
_handleRemove(data) {
const index = this.fileList.findIndex(item => item === data)
this.fileList.splice(index, 1)
}
}
}
</script>
<style>
.file-upload-list {
display: inline-block;
width: 100px;
height: 100px;
text-align: center;
line-height: 100px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
margin-right: 4px;
}
.file-upload-list:hover .file-upload-list-cover {
display: block;
}
.file-upload-list-cover {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
}
</style>
components/file/instock-file-manage/FileManage.vue 0 → 100644
<template>
<div>
<Modal v-model="showModal" :width="900" v-drag class="modal-footer-none zIndex-1100">
<p slot="header">{{modalTitle}}</p>
<div>
<FileManageCont ref="fileCont" :flag="flag"></FileManageCont>
</div>
</Modal>
</div>
</template>
<script>
import FileManageCont from './FileManageCont'
export default {
components: {
FileManageCont
},
props: {
// 只能删除自己的标识
flag: null
},
data() {
return {
showModal: false,
modalTitle: '附件管理'
}
},
methods: {
_open(id, key, title) {
this.showModal = true
if (title) {
this.modalTitle = title
} else {
this.modalTitle = '附件管理'
}
this.$refs.fileCont._open(id, key)
}
}
}
</script>
components/file/instock-file-manage/FileManageCont.vue 0 → 100644
<template>
<div>
<!--内容-->
<Row>
<!--查询-->
<Col span="24" style="margin-bottom: -10px">
<Form :label-width="70" inline onsubmit="return false">
<label class="label-sign"></label>
<Form-item label="文件名称:">
<Input v-model="fileName" @on-enter="_search" placeholder="请输入文件名称"
style="width:200px" clearable/>
</Form-item>
<Form-item class="search-btn">
<Button @click="_search" type="primary">搜索</Button>
</Form-item>
</Form>
</Col>
<!--列表-->
<Col span="24">
<FilesList ref="fileModal" :fileName="fileName" @on-result-change="_fileData"></FilesList>
</Col>
</Row>
<!--删除提示框-->
<ModalConfirm ref="confirmModal" :content="modalContent" :btnModalList="btnModalList"
@on-result-change="_modalResult"></ModalConfirm>
</div>
</template>
<script>
import ModalConfirm from '../../base/ModalConfirm'
import { meterEntrust } from '../../../api'
import FilesList from './FilesList'
export default {
components: {
FilesList,
ModalConfirm
},
props: {
// 只能删除自己的标识
flag: null
},
data() {
return {
fileName: '',
selectIds: [],
getPage: {},
// ids
contractId: '',
sampleId: '',
subcontractorId: '',
originalRecordId: '',
curveId: '',
// 用于区分是哪种附件（合同、委托、样品）
idKey: '',
// 弹框的内容
modalContent: '',
btnModalList: [
{ type: '', name: '取消' },
{ type: 'primary', name: '确定' }
],
//
deleteId: [],
urlData: {}
}
},
methods: {
/**
* msg:表示是哪种附件（委托，样品，分包商）
* pageUrl:page 请求地址
* deleteUrl：删除请求地址
* uploadFileUrl：上传地址
* downloadFileUrl：下载地址
* uri：预览请求地址
* viewUri：预览图片地址
* downloadBatch:批量打包下载
*/
_open(id, key) {
this.fileName = ''
this.showModal = true
this.contractId = ''
this.sampleId = ''
this.subcontractorId = ''
this.originalRecordId = ''
this.curveId = ''
this.entrustId = ''
this.idKey = key
switch (key) {
// 委托
case 'contractId':
this.contractId = id
this.urlData = {
msg: 'FoodContractAttachment',
pageUrl: '/meter/v1/entrust_attachment/page',
deleteUrl: '/meter/v1/entrust_attachment/?ids=',
uploadFileUrl: '/meter/v1/entrust_attachment/upload/',
downloadFileUrl: '/meter/v1/entrust_attachment/download/',
downloadBatch: '/food/v1/contract_attachment/download_batch',
uri: 'FoodContractAttachment/getByContractId',
viewUri: '/meter/v1/entrust_attachment/preview/'
}
break
case 'entrustId':
this.entrustId = id
this.urlData = {
msg: 'FoodContractAttachment',
pageUrl: 'soil/v1/entrust_annex/page',
deleteUrl: '/soil/v1/entrust_annex/?ids=',
uploadFileUrl: '/soil/v1/entrust_annex/upload/',
downloadFileUrl: '/soil/v1/entrust_annex/download/',
downloadBatch: '/food/v1/contract_attachment/download_batch',
uri: 'FoodContractAttachment/getByContractId',
viewUri: '/soil/v1/standard_annex/preview/'
}
break
case 'aloneSampleId':
// 样品
this.entrustId = id
this.urlData = {
msg: 'FoodSampleAttachment',
pageUrl: 'soil/v1/alone_sample_annex/page',
deleteUrl: '/soil/v1/alone_sample_annex/?ids=',
uploadFileUrl: '/soil/v1/alone_sample_annex/upload/',
downloadFileUrl: '/soil/v1/alone_sample_annex/download/',
downloadBatch: '/food/v1/sample_attachment/download_batch',
uri: 'FoodSampleAttachment/getBySampleId',
viewUri: '/food/v1/sample_attachment/view'
}
break
case 'subcontractorId':
// 分包商
this.subcontractorId = id
this.urlData = {
msg: 'FoodSubContractAttachment',
pageUrl: '/meter/v1/contract_attachment/page',
deleteUrl: '/meter/v1/contract_attachment/?ids=',
uploadFileUrl: '/meter/v1/contract_attachment/upload/',
downloadFileUrl: '/meter/v1/contract_attachment/download/',
downloadBatch: '/food/v1/subcontractor_attachment/download_batch',
uri: 'FoodSubContractAttachment/getBySubcontractorId',
viewUri: '/food/v1/subcontractor_attachment/view'
}
break
case 'originalRecordId':
// 原始记录
this.originalRecordId = id
this.urlData = {
msg: 'FoodOriginalRecordAttachment',
pageUrl: 'FoodOriginalRecordAttachment/page',
deleteUrl: 'FoodOriginalRecordAttachment/deleteByIds',
uploadFileUrl: '/food/v1/original_attachment/',
downloadFileUrl: '/food/v1/original_attachment/download/',
downloadBatch: '/food/v1/original_attachment/download_batch',
uri: 'FoodOriginalRecordAttachment/getByOriginalRecordId',
viewUri: '/food/v1/original_attachment/preview'
}
break
case 'curveId':
// 采样记录
this.curveId = id
this.urlData = {
msg: 'ElnCurveAttachment',
pageUrl: 'ElnCurveAttachment/page',
deleteUrl: 'ElnCurveAttachment/deleteByIds',
uploadFileUrl: '/print/v1/curve_attachment/',
downloadFileUrl: '/print/v1/curve_attachment/download/',
downloadBatch: '/print/v1/curve_attachment/download_batch',
uri: 'ElnCurveAttachment/getById',
viewUri: '/print/v1/curve_attachment/view'
}
break
}
const idsObj = {
contractId: this.contractId,
sampleId: this.sampleId,
subcontractorId: this.subcontractorId,
originalRecordId: this.originalRecordId,
curveId: this.curveId,
entrustId: this.entrustId
}
this.$refs.fileModal._setUploadData(
Object.assign({ id: id }, this.urlData),
idsObj,
this.idKey
)
},
_deleteById(ids) {
this.deleteId = ids
this.modalContent = '确定要删除这 ' + ids.length + ' 个附件？'
this.$refs.confirmModal._openModal()
},
_delPage: async function(data) {
console.log(data)
const result = await meterEntrust.attachmentDelete(
this.urlData.deleteUrl,
data.id
)
if (result) {
this.$Message.success('删除成功！')
this.$refs.fileModal._page()
}
this.$refs.confirmModal._closeModal()
this.deleteId = []
},
// 删除提示框返回
_modalResult(msg) {
if (msg === '确定') {
// 删除一条记录
if (this.flag === undefined) {
// 只能删除自己上传的
this._delPage({ id: this.deleteId, flag: 1 })
} else {
// 可以删除全部
this._delPage({ id: this.deleteId })
}
}
},
_fileData(msg, data) {
switch (msg) {
case 'delete':
this._deleteById(data)
break
}
},
// 搜索
_search() {
this.$refs.fileModal._page(this.fileName)
}
}
}
</script>
components/file/instock-file-manage/FilesList.vue 0 → 100644
<template>
<div>
<Row>
<!--操作-->
<Col span="24" style="margin-bottom: 10px">
<div class="btns-menu">
<!--查看方式-->
<Select v-model="viewVal" @on-change="_view" style="width:150px;float: left" placeholder="请选择查看方式">
<Option v-for="item in checkList" :key="item.value" :value="item.value">{{ item.name }}</Option>
</Select>
<!--上传-->
<label>
<Upload
:action="action"
:on-success="_handelsuccess"
:before-upload="_beupload"
:on-progress="_handelprogress"
:on-format-error="_formatError"
:data="dataObj"
:with-credentials="true"
:show-upload-list="false"
:format="format"
style="float: left">
<Button>上传</Button>
</Upload>
</label>
<Button @click="_batchUpload">批量上传</Button>
<!--一系列操作-->
<!--非表格-->
<!-- <Button v-if="viewStyle === 2 || viewStyle === 3" v-for="item in menusListA" :key="item.name" @click="_radioChange(item.value)"-->
<!-- >{{item.name}}-->
<!-- </Button>-->
<!-- &lt;!&ndash;表格&ndash;&gt;-->
<!-- <Button v-if="viewStyle === 1" v-for="item in menusList" :key="item.name" @click="_tableChange(item.value)"-->
<!-- style="margin-right: 5px">{{item.name}}-->
<!-- </Button>-->
</div>
</Col>
<Col span="24" style="margin-bottom: 10px">
<!-- 默认是详细模式 -->
<div v-show="viewStyle === 1">
<PTVXETable ref="pageTable" :pageColumns="pageColumns" :tableHeight="tableHeight"
@on-result-change="_tableResultChange" :getPage="getPage" select-data>
<vxe-table-column
:field="item.key"
:title="item.title"
:min-width="item.width?item.width:200"
:fixed="item.fixed?item.fixed:undefined"
v-for="item in pageColumns"
:key="item.key" sortable>
<template slot-scope="scope">
<span v-if="item.dateTime">{{scope.row[item.key]?$dateformat(scope.row[item.key],'yyyy-mm-dd HH:MM'):''}}</span>
<span v-else>{{scope.row[item.key]}}</span>
</template>
</vxe-table-column>
<vxe-table-column
title="操作"
align="center"
width="100"
fixed="right">
<template slot-scope="scope">
<VXEIconList
:msg="scope.row.type === 'jpg'||scope.row.type === 'jpeg'||scope.row.type === 'pdf'||scope.row.type === 'png'||scope.row.type === 'xlsx'||scope.row.type === 'docx'||scope.row.type === 'bmp' ?iconMsgJpg:iconMsg"
@on-result-change="_iconClick" :rowData="scope.row"></VXEIconList>
</template>
</vxe-table-column>
</PTVXETable>
</div>
<!--/-->
<!--缩略图 模式-->
<div v-show="viewStyle === 2">
<ul :style="{ 'height': 'auto' }" class="thumbnailStyle">
<CheckboxGroup @on-change="_chkVal" v-model="selectIds">
<li v-for="item in getPage.records" :key="item.id">
<div class="thumbnailStyleImg">
<Tooltip placement="top">
<img :class="item.type === 'jpg'||item.type === 'png'?'samllJpg':' ' " :src=" item.type==='jpg'||item.type === 'png'?imgUrl+item.id:bigUrl+item.type+'.png' "/>
<div slot="content" style="white-space: normal">
<p>名称：{{item.fileName}}</p>
</div>
</Tooltip>
</div>
<div class="thumbnailStyleCheck clearCheck">
<Checkbox :label="item.id"><span class="inline-span" style="display: inline">{{item.fileName}}</span>
</Checkbox>
</div>
</li>
</CheckboxGroup>
</ul>
<div style="margin-top: 10px">共 {{getPage.total}} 条</div>
</div>
<!--/-->
<!--列表 模式-->
<div v-show="viewStyle === 3">
<ul :style="{ 'height': 'auto' }" class="listStyle">
<CheckboxGroup @on-change="_chkVal" v-model="selectIds">
<li v-for="item in getPage.records" :key="item.id">
<div class="listStyleCheck clearCheck">
<Tooltip placement="top">
<span class="spanImg">
<img :src=" smallUrl+item.type+'.png' "/>
</span>
<span>
<Checkbox :label="item.id"><span>{{item.fileName}}</span></Checkbox>
</span>
<div slot="content" style="white-space: normal">
<p>名称：{{item.fileName}}</p>
</div>
</Tooltip>
</div>
</li>
</CheckboxGroup>
</ul>
<div style="margin-top: 10px">共 {{getPage.total}} 条</div>
</div>
<!--/-->
</Col>
</Row>
<BatchUpload ref="batchUpload" @on-result-change="_page"></BatchUpload>
<BatchUploadSample ref="batchUploadSample" @on-result-change="_page"></BatchUploadSample>
<!--上传loading-->
<div v-show="isLoad">
<Spin fix>
<Icon type="load-c" size=18 class="file-spin-icon-load"></Icon>
<div>正在上传,请稍后...</div>
</Spin>
</div>
<!--图片预览-->
<div>
<vue-gallery-slideshow :images="imgViewList" :index="imgViewIndex" @close="imgViewIndex = null"
style="height: 100vh"></vue-gallery-slideshow>
</div>
</div>
</template>
<script>
// import VueGallerySlideshow from 'vue-gallery-slideshow'
import global from '../../../api/config'
import { meterEntrust } from '../../../api'
import BatchUpload from './BatchUpload'
import BatchUploadSample from './BatchUploadSample'
/**
* 公共组件modal 弹框（支持上传，下载，预览，删除附件等操作）
*/
export default {
components: { BatchUpload, BatchUploadSample },
props: {
fileName: null
},
data() {
return {
imgViewList: [],
imgViewIndex: null,
iconMsg: [
{ type: 'md-remove-circle', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' }
// { type: 'ios-eye', id: '', name: '预览' }
],
iconMsgJpg: [
{ type: 'md-remove-circle', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' },
{ type: 'ios-eye', id: '', name: '预览' }
],
iconMsgDis: [
{ type: 'trash-a', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' },
{ type: 'images', id: '', name: '预览', disabled: true }
],
selectIds: [],
getPage: {},
pageColumns: [
{ title: '文件名', key: 'fileName' },
{ title: '类型', key: 'type', width: 120 },
{ title: '上传时间', key: 'ctime', width: 140, dateTime: true }
// {title: '上传人', key: 'cname', width: 120},
],
formObj: {
contractId: undefined,
entrustId: undefined
},
format: ['jpg', 'bmp', 'jpeg', 'png'],
viewVal: 1,
viewStyle: 1,
menusList: [
{ name: '下载', value: 'down' },
{ name: '删除', value: 'delete' }
],
menusListA: [{ name: '删除', value: 'delete' }],
checkList: [
{ name: '详细模式', value: 1 },
{ name: '缩略图模式', value: 2 },
{ name: '列表模式', value: 3 }
],
Ids: [],
smallUrl: global.staticURL + '/img/smallfile/',
bigUrl: global.staticURL + '/img/bigfile/',
imgUrl: '',
action: '',
dataObj: {
file: ''
// contractId: ''
},
isLoad: false, // 是否显示loading...
id: '', // 合同、委托、样品id
objectKey: [],
urlData: {},
idsObj: {}
}
},
computed: {
tableHeight: function() {
return this.$tableHeight('tableModal')
}
},
methods: {
_batchUpload() {
if (this.formObj.aloneSampleId) {
this.$refs.batchUploadSample._open(this.id)
} else {
this.$refs.batchUpload._open(this.id)
}
},
_formatError(file) {
this.$Notice.error({
title: '文件格式不正确',
duration: 10,
desc: '文件格式不正确，请上传格式为jpg, bmp, jpeg, png的文件！'
})
},
_setUploadData(data, idsObj, idKey) {
this.selectIds = []
this.imgViewIndex = null
this.isLoad = false
this.id = data.id
const pageKey = idKey
console.log(pageKey)
this.$set(this.formObj, pageKey, data.id)
console.log(this.formObj)
// this.formObj.contractId = data.id
// this.formObj.entrustId = data.id
// 各个ids
this.idsObj = idsObj
this.urlData = data
this.action = global.baseURL + data.uploadFileUrl + data.id
this.imgUrl = global.baseURL + data.downloadFileUrl
this.downloadFileUrlFile = data.downloadFileUrl
this.$nextTick(() => {
this._page()
})
},
_page: async function(fileName) {
if (fileName) {
this.formObj.fileName = fileName
} else {
this.formObj.fileName = undefined
}
Object.assign(this.formObj, this.$refs.pageTable._searchParams())
const result = await meterEntrust.attachmentPage(
this.urlData.pageUrl,
this.formObj
)
if (result) {
this.$refs.pageTable._hideLoading()
const list = []
const fileList = result.records
for (let i = 0; i < fileList.length; i++) {
if (
fileList[i].type === 'jpg' ||
fileList[i].type === 'jpeg' ||
fileList[i].type === 'bmp' ||
fileList[i].type === 'png'
) {
list.push(result.records[i])
}
}
this.getPage = result
this.getPage.records = list
}
},
// _page: async function() {
// Object.assign(this.formObj, this.$refs.pageTable._searchParams())
// console.log('this.formObj', this.formObj)
// const result = await meterEntrust.attachmentPage(this.formObj)
// console.log('请求结果', result)
// if (result) {
// console.log(result)
// this.$refs.pageTable._hideLoading()
// this.getPage = result
// }
// },
_formSearch() {
this.$refs.pageTable._pageChange(1)
},
_searchParams() {
const data = {}
Object.assign(data, { fileName: this.fileName }, this.idsObj)
return data
},
_tableResultChange(msg, data) {
switch (msg) {
case 'page':
this.Ids = []
this.objectKey = []
this.getPage = this.$store.state[this.urlData.msg].page
break
case 'selectData':
const idList = []
const objectKey = []
for (let i = 0; i < data.length; i++) {
idList.push(data[i].id)
objectKey.push(data[i].objectKey)
}
this.Ids = idList
this.objectKey = objectKey
break
case 'iconClick':
this._iconClick(data.name, data.rowData)
break
case 'changeSize':
this._page()
break
}
},
_iconClick(res, data) {
switch (res) {
case '下载':
window.open(
global.baseURL + this.urlData.downloadFileUrl + data.id,
'_blank'
)
break
case '删除':
this._deleteById([data.id])
break
case '预览':
this._viewImg(data)
break
}
},
// 预览图片（该合同下所有的）
_viewImg(data) {
switch (data.type) {
case 'jpg':
const imgViewList = []
imgViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = imgViewList
this.imgViewIndex = 0
break
case 'jpeg':
const jpegViewList = []
jpegViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = jpegViewList
this.imgViewIndex = 0
break
case 'pdf':
this.$pdfView(data.objectKey)
break
case 'png':
const pngViewList = []
pngViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = pngViewList
this.imgViewIndex = 0
break
case 'bmp':
const bmpViewList = []
bmpViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = bmpViewList
this.imgViewIndex = 0
break
case 'xlsx':
this.$openWindowModeless({
objectKey: data.objectKey,
idType: 10,
id: data.id,
isReport: 4
})
break
case 'docx':
this.$openWindowModeless({
objectKey: data.objectKey,
idType: 10,
id: data.id,
isReport: 4
})
break
case 'doc':
this.$Message.warning('预览功能不支持doc格式')
break
case 'xls':
this.$Message.warning('预览功能不支持xls格式')
break
}
},
// 删除
_deleteById(id) {
this.$emit('on-result-change', 'delete', id)
},
// 查看方式改变
_view(val) {
this.viewStyle = val
this.selectIds = []
if (val === 1) {
this._formSearch()
}
},
_chkVal(val) {
this.selectIds = val
},
// 一系列操作返回的值
_radioChange(val) {
if (val === 'down') {
if (this.objectKey.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._downloadAll(this.objectKey)
}
}
if (val === 'delete') {
if (this.selectIds.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._deleteById(this.selectIds)
}
}
},
_tableChange(val) {
if (val === 'down') {
if (this.objectKey.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._downloadAll(this.objectKey)
}
}
if (val === 'delete') {
if (this.Ids.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._deleteById(this.Ids)
}
}
},
// 批量打包下载
_downloadAll(ids) {
window.open(
global.baseURL + this.urlData.downloadBatch + '?objectKeys=' + ids
)
},
_beupload(file) {
this.dataObj.file = file.name
},
_handelprogress(event, file, fileList) {
this.isLoad = true
},
_handelsuccess(response, file, fileList) {
// 上传成功
if (response.success) {
this.isLoad = false
this.$Message.success('上传成功！')
this._page()
} else {
this.isLoad = true
this.$Message.error(response.msg)
this.isLoad = false
}
}
}
}
</script>
<style>
.radio-display.ivu-radio-group-button .ivu-radio-wrapper:first-child {
border-radius: 4px !important;
margin-right: 5px !important;
}
.radio-display. .ivu-radio-wrapper:last-child {
border-radius: 4px !important;
border-left: 1px solid #dddee1 !important;
}
.samllJpg {
width: 15%;
height: auto;
}
</style>
components/file/sample-file-manage/BatchUpload.vue 0 → 100644
<template>
<div>
<Modal v-model="showEditModal" :mask-closable="false" width="600">
<p slot="header">{{modalTitle}}</p>
<div>
<Upload
:action="action"
:show-upload-list="false"
:before-upload="_beupload"
multiple
>
<Button type="dashed" icon="ios-cloud-upload-outline">上传文件（小于50MB）</Button>
</Upload>
<div>
<Card :dis-hover="true" style="width: 100%;height: 400px;overflow: auto;">
<p slot="title">已上传文件列表</p>
<div v-for="(item,index) in fileList" :key="index" class="file-upload-list">
<div>
<div class="file-upload-list-cover">
<Icon @click.native.stop="_handleRemove(item)" type="md-trash" style="color: white;font-size: 20px;"></Icon>
</div>
</div>
{{item.fileName }}
</div>
</Card>
</div>
</div>
<div slot="footer" class="btn-width">
<Button @click="showEditModal = false">取消</Button>
<Button @click="_mutipleUpload" :loading="isLoading" type="primary">{{btnName}}</Button>
</div>
</Modal>
</div>
</template>
<script>
/**
* 上传文件，在文件夹下
*/
import axios from 'axios'
import global from '../../../api/config'
import loading from '../../../api/loading'
export default {
data() {
return {
id: '',
ID: '',
action: '',
modalTitle: '',
showEditModal: false,
name: '',
isLoading: false,
btnName: '上传',
fileList: []
}
},
methods: {
_open(obj) {
this.fileList = []
this.showEditModal = true
this.ID = obj
this.modalTitle = '上传文件'
},
_beupload(file) {
// 单个文件上传超过50M时，取消上传
const isLt50M = file.size / 1024 / 1024 < 50
const fileName = file.name.split('.')[0]
if (!isLt50M) {
this.$Message.warning({
content: '文件 ' + fileName + ' 大小超多50M，请重新上传!',
duration: 3
})
this.isLoading = false
} else {
// 动态循环给文件命名
const temObj = {
file: file,
fileName: fileName
}
this.fileList.push(temObj)
}
return false
},
_mutipleUpload() {
if (this.fileList.length > 0 && this.btnName === '上传') {
this.isLoading = true
this.btnName = '上传中...'
// 创建formula对象
const formData = new FormData()
formData.append('entrustId', this.ID)
// 多个文件
for (let i = 0; i < this.fileList.length; i++) {
formData.append('file' + i, this.fileList[i].file)
}
const config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
const instanceFile = axios.create()
instanceFile.defaults.withCredentials = true
// 发起请求
instanceFile
.post(
global.baseURL + '/soil/v1/entrust_annex/upload_bath/' + this.ID,
formData,
{
headers: config
}
)
.then(res => {
if (res.data.code === '1') {
this.$Message.success('上传成功！')
this.showEditModal = false
this.$emit('on-result-change')
} else if (res.data.code === '0') {
loading.toast.show(res.data.code, res.data.msg)
this.$Message.error('操作失败')
}
this._resetLoading()
})
.catch(err => {
console.log(err)
this._resetLoading()
})
} else {
this.$Message.warning('请至少上传一个文件')
this._resetLoading()
}
},
_resetLoading() {
this.isLoading = false
this.btnName = '上传'
},
// 删除对应的上传的文件
_handleRemove(data) {
const index = this.fileList.findIndex(item => item === data)
this.fileList.splice(index, 1)
}
}
}
</script>
<style>
.file-upload-list {
display: inline-block;
width: 100px;
height: 100px;
text-align: center;
line-height: 100px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
margin-right: 4px;
}
.file-upload-list:hover .file-upload-list-cover {
display: block;
}
.file-upload-list-cover {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
}
</style>
components/file/sample-file-manage/BatchUploadSample.vue 0 → 100644
<template>
<div>
<Modal v-model="showEditModal" :mask-closable="false" width="600">
<p slot="header">{{modalTitle}}</p>
<div>
<Upload
:action="action"
:show-upload-list="false"
:before-upload="_beupload"
multiple
>
<Button type="dashed" icon="ios-cloud-upload-outline">上传文件（小于50MB）</Button>
</Upload>
<div>
<Card :dis-hover="true" style="width: 100%;height: 400px;overflow: auto;">
<p slot="title">已上传文件列表</p>
<div v-for="(item,index) in fileList" :key="index" class="file-upload-list">
<div>
<div class="file-upload-list-cover">
<Icon @click.native.stop="_handleRemove(item)" type="md-trash" style="color: white;font-size: 20px;"></Icon>
</div>
</div>
{{item.fileName }}
</div>
</Card>
</div>
</div>
<div slot="footer" class="btn-width">
<Button @click="showEditModal = false">取消</Button>
<Button @click="_mutipleUpload" :loading="isLoading" type="primary">{{btnName}}</Button>
</div>
</Modal>
</div>
</template>
<script>
/**
* 上传文件，在文件夹下
*/
import axios from 'axios'
import global from '../../../api/config'
import loading from '../../../api/loading'
export default {
data() {
return {
id: '',
ID: '',
action: '',
modalTitle: '',
showEditModal: false,
name: '',
isLoading: false,
btnName: '上传',
fileList: []
}
},
methods: {
_open(obj) {
this.fileList = []
this.showEditModal = true
this.ID = obj
this.modalTitle = '文件上传'
},
_beupload(file) {
// 单个文件上传超过50M时，取消上传
const isLt50M = file.size / 1024 / 1024 < 50
const fileName = file.name.split('.')[0]
if (!isLt50M) {
this.$Message.warning({
content: '文件 ' + fileName + ' 大小超多50M，请重新上传!',
duration: 3
})
this.isLoading = false
} else {
// 动态循环给文件命名
const temObj = {
file: file,
fileName: fileName
}
this.fileList.push(temObj)
}
return false
},
_mutipleUpload() {
if (this.fileList.length > 0 && this.btnName === '上传') {
this.isLoading = true
this.btnName = '上传中...'
// 创建formula对象
const formData = new FormData()
formData.append('entrustId', this.ID)
// 多个文件
for (let i = 0; i < this.fileList.length; i++) {
formData.append('file' + i, this.fileList[i].file)
}
const config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
const instanceFile = axios.create()
instanceFile.defaults.withCredentials = true
// 发起请求
instanceFile
.post(
global.baseURL +
'/soil/v1/alone_sample_annex/upload_bath/' +
this.ID,
formData,
{
headers: config
}
)
.then(res => {
if (res.data.code === '1') {
this.$Message.success('上传成功！')
this.showEditModal = false
this.$emit('on-result-change')
} else if (res.data.code === '0') {
loading.toast.show(res.data.code, res.data.msg)
this.$Message.error('操作失败')
}
this._resetLoading()
})
.catch(err => {
console.log(err)
this._resetLoading()
})
} else {
this.$Message.warning('请至少上传一个文件')
this._resetLoading()
}
},
_resetLoading() {
this.isLoading = false
this.btnName = '上传'
},
// 删除对应的上传的文件
_handleRemove(data) {
const index = this.fileList.findIndex(item => item === data)
this.fileList.splice(index, 1)
}
}
}
</script>
<style>
.file-upload-list {
display: inline-block;
width: 100px;
height: 100px;
text-align: center;
line-height: 100px;
border: 1px solid transparent;
border-radius: 4px;
overflow: hidden;
background: #fff;
position: relative;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
margin-right: 4px;
}
.file-upload-list:hover .file-upload-list-cover {
display: block;
}
.file-upload-list-cover {
display: none;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
background: rgba(0, 0, 0, 0.6);
}
</style>
components/file/sample-file-manage/FileManage.vue 0 → 100644
<template>
<div>
<Modal v-model="showModal" :width="900" v-drag class="modal-footer-none zIndex-1100">
<p slot="header">{{modalTitle}}</p>
<div>
<FileManageCont ref="fileCont" :flag="flag"></FileManageCont>
</div>
</Modal>
</div>
</template>
<script>
import FileManageCont from './FileManageCont'
export default {
components: {
FileManageCont
},
props: {
// 只能删除自己的标识
flag: null
},
data() {
return {
showModal: false,
modalTitle: '附件管理'
}
},
methods: {
_open(id, key, title) {
this.showModal = true
if (title) {
this.modalTitle = title
} else {
this.modalTitle = '附件管理'
}
this.$refs.fileCont._open(id, key)
}
}
}
</script>
components/file/sample-file-manage/FileManageCont.vue 0 → 100644
<template>
<div>
<!--内容-->
<Row>
<!--查询-->
<Col span="24" style="margin-bottom: -10px">
<Form :label-width="70" inline onsubmit="return false">
<label class="label-sign"></label>
<Form-item label="文件名称:">
<Input v-model="fileName" @on-enter="_search" placeholder="请输入文件名称"
style="width:200px" clearable/>
</Form-item>
<Form-item class="search-btn">
<Button @click="_search" type="primary">搜索</Button>
</Form-item>
</Form>
</Col>
<!--列表-->
<Col span="24">
<FilesList ref="fileModal" :fileName="fileName" @on-result-change="_fileData"></FilesList>
</Col>
</Row>
<!--删除提示框-->
<ModalConfirm ref="confirmModal" :content="modalContent" :btnModalList="btnModalList"
@on-result-change="_modalResult"></ModalConfirm>
</div>
</template>
<script>
import ModalConfirm from '../../base/ModalConfirm'
import { meterEntrust } from '../../../api'
import FilesList from './FilesList'
export default {
components: {
FilesList,
ModalConfirm
},
props: {
// 只能删除自己的标识
flag: null
},
data() {
return {
fileName: '',
selectIds: [],
getPage: {},
// ids
contractId: '',
sampleId: '',
subcontractorId: '',
originalRecordId: '',
curveId: '',
// 用于区分是哪种附件（合同、委托、样品）
idKey: '',
// 弹框的内容
modalContent: '',
btnModalList: [
{ type: '', name: '取消' },
{ type: 'primary', name: '确定' }
],
//
deleteId: [],
urlData: {}
}
},
methods: {
/**
* msg:表示是哪种附件（委托，样品，分包商）
* pageUrl:page 请求地址
* deleteUrl：删除请求地址
* uploadFileUrl：上传地址
* downloadFileUrl：下载地址
* uri：预览请求地址
* viewUri：预览图片地址
* downloadBatch:批量打包下载
*/
_open(id, key) {
this.fileName = ''
this.showModal = true
this.contractId = ''
this.sampleId = ''
this.subcontractorId = ''
this.originalRecordId = ''
this.curveId = ''
this.entrustId = ''
this.idKey = key
switch (key) {
// 委托
case 'contractId':
this.contractId = id
this.urlData = {
msg: 'FoodContractAttachment',
pageUrl: '/meter/v1/entrust_attachment/page',
deleteUrl: '/meter/v1/entrust_attachment/?ids=',
uploadFileUrl: '/meter/v1/entrust_attachment/upload/',
downloadFileUrl: '/meter/v1/entrust_attachment/download/',
downloadBatch: '/food/v1/contract_attachment/download_batch',
uri: 'FoodContractAttachment/getByContractId',
viewUri: '/meter/v1/entrust_attachment/preview/'
}
break
case 'entrustId':
this.entrustId = id
this.urlData = {
msg: 'FoodContractAttachment',
pageUrl: 'soil/v1/entrust_annex/page',
deleteUrl: '/soil/v1/entrust_annex/?ids=',
uploadFileUrl: '/soil/v1/entrust_annex/upload/',
downloadFileUrl: '/soil/v1/entrust_annex/download/',
downloadBatch: '/food/v1/contract_attachment/download_batch',
uri: 'FoodContractAttachment/getByContractId',
viewUri: '/soil/v1/standard_annex/preview/'
}
break
case 'aloneSampleId':
// 样品
this.entrustId = id
this.urlData = {
msg: 'FoodSampleAttachment',
pageUrl: 'soil/v1/alone_sample_annex/page',
deleteUrl: '/soil/v1/alone_sample_annex/?ids=',
uploadFileUrl: '/soil/v1/alone_sample_annex/upload/',
downloadFileUrl: '/soil/v1/alone_sample_annex/download/',
downloadBatch: '/food/v1/sample_attachment/download_batch',
uri: 'FoodSampleAttachment/getBySampleId',
viewUri: '/food/v1/sample_attachment/view'
}
break
case 'subcontractorId':
// 分包商
this.subcontractorId = id
this.urlData = {
msg: 'FoodSubContractAttachment',
pageUrl: '/meter/v1/contract_attachment/page',
deleteUrl: '/meter/v1/contract_attachment/?ids=',
uploadFileUrl: '/meter/v1/contract_attachment/upload/',
downloadFileUrl: '/meter/v1/contract_attachment/download/',
downloadBatch: '/food/v1/subcontractor_attachment/download_batch',
uri: 'FoodSubContractAttachment/getBySubcontractorId',
viewUri: '/food/v1/subcontractor_attachment/view'
}
break
case 'originalRecordId':
// 原始记录
this.originalRecordId = id
this.urlData = {
msg: 'FoodOriginalRecordAttachment',
pageUrl: 'FoodOriginalRecordAttachment/page',
deleteUrl: 'FoodOriginalRecordAttachment/deleteByIds',
uploadFileUrl: '/food/v1/original_attachment/',
downloadFileUrl: '/food/v1/original_attachment/download/',
downloadBatch: '/food/v1/original_attachment/download_batch',
uri: 'FoodOriginalRecordAttachment/getByOriginalRecordId',
viewUri: '/food/v1/original_attachment/preview'
}
break
case 'curveId':
// 采样记录
this.curveId = id
this.urlData = {
msg: 'ElnCurveAttachment',
pageUrl: 'ElnCurveAttachment/page',
deleteUrl: 'ElnCurveAttachment/deleteByIds',
uploadFileUrl: '/print/v1/curve_attachment/',
downloadFileUrl: '/print/v1/curve_attachment/download/',
downloadBatch: '/print/v1/curve_attachment/download_batch',
uri: 'ElnCurveAttachment/getById',
viewUri: '/print/v1/curve_attachment/view'
}
break
}
const idsObj = {
contractId: this.contractId,
sampleId: this.sampleId,
subcontractorId: this.subcontractorId,
originalRecordId: this.originalRecordId,
curveId: this.curveId,
entrustId: this.entrustId
}
this.$refs.fileModal._setUploadData(
Object.assign({ id: id }, this.urlData),
idsObj,
this.idKey
)
},
_deleteById(ids) {
this.deleteId = ids
this.modalContent = '确定要删除这 ' + ids.length + ' 个附件？'
this.$refs.confirmModal._openModal()
},
_delPage: async function(data) {
console.log(data)
const result = await meterEntrust.attachmentDelete(
this.urlData.deleteUrl,
data.id
)
if (result) {
this.$Message.success('删除成功！')
this.$refs.fileModal._page()
}
this.$refs.confirmModal._closeModal()
this.deleteId = []
},
// 删除提示框返回
_modalResult(msg) {
if (msg === '确定') {
// 删除一条记录
if (this.flag === undefined) {
// 只能删除自己上传的
this._delPage({ id: this.deleteId, flag: 1 })
} else {
// 可以删除全部
this._delPage({ id: this.deleteId })
}
}
},
_fileData(msg, data) {
switch (msg) {
case 'delete':
this._deleteById(data)
break
}
},
// 搜索
_search() {
this.$refs.fileModal._page(this.fileName)
}
}
}
</script>
components/file/sample-file-manage/FilesList.vue 0 → 100644
<template>
<div>
<Row>
<!--操作-->
<Col span="24" style="margin-bottom: 10px">
<div class="btns-menu">
<!--查看方式-->
<Select v-model="viewVal" @on-change="_view" style="width:150px;float: left" placeholder="请选择查看方式">
<Option v-for="item in checkList" :key="item.value" :value="item.value">{{ item.name }}</Option>
</Select>
<!--上传-->
<label>
<Upload
:action="action"
:on-success="_handelsuccess"
:before-upload="_beupload"
:on-progress="_handelprogress"
:on-format-error="_formatError"
:data="dataObj"
:with-credentials="true"
:show-upload-list="false"
:format="format"
style="float: left">
<Button>上传</Button>
</Upload>
</label>
<Button @click="_batchUpload">批量上传</Button>
<!--一系列操作-->
<!--非表格-->
<!-- <Button v-if="viewStyle === 2 || viewStyle === 3" v-for="item in menusListA" :key="item.name" @click="_radioChange(item.value)"-->
<!-- >{{item.name}}-->
<!-- </Button>-->
<!-- &lt;!&ndash;表格&ndash;&gt;-->
<!-- <Button v-if="viewStyle === 1" v-for="item in menusList" :key="item.name" @click="_tableChange(item.value)"-->
<!-- style="margin-right: 5px">{{item.name}}-->
<!-- </Button>-->
</div>
</Col>
<Col span="24" style="margin-bottom: 10px">
<!-- 默认是详细模式 -->
<div v-show="viewStyle === 1">
<PTVXETable ref="pageTable" :pageColumns="pageColumns" :tableHeight="tableHeight"
@on-result-change="_tableResultChange" :getPage="getPage" select-data>
<vxe-table-column
:field="item.key"
:title="item.title"
:min-width="item.width?item.width:200"
:fixed="item.fixed?item.fixed:undefined"
v-for="item in pageColumns"
:key="item.key" sortable>
<template slot-scope="scope">
<span v-if="item.dateTime">{{scope.row[item.key]?$dateformat(scope.row[item.key],'yyyy-mm-dd HH:MM'):''}}</span>
<span v-else>{{scope.row[item.key]}}</span>
</template>
</vxe-table-column>
<vxe-table-column
title="操作"
align="center"
width="100"
fixed="right">
<template slot-scope="scope">
<VXEIconList
:msg="scope.row.type === 'jpg'||scope.row.type === 'jpeg'||scope.row.type === 'pdf'||scope.row.type === 'png'||scope.row.type === 'xlsx'||scope.row.type === 'docx'||scope.row.type === 'bmp' ?iconMsgJpg:iconMsg"
@on-result-change="_iconClick" :rowData="scope.row"></VXEIconList>
</template>
</vxe-table-column>
</PTVXETable>
</div>
<!--/-->
<!--缩略图 模式-->
<div v-show="viewStyle === 2">
<ul :style="{ 'height': 'auto' }" class="thumbnailStyle">
<CheckboxGroup @on-change="_chkVal" v-model="selectIds">
<li v-for="item in getPage.records" :key="item.id">
<div class="thumbnailStyleImg">
<Tooltip placement="top">
<img :class="item.type === 'jpg'||item.type === 'png'?'samllJpg':' ' " :src=" item.type==='jpg'||item.type === 'png'?imgUrl+item.id:bigUrl+item.type+'.png' "/>
<div slot="content" style="white-space: normal">
<p>名称：{{item.fileName}}</p>
</div>
</Tooltip>
</div>
<div class="thumbnailStyleCheck clearCheck">
<Checkbox :label="item.id"><span class="inline-span" style="display: inline">{{item.fileName}}</span>
</Checkbox>
</div>
</li>
</CheckboxGroup>
</ul>
<div style="margin-top: 10px">共 {{getPage.total}} 条</div>
</div>
<!--/-->
<!--列表 模式-->
<div v-show="viewStyle === 3">
<ul :style="{ 'height': 'auto' }" class="listStyle">
<CheckboxGroup @on-change="_chkVal" v-model="selectIds">
<li v-for="item in getPage.records" :key="item.id">
<div class="listStyleCheck clearCheck">
<Tooltip placement="top">
<span class="spanImg">
<img :src=" smallUrl+item.type+'.png' "/>
</span>
<span>
<Checkbox :label="item.id"><span>{{item.fileName}}</span></Checkbox>
</span>
<div slot="content" style="white-space: normal">
<p>名称：{{item.fileName}}</p>
</div>
</Tooltip>
</div>
</li>
</CheckboxGroup>
</ul>
<div style="margin-top: 10px">共 {{getPage.total}} 条</div>
</div>
<!--/-->
</Col>
</Row>
<BatchUpload ref="batchUpload" @on-result-change="_page"></BatchUpload>
<BatchUploadSample ref="batchUploadSample" @on-result-change="_page"></BatchUploadSample>
<!--上传loading-->
<div v-show="isLoad">
<Spin fix>
<Icon type="load-c" size=18 class="file-spin-icon-load"></Icon>
<div>正在上传,请稍后...</div>
</Spin>
</div>
<!--图片预览-->
<div>
<vue-gallery-slideshow :images="imgViewList" :index="imgViewIndex" @close="imgViewIndex = null"
style="height: 100vh"></vue-gallery-slideshow>
</div>
</div>
</template>
<script>
// import VueGallerySlideshow from 'vue-gallery-slideshow'
import global from '../../../api/config'
import { meterEntrust } from '../../../api'
import BatchUpload from './BatchUpload'
import BatchUploadSample from './BatchUploadSample'
/**
* 公共组件modal 弹框（支持上传，下载，预览，删除附件等操作）
*/
export default {
components: { BatchUpload, BatchUploadSample },
props: {
fileName: null
},
data() {
return {
imgViewList: [],
imgViewIndex: null,
iconMsg: [
{ type: 'md-remove-circle', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' }
// { type: 'ios-eye', id: '', name: '预览' }
],
iconMsgJpg: [
{ type: 'md-remove-circle', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' },
{ type: 'ios-eye', id: '', name: '预览' }
],
iconMsgDis: [
{ type: 'trash-a', id: '', name: '删除' },
{ type: 'ios-download', id: '', name: '下载' },
{ type: 'images', id: '', name: '预览', disabled: true }
],
selectIds: [],
getPage: {},
pageColumns: [
{ title: '文件名', key: 'fileName' },
{ title: '类型', key: 'type', width: 120 },
{ title: '上传时间', key: 'ctime', width: 140, dateTime: true }
// {title: '上传人', key: 'cname', width: 120},
],
formObj: {
contractId: undefined,
entrustId: undefined
},
format: ['xls', 'xlsx', 'xlsm', 'doc', 'docx', 'pdf', 'txt'],
viewVal: 1,
viewStyle: 1,
menusList: [
{ name: '下载', value: 'down' },
{ name: '删除', value: 'delete' }
],
menusListA: [{ name: '删除', value: 'delete' }],
checkList: [
{ name: '详细模式', value: 1 },
{ name: '缩略图模式', value: 2 },
{ name: '列表模式', value: 3 }
],
Ids: [],
smallUrl: global.staticURL + '/img/smallfile/',
bigUrl: global.staticURL + '/img/bigfile/',
imgUrl: '',
action: '',
dataObj: {
file: ''
// contractId: ''
},
isLoad: false, // 是否显示loading...
id: '', // 合同、委托、样品id
objectKey: [],
urlData: {},
idsObj: {}
}
},
computed: {
tableHeight: function() {
return this.$tableHeight('tableModal')
}
},
methods: {
_batchUpload() {
if (this.formObj.aloneSampleId) {
this.$refs.batchUploadSample._open(this.id)
} else {
this.$refs.batchUpload._open(this.id)
}
},
_formatError(file) {
this.$Notice.error({
title: '文件格式不正确',
duration: 10,
desc: '文件格式不正确，请上传格式为jpg, bmp, jpeg, png的文件！'
})
},
_setUploadData(data, idsObj, idKey) {
this.selectIds = []
this.imgViewIndex = null
this.isLoad = false
this.id = data.id
const pageKey = idKey
console.log(pageKey)
this.$set(this.formObj, pageKey, data.id)
console.log(this.formObj)
// this.formObj.contractId = data.id
// this.formObj.entrustId = data.id
// 各个ids
this.idsObj = idsObj
this.urlData = data
this.action = global.baseURL + data.uploadFileUrl + data.id
this.imgUrl = global.baseURL + data.downloadFileUrl
this.downloadFileUrlFile = data.downloadFileUrl
this.$nextTick(() => {
this._page()
})
},
_page: async function(fileName) {
if (fileName) {
this.formObj.fileName = fileName
} else {
this.formObj.fileName = undefined
}
Object.assign(this.formObj, this.$refs.pageTable._searchParams())
const result = await meterEntrust.attachmentPage(
this.urlData.pageUrl,
this.formObj
)
if (result) {
this.$refs.pageTable._hideLoading()
const list = []
const fileList = result.records
for (let i = 0; i < fileList.length; i++) {
if (
fileList[i].type === 'xlsx' ||
fileList[i].type === 'xlsm' ||
fileList[i].type === 'xls' ||
fileList[i].type === 'doc' ||
fileList[i].type === 'docx' ||
fileList[i].type === 'txt' ||
fileList[i].type === 'pdf'
) {
list.push(result.records[i])
}
}
this.getPage = result
this.getPage.records = list
}
},
// _page: async function() {
// Object.assign(this.formObj, this.$refs.pageTable._searchParams())
// console.log('this.formObj', this.formObj)
// const result = await meterEntrust.attachmentPage(this.formObj)
// console.log('请求结果', result)
// if (result) {
// console.log(result)
// this.$refs.pageTable._hideLoading()
// this.getPage = result
// }
// },
_formSearch() {
this.$refs.pageTable._pageChange(1)
},
_searchParams() {
const data = {}
Object.assign(data, { fileName: this.fileName }, this.idsObj)
return data
},
_tableResultChange(msg, data) {
switch (msg) {
case 'page':
this.Ids = []
this.objectKey = []
this.getPage = this.$store.state[this.urlData.msg].page
break
case 'selectData':
const idList = []
const objectKey = []
for (let i = 0; i < data.length; i++) {
idList.push(data[i].id)
objectKey.push(data[i].objectKey)
}
this.Ids = idList
this.objectKey = objectKey
break
case 'iconClick':
this._iconClick(data.name, data.rowData)
break
case 'changeSize':
this._page()
break
}
},
_iconClick(res, data) {
switch (res) {
case '下载':
window.open(
global.baseURL + this.urlData.downloadFileUrl + data.id,
'_blank'
)
break
case '删除':
this._deleteById([data.id])
break
case '预览':
this._viewImg(data)
break
}
},
// 预览图片（该合同下所有的）
_viewImg(data) {
switch (data.type) {
case 'jpg':
const imgViewList = []
imgViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = imgViewList
this.imgViewIndex = 0
break
case 'jpeg':
const jpegViewList = []
jpegViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = jpegViewList
this.imgViewIndex = 0
break
case 'pdf':
this.$pdfView(data.objectKey)
break
case 'png':
const pngViewList = []
pngViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = pngViewList
this.imgViewIndex = 0
break
case 'bmp':
const bmpViewList = []
bmpViewList.push(global.baseURL + this.downloadFileUrlFile + data.id)
this.imgViewList = bmpViewList
this.imgViewIndex = 0
break
case 'xlsx':
this.$openWindowModeless({
objectKey: data.objectKey,
idType: 10,
id: data.id,
isReport: 4
})
break
case 'docx':
this.$openWindowModeless({
objectKey: data.objectKey,
idType: 10,
id: data.id,
isReport: 4
})
break
case 'doc':
this.$Message.warning('预览功能不支持doc格式')
break
case 'xls':
this.$Message.warning('预览功能不支持xls格式')
break
}
// console.log(data)
// if (this.urlData.viewUri === '/meter/v1/entrust_attachment/preview/') {
// const id = data.entrustId
// const result = await meterEntrust.entrustPreview(id)
// console.log(result)
// } else {
// const id = data.contractId
// const result = await meterEntrust.attachmentPreview(id)
// console.log(result)
// }
// this.$store.dispatch(this.urlData.uri, this.id).then(() => {
// const viewUri = this.urlData.viewUri
// const result = this.$store.state[this.urlData.msg].list
// const imgViewList = []
// for (let i = 0; i < result.length; i++) {
// imgViewList.push(
// global.baseURL +
// viewUri +
// '?id=' +
// result[i].id +
// '&objectKey=' +
// result[i].objectKey
// )
// }
// this.imgViewList = imgViewList
// // 打开的是当前第几张图片
// const salesUri =
// global.baseURL +
// viewUri +
// '?id=' +
// data.id +
// '&objectKey=' +
// data.objectKey
// const index = this.imgViewList.findIndex(item => item === salesUri)
// if (index === -1) {
// this.imgViewIndex = 0
// } else {
// this.imgViewIndex = index
// }
// })
},
// 删除
_deleteById(id) {
this.$emit('on-result-change', 'delete', id)
},
// 查看方式改变
_view(val) {
this.viewStyle = val
this.selectIds = []
if (val === 1) {
this._formSearch()
}
},
_chkVal(val) {
this.selectIds = val
},
// 一系列操作返回的值
_radioChange(val) {
if (val === 'down') {
if (this.objectKey.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._downloadAll(this.objectKey)
}
}
if (val === 'delete') {
if (this.selectIds.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._deleteById(this.selectIds)
}
}
},
_tableChange(val) {
if (val === 'down') {
if (this.objectKey.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._downloadAll(this.objectKey)
}
}
if (val === 'delete') {
if (this.Ids.length === 0) {
this.$Message.warning('请至少选择一条数据!')
} else {
this._deleteById(this.Ids)
}
}
},
// 批量打包下载
_downloadAll(ids) {
window.open(
global.baseURL + this.urlData.downloadBatch + '?objectKeys=' + ids
)
},
_beupload(file) {
this.dataObj.file = file.name
},
_handelprogress(event, file, fileList) {
this.isLoad = true
},
_handelsuccess(response, file, fileList) {
// 上传成功
if (response.success) {
this.isLoad = false
this.$Message.success('上传成功！')
this._page()
} else {
this.isLoad = true
this.$Message.error(response.msg)
this.isLoad = false
}
}
}
}
</script>
<style>
.radio-display.ivu-radio-group-button .ivu-radio-wrapper:first-child {
border-radius: 4px !important;
margin-right: 5px !important;
}
.radio-display. .ivu-radio-wrapper:last-child {
border-radius: 4px !important;
border-left: 1px solid #dddee1 !important;
}
.samllJpg {
width: 15%;
height: auto;
}
</style>
pages/meter-aptitude/early-warning/LmsEnvNormalMonitor.vue
......@@ -6,7 +6,7 @@
<Row>
<!--查询-->
<Col span="24" style="margin-top: 10px">
<Form id="search-form" :label-width="50" inline onsubmit="return false">
<Form id="search-form" :label-width="80" inline onsubmit="return false">
<label class="label-sign"></label>
<Form-item class="width-23" label="位置:">
<input name="type" type="hidden" value=0>
......
pages/soil-alone-sample-instock/EntrustRegister.vue
......@@ -57,6 +57,8 @@
import { soilEntrust, soilSample } from '../../api'
import Operation from '../../components/operation/Operation'
import importModal from '../../components/import/DownloadTemplateImport'
import photoManage from '../../components/file/instock-file-manage/FileManage'
import sampleFileManage from '../../components/file/sample-file-manage/FileManage'
import EntrustRegisterEdit from './EntrustRegisterEdit'
import RegisterDetail from './RegisterDetail'
import ViewDetail from './ViewDetail'
......@@ -74,7 +76,11 @@ export default {
// eslint-disable-next-line vue/no-unused-components
ViewDetail,
// eslint-disable-next-line vue/no-unused-components
Instock
Instock,
// eslint-disable-next-line vue/no-unused-components
sampleFileManage,
// eslint-disable-next-line vue/no-unused-components
photoManage
},
data() {
return {
......@@ -251,7 +257,7 @@ export default {
},
_uploadPhoto(data) {
// 上传照片文件
this.currentComponent = 'FileManage'
this.currentComponent = 'photoManage'
this.$nextTick(() => {
this.$refs.refModal._open(data.id, 'aloneSampleId', '照片管理')
})
......@@ -404,7 +410,7 @@ export default {
},
_upload(id) {
// 上传文件
this.currentComponent = 'FileManage'
this.currentComponent = 'sampleFileManage'
this.$nextTick(() => {
this.$refs.refModal._open(id, 'aloneSampleId')
})
......
pages/soil-statistics/project-item/ProjectItem.vue
......@@ -91,7 +91,51 @@ export default {
{ title: '工程类型', key: 'projectType', detail: true, width: 140 },
{ title: '工程名称', key: 'projectName', width: 100 },
{ title: '检测项目', key: 'itemNames', width: 110 },
{ title: '数量', key: 'num', width: 110 }
{ title: '数量', key: 'num', width: 110 },
{ title: '比重', key: '比重', width: 110 },
{ title: '导热系数', key: '导热系数', width: 110 },
{ title: '电导率', key: '电导率', width: 110 },
{ title: '界限含水率', key: '界限含水率', width: 110 },
{ title: '颗粒分析-Hyd', key: '颗粒分析-Hyd', width: 110 },
{ title: '颗粒分析-Sieve', key: '颗粒分析-Sieve', width: 110 },
{ title: '密度', key: '密度', width: 110 },
{ title: '渗透', key: '渗透', width: 110 },
{ title: '碳酸盐含量', key: '碳酸盐含量', width: 110 },
{ title: '相对密度', key: '相对密度', width: 110 },
{ title: '点荷载强度', key: '点荷载强度', width: 110 },
{ title: '固结', key: '固结', width: 110 },
{ title: '落锥', key: '落锥', width: 110 },
{ title: '落锥-重塑', key: '落锥-重塑', width: 110 },
{ title: '三轴压缩-CD', key: '三轴压缩-CD', width: 110 },
{ title: '三轴压缩-CU', key: '三轴压缩-CU', width: 110 },
{ title: '三轴压缩-UU', key: '三轴压缩-UU', width: 110 },
{ title: '三轴压缩-UU-重塑', key: '三轴压缩-UU-重塑', width: 110 },
{ title: '手动十字板剪切', key: '手动十字板剪切', width: 110 },
{ title: '无侧限抗压强度', key: '无侧限抗压强度', width: 110 },
{ title: '休止角', key: '休止角', width: 110 },
{ title: '袖珍贯入仪', key: '袖珍贯入仪', width: 110 },
{ title: '直接剪切', key: '直接剪切', width: 110 },
{ title: '波速模量', key: '波速模量', width: 110 },
{ title: '液化', key: '液化', width: 110 },
{ title: '触变', key: '触变', width: 110 },
{ title: '动单剪', key: '动单剪', width: 110 },
{ title: '共振柱', key: '共振柱', width: 110 },
{ title: '静单剪', key: '静单剪', width: 110 },
{
title: '实验室微型十字板剪切-重塑',
key: '实验室微型十字板剪切-重塑',
width: 110
},
{ title: '蠕变', key: '蠕变', width: 110 },
{ title: '应变控制加荷固结', key: '应变控制加荷固结', width: 110 },
{
title: '实验室微型十字板剪切',
key: '实验室微型十字板剪切',
width: 110
},
{ title: '含水率', key: '含水率', width: 110 },
{ title: '颗粒分析-200', key: '颗粒分析-200', width: 110 },
{ title: '无侧限抗压强度-重塑', key: '无侧限抗压强度-重塑', width: 110 }
],
groupData: [],
getPage: {},
......@@ -172,6 +216,14 @@ export default {
this.$serializeFormSearch(this.formObj)
)
if (result) {
for (let i = 0; i < result.records.length; i++) {
for (let j = 0; j < result.records[i].experimentVOList.length; j++) {
const listName = result.records[i].experimentVOList[j].name
const listNum = result.records[i].experimentVOList[j].itemCount
result.records[i][listName] = listNum
}
}
console.log('result', result)
this.getPage = result
this.$refs.pageTable._hideLoading()
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment