<!doctype html>
|
<html>
|
<head>
|
<meta charset="utf-8">
|
<title>上传附件</title>
|
<script src="../../js/vue/vue.js"></script>
|
<script src="../../js/vue/element-ui/lib/index.js"></script>
|
<script src="../../js/vue/page.js"></script>
|
<script src="../../js/myelement.js"></script>
|
|
<link href="../../js/vue/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
|
<link href="../../css/myelement.css" rel="stylesheet">
|
<link href="../../css/iconfont.css" rel="stylesheet">
|
<link href="../../css/page.css" rel="stylesheet">
|
<link href="//at.alicdn.com/t/font_2374495_mkoo966o0uo.css" rel="stylesheet">
|
</head>
|
|
<body style="margin: 0px;">
|
<div id="vbody">
|
<div id="page_root">
|
<div ref="popup_body" style="width: 400px; height: 490px;padding-right: 20px;">
|
<div class="el-dialog__header">
|
<div class="dialog-title">
|
<i class="iconfont icon-customermanagement"></i>
|
<span> {{formAttr.title}} </span>
|
</div>
|
</div>
|
<div class="el-dialog__body"style="height: 350px;">
|
<!-- <el-upload action="https://jsonplaceholder.typicode.com/posts/" style="height: 100px;">
|
<el-button size="small" type="primary">点击上传</el-button>
|
</el-upload> -->
|
<el-button type="default" @click="onPopupByUploadFile">上传附件</el-button>
|
|
<div style="margin-top: 20px; height: 230px" align="center">
|
<div v-if="!imgUrl" v-for="(item, index) in fileList" >
|
<img :src="item.url" alt="图" height="120px" style="float: left;"/>
|
</div>
|
<div v-if="imgUrl" >
|
<img :src="imgUrl" alt="图" height="230px" style="float: left;"/>
|
</div>
|
</div>
|
</div>
|
<div class="el-dialog__footer" >
|
<el-button type="default" @click="closeDialog">关 闭</el-button>
|
<el-button type="primary" @click="saveRowTable" >保 存</el-button><!-- style="display:none;" -->
|
</div>
|
</div>
|
</div>
|
<div id="page_loading" style="position: absolute; top:0px; width: 100vw; height: 50vh;">
|
<div class="spinner">
|
<div class="cube1"></div>
|
<div class="cube2"></div>
|
</div>
|
</div>
|
</div>
|
<script type="text/javascript">
|
new ListVue({
|
el: "#vbody",
|
data: {
|
role: RootRole,
|
formAttr: {
|
istitle: false,
|
title: "附件信息",
|
columnnumber: 2,
|
labelwidth: "100px",
|
labelposition: "right",
|
size: "medium",
|
border: "0px solid #c6c6c600"
|
},
|
imgUrl: "",
|
popupParames: "",
|
fileList: [
|
{name: "medicine1.jpeg",url: "../../../../img/sjwt1.jpg"},
|
{name: "medicine2.jpeg",url: "../../../../img/sjwt2.jpg"},
|
{name: "medicine3.jpeg",url: "../../../../img/sjwt3.jpg"},
|
],
|
revocationid: "",
|
fileObj: null
|
},
|
|
created() {
|
this.popupParames = clone(Root.popupParames);
|
},
|
mounted() {
|
var me = this;
|
if (this.popupParames.imgUrl) {
|
this.imgUrl = clone(Root.popupParames.imgUrl);
|
}
|
if (this.popupParames.data && this.popupParames.data.id) {
|
me.revocationid = me.popupParames.data.id;
|
popupParames = me.popupParames;
|
getDownloadImgURL(this.popupParames.data.file_id, function(result) {
|
me.imgUrl = result.data.fileurl;
|
});
|
}
|
|
this.$nextTick(() => { // 以服务的方式调用的 Loading 需要异步关闭
|
document.getElementById('page_root').style.display = "block";
|
document.getElementById('page_loading').style.display = "none";
|
|
//重新设置弹窗宽高
|
this.$nextTick(function(){
|
let w_ = this.$refs.popup_body.offsetWidth + "px";
|
let h_ = this.$refs.popup_body.offsetHeight + "px";
|
Root.setPopupWH(w_, h_);
|
})
|
});
|
},
|
|
methods:{
|
closeDialog() {
|
Root.hidePopup();
|
},
|
saveRowTable() {
|
var me = this;
|
if (this.popupParames.callback) {
|
let obj = {
|
row: this.fileObj
|
}
|
this.popupParames.callback(obj, function() {
|
if (me.popupParames.totab) {
|
Root.tab.removeItem(Root.tab.selected);
|
Root.tab.open(me.popupParames.parentOption, false);
|
} else {
|
Root.hidePopup();
|
}
|
});
|
} else {
|
alert("该按键事件缺失！")
|
}
|
},
|
handleChange(file, fileList) {
|
this.fileList = fileList.slice(-4);
|
},
|
|
onServerInitData(data) {
|
var me = this.data;
|
},
|
|
onPopupByUploadFile() {
|
var me = this;
|
|
var config = {
|
totab: false,
|
width: "1500px",
|
icon: "icon-product",
|
text: "附件上传",
|
id: "popupByUploadFile",
|
url: "../tool/popup_uploadFile.html",
|
data: {},
|
delta: {filetypelist: [".png", ".jpg"]},
|
callback: function(obj, callback) {
|
me.fileObj = obj;
|
|
getDownloadImgURL(obj.row[0].id, function(result) {
|
me.imgUrl = result.data.fileurl;
|
});
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
this.doPopupByPublic(config);
|
},
|
|
doPopupByPublic(config) {
|
if (config.totab) {
|
if (config.url) {
|
if (config.text.length > 4) {
|
config.text = config.text.substr(0, 4) + "...";
|
}
|
}
|
|
var callback_ = config.callback;
|
var parames = {
|
url: config.url,
|
sceneCode: config.sceneCode,
|
data: config.data,
|
delta: config.delta,
|
disabled: config.disabled,
|
disabledone: config.disabledone,
|
operationtype: config.operationtype,
|
parentOption: window.top.tab.selected.option,
|
callback: function(obj, callback) {
|
if (callback_) {
|
callback_(obj);
|
}
|
if (callback) {
|
callback();
|
}
|
}
|
};
|
|
Root.popupParames = parames;
|
|
window.top.tab.open(config);
|
}
|
else {
|
this.doPopup(config);
|
}
|
},
|
|
}
|
});
|
</script>
|
|
<style>
|
.el-input__inner{
|
padding: 0 2px;
|
}
|
</style>
|
|
</body>
|
</html>
|
