<template>
|
<div class="app-container">
|
<div>
|
<el-select v-model="queryForm.filetype" clearable placeholder="请选择文件类型">
|
<el-option
|
class="filter-item"
|
@keyup.enter.native="queryHandle"
|
v-for="item in fileType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
<el-button v-if="getBtnPermission('add')" class="filter-item" style="margin-left: 10px;" type="primary"
|
icon="el-icon-plus" @click="showCreateHandle">新增
|
</el-button>
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-refresh"
|
@click="refreshHandle">刷新
|
</el-button>
|
<el-button class="filter-item" style="margin-left: 10px;" type="primary" icon="el-icon-search"
|
@click="queryHandle"/>
|
</div>
|
<div class="table_content">
|
<el-table
|
v-loading="listLoading"
|
:key="tableKey"
|
:data="appFileData"
|
border
|
fit
|
highlight-current-row
|
style="width: 100%;"
|
@sort-change="sortChange"
|
>
|
<el-table-column type="index" label="序号" align="center" width="80"/>
|
<el-table-column label="文件类型" prop="filetype" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.filetype }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="文件名称" prop="filename" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.filename }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="文件链接" prop="fileurl" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span style="color:blue;cursor:pointer"
|
@click="downloadHandle(scope.row.fileurl)"
|
>{{ uploadUrl + scope.row.fileurl }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="版本号" prop="version" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.version }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="备注" prop="remark" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.remark }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="创建时间" prop="created" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.created | parseTime('{y}-{m}-{d}') }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="更新时间" prop="updated" align="center" sortable="custom">
|
<template slot-scope="scope">
|
<span>{{ scope.row.updated | parseTime('{y}-{m}-{d}') }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column label="操作" align="center" width="240" class-name="small-padding fixed-width">
|
<template slot-scope="scope">
|
<el-button v-if="getBtnPermission('edit')" type="text" @click="showEditHandle(scope.row)">编辑</el-button>
|
<el-button v-if="getBtnPermission('delete')" type="text" style="color:red;" @click="deleteHandle(scope.row)">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
<br>
|
<el-pagination
|
v-show="recordTotal>0"
|
:current-page="currentPage"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="pageSize"
|
:total="recordTotal"
|
layout="total, sizes, prev, pager, next, jumper"
|
background
|
style="float:right;"
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
/>
|
</div>
|
<el-dialog :title="dialogStatus==='create'?'新增':'编辑'" :visible.sync="dialogFormVisible"
|
:modal-append-to-body="false" :close-on-click-modal="false" width="600px">
|
<el-form ref="dataForm" :rules="dataFormRules" :model="dataForm" label-position="right" label-width="140px"
|
style="margin-left:30px;width:550px;" element-loading-text="保存中...">
|
<el-row>
|
<el-col :span="13">
|
<el-form-item label="文件类型:" prop="filetype">
|
<el-select v-model="dataForm.filetype" clearable placeholder="请选择文件类型">
|
<el-option
|
class="filter-item"
|
@keyup.enter.native="queryHandle"
|
v-for="item in fileType"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="15">
|
<el-form-item label="文件名称:" prop="filename">
|
<el-input v-model.trim="dataForm.filename" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-form-item label="上传文件:">
|
<input id="importFileInput" ref="importFileInput" type="file" accept=""/>
|
</el-form-item>
|
<el-row>
|
<el-col :span="12">
|
<el-form-item label="版本号:" prop="version">
|
<el-input v-model.trim="dataForm.version" type="number"/>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
<el-row>
|
<el-col :span="20">
|
<el-form-item label="备注:" prop="remark">
|
<el-input v-model.trim="dataForm.remark" />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="dialogFormVisible = false">取消</el-button>
|
<el-button type="primary" @click="dialogStatus==='create'?createHandle():updateHandle()">确认</el-button>
|
</div>
|
</el-dialog>
|
<div style="clear: both;"></div>
|
</div>
|
</template>
|
|
<script>
|
import Cookies from 'js-cookie'
|
import { checkBtnPermission} from "../../utils/permission";
|
import { appFileList, addAppFile, editAppFile, delAppFile } from "@/api/appfile";
|
import { parseError} from "../../utils/messageDialog";
|
import { computePageCount} from "../../utils";
|
import { mapGetters} from "vuex";
|
import { dictionaryAllItems } from '@/api/dictionary';
|
import { Message, MessageBox } from 'element-ui'
|
|
export default {
|
name: "appfile",
|
filters : {
|
parseGX(value){
|
let arr = value.split('-');
|
let guanxia='';
|
for (let i = 0; i < arr.length; i++){
|
if (arr[i] == null || arr[i] == '' || arr[i] == 'null'){
|
}else {
|
if (i == 0){
|
guanxia = arr[i];
|
}else {
|
guanxia += '-'+arr[i];
|
}
|
}
|
}
|
return guanxia;
|
}
|
},
|
data() {
|
return {
|
baseUrl: process.env.IMG_API + 'contract/',
|
uploadUrl: process.env.IMG_API,
|
pageSize: 10,
|
recordTotal: 0,
|
currentPage: 1,
|
pageTotal: 0,
|
tableKey: 0,
|
appFileData: null,
|
listLoading: true,
|
dataForm: {
|
id: '',
|
filetype: '',
|
filename:'',
|
fileurl:'',
|
version:'',
|
remark:'',
|
file:'',
|
},
|
queryForm: {
|
filetype:'',
|
},
|
dialogFormVisible: false,
|
dialogStatus: '',
|
dataFormRules: {
|
filetype: [{required: true, message: '文件类型不能为空', trigger: 'blur'}],
|
version: [{required: true, message: '版本不能为空', trigger: 'blur'}],
|
},
|
fileType:[],
|
productVoList:[],
|
productVoDialogVisible:false,
|
|
productDialogFormVisible:false,
|
productData:[],
|
pageSizeProduct: 10,
|
currentPageProduct: 1,
|
recordTotalProduct: 0,
|
pageTotalProduct: 0,
|
queryProductForm: {
|
name: '',
|
manufacturer:'',
|
directionCode:'',
|
type:'',
|
},
|
|
manufacturer:'',
|
enterpriseList : [],
|
enterpriseDialogFormVisible:false,
|
pageSizeEnterpise: 10,
|
currentPageEnterpise: 1,
|
recordTotalEnterpise: 0,
|
pageTotalEnterpise: 0,
|
}
|
},
|
created() {
|
this.getAppFileListList();
|
this.getDictionaryStatusList();
|
},
|
computed: {
|
...mapGetters([
|
'userType',
|
'username'
|
])
|
},
|
methods: {
|
handleSizeChangeProduct: function (val) {
|
this.pageSizeProduct = val
|
this.currentPageProduct = 1
|
this.getProductList()
|
},
|
handleCurrentChangeProduct: function (val) {
|
this.currentPageProduct = val
|
this.getProductList()
|
},
|
getDictionaryStatusList(){
|
const _this = this
|
if (_this.fileType && _this.fileType.length > 0) {
|
return
|
}
|
const params = {}
|
params['dictionaryType'] = 'APP版本'
|
dictionaryAllItems(params).then(response => {
|
const res = response.data
|
if (res.code == 200) {
|
_this.fileType = res.result
|
} else {
|
parseError({ error: res.message, vm: _this })
|
}
|
}).catch(error => {
|
parseError({ error: error, vm: _this })
|
})
|
},
|
getAppFileListList() {
|
const _this = this
|
const params = {}
|
params['pageIndex'] = _this.currentPage
|
params['pageSize'] = _this.pageSize
|
params['sort'] = _this.sort
|
params['order'] = _this.order
|
for (const i in _this.queryForm) {
|
if (_this.queryForm[i] != undefined && _this.queryForm[i].toString() != '') {
|
params[i] = _this.queryForm[i]
|
}
|
}
|
_this.listLoading = true
|
appFileList(params).then(response => {
|
const res = response.data;
|
if (res.code == 200) {
|
const result = res.result;
|
_this.recordTotal = result.totalCount;
|
_this.pageSize = result.pageSize;
|
_this.pageTotal = computePageCount(result.totalCount, result.pageSize);
|
_this.currentPage = result.pageIndex;
|
_this.appFileData = result.result
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
_this.listLoading = false
|
}).catch(error => {
|
_this.listLoading = false
|
parseError({error: error, vm: _this})
|
})
|
},
|
createHandle: function () {
|
const _this = this
|
this.$refs['dataForm'].validate((valid) => {
|
if (valid) {
|
const formData = new FormData();
|
const files = this.$refs["importFileInput"].files;
|
if (files.length > 0){
|
formData.append('file', files[0]);
|
}else {
|
parseError({ error: '请上传文件', vm: this })
|
return
|
}
|
formData.append('filetype', _this.dataForm.filetype);
|
formData.append('filename', _this.dataForm.filename);
|
formData.append('version', _this.dataForm.version);
|
formData.append('remark', _this.dataForm.remark);
|
addAppFile(formData).then(response => {
|
const res = response.data
|
if (res.code == 200) {
|
_this.dialogFormVisible = false
|
_this.$message({
|
message: '创建成功',
|
type: 'success'
|
});
|
_this.getAppFileListList()
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
}).catch(error => {
|
parseError({error: error, vm: _this})
|
})
|
}
|
})
|
},
|
deleteHandle: function (row) {
|
const _this = this
|
MessageBox.confirm('确定删除信息', '确定删除', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
type: 'warning'
|
}).then(() => {
|
_this.deleteAction(row)
|
}).catch(() => {
|
console.log('已取消删除')
|
})
|
},
|
deleteAction: function (row) {
|
const _this = this;
|
const params = {}
|
params['id'] = row.id;
|
delAppFile(params).then(response => {
|
const res = response.data
|
if (res.code == 200) {
|
_this.$message({
|
message: '删除成功',
|
type: 'success'
|
})
|
_this.getAppFileListList()
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
}).catch(error => {
|
parseError({error: error, vm: _this})
|
})
|
},
|
refreshHandle: function () {
|
this.getAppFileListList()
|
},
|
queryHandle: function () {
|
this.currentPage = 1
|
this.getAppFileListList()
|
},
|
resetDataForm() {
|
this.dataForm = {
|
id: '',
|
filetype: '',
|
filename:'',
|
fileurl:'',
|
version:'',
|
remark:'',
|
}
|
},
|
showCreateHandle() {
|
this.resetDataForm()
|
this.dialogStatus = 'create'
|
this.dialogFormVisible = true
|
this.$nextTick(() => {
|
this.$refs['dataForm'].clearValidate()
|
})
|
},
|
updateHandle() {
|
this.$refs['dataForm'].validate((valid) => {
|
const _this = this
|
if (valid) {
|
const formData = new FormData();
|
formData.append('id', _this.dataForm['id']);
|
formData.append('filetype', _this.dataForm['filetype']);
|
formData.append('filename', _this.dataForm.filename);
|
formData.append('version', _this.dataForm.version);
|
formData.append('remark', _this.dataForm.remark);
|
const files = this.$refs["importFileInput"].files;
|
if (files.length > 0){
|
formData.append('file', files[0]);
|
}
|
editAppFile(formData).then(response => {
|
const res = response.data
|
if (res.code == 200) {
|
_this.dialogFormVisible = false
|
_this.$message({
|
message: '更新成功',
|
type: 'success'
|
});
|
_this.getAppFileListList()
|
} else {
|
parseError({error: res.message, vm: _this})
|
}
|
}).catch(error => {
|
parseError({error: error, vm: _this})
|
})
|
}
|
})
|
},
|
showEditHandle: function (row) {
|
this.resetDataForm();
|
this.dialogStatus = 'editor';
|
this.dataForm.id = row.id;
|
this.dataForm.filetype = row.filetype;
|
this.dataForm.filename = row.filename;
|
this.dataForm.fileurl = row.fileurl;
|
this.dataForm.version = row.version;
|
this.dataForm.remark = row.remark;
|
this.dialogFormVisible = true;
|
this.$nextTick(() => {
|
this.$refs['dataForm'].clearValidate()
|
})
|
},
|
handleSizeChange: function (val) {
|
this.pageSize = val
|
this.currentPage = 1
|
this.getAppFileListList()
|
},
|
|
handleCurrentChange: function (val) {
|
this.currentPage = val
|
this.getAppFileListList()
|
},
|
|
getBtnPermission(btnType) {
|
return checkBtnPermission(this.userType, btnType)
|
},
|
|
sortChange(param){
|
this.sort = param.prop;
|
this.order = param.order;
|
this.getAppFileListList();
|
},
|
|
showProductHandle(){
|
this.productDialogFormVisible = true;
|
},
|
|
showEnterprise(){
|
this.enterpriseDialogFormVisible = true;
|
},
|
|
downloadHandle(fileurl){
|
window.open(this.uploadUrl + fileurl, '_blank');
|
},
|
|
}
|
}
|
</script>
|
|
<style scoped>
|
|
</style>
|
