maguoqiang
6 years ago
2 changed files with 269 additions and 0 deletions
@ -0,0 +1,31 @@ |
|||||
|
<template> |
||||
|
<keep-alive include="caseInfoList"> |
||||
|
<component :is="selectComponent"></component> |
||||
|
</keep-alive> |
||||
|
</template> |
||||
|
<script> |
||||
|
import CaseInfoList from './typicalcase' |
||||
|
import CaseInfoDetailView from './typicalcasedetail' |
||||
|
import CaseInfoAdd from './typicalcase-add-or-update' |
||||
|
export default { |
||||
|
data () { |
||||
|
return { |
||||
|
selectComponent: CaseInfoList |
||||
|
} |
||||
|
}, |
||||
|
components: { |
||||
|
CaseInfoList, |
||||
|
CaseInfoDetailView, |
||||
|
CaseInfoAdd |
||||
|
}, |
||||
|
methods: { |
||||
|
init () { |
||||
|
this.selectComponent = CaseInfoList |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang="scss" scoped> |
||||
|
|
||||
|
</style> |
||||
@ -0,0 +1,238 @@ |
|||||
|
<template> |
||||
|
<el-card shadow="never" class="aui-card--fill"> |
||||
|
<div class="mod-news__typicalcase}"> |
||||
|
<el-form :model="dataList" :rules="dataRule" ref="dataForm" @keyup.enter.native="getDataList()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'"> |
||||
|
<el-form-item label="" prop="mainPicture"> |
||||
|
<el-upload disabled |
||||
|
:limit="1" |
||||
|
ref="upload1" |
||||
|
class="upload-demo" |
||||
|
:on-change="handleChange" |
||||
|
action="werwer" |
||||
|
:name="'file'" |
||||
|
:auto-upload="false" |
||||
|
:before-upload="beforeAvatarUpload" |
||||
|
:before-remove="beforeRemove" |
||||
|
list-type="picture-card"> |
||||
|
<el-button disabled>{{"上传文件"}}</el-button> |
||||
|
<div slot="tip" class="" style="width: 272px;font-size: 13px">{{"支持：.jpg/png"}}</div> |
||||
|
</el-upload> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="案例标题" prop="caseTitle" style="width: 40rem;"> |
||||
|
<el-input disabled v-model="dataList.caseTitle" placeholder="" maxlength="40"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="摘要" prop="typicalAbstract" style="width: 40rem;"> |
||||
|
<el-input disabled v-model="dataList.typicalAbstract" placeholder="" maxlength="200" |
||||
|
type="textarea" :rows="5"></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="时间" prop="createdTime" style="width: 40rem;"> |
||||
|
<el-input disabled v-model="dataList.createdTime" placeholder="" maxlength="200"></el-input> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
<!-- 实际案例--> |
||||
|
<div v-for="(item, index) in dataList.caseData" :key="index"> |
||||
|
<div style="text-align: left">{{"案例"+(index+1)}}</div> |
||||
|
<el-form :model="dataForm1" :rules="dataRule" ref="dataForm1" @keyup.enter.native="dataFormSubmitHandle()" :label-width="$i18n.locale === 'en-US' ? '120px' : '80px'"> |
||||
|
<el-form-item label="案例来源" style="width: 40rem;"> |
||||
|
<el-input v-model="item.caseSource" disabled></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="关联案例" style="width: 40rem;"> |
||||
|
<el-input v-model="item.associatedType" placeholder="" disabled></el-input> |
||||
|
</el-form-item> |
||||
|
<el-form-item label="内容描述" style="width: 40rem;"> |
||||
|
<quill-editor ref="text" v-model="item.contentDescription" class="myQuillEditor" :options="editorOption" disabled=""></quill-editor> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
<el-form> |
||||
|
<el-form-item label-width="200px"> |
||||
|
<el-button size="small" style="width: 95px" @click="backToList">返回</el-button> |
||||
|
</el-form-item> |
||||
|
</el-form> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import debounce from 'lodash/debounce' |
||||
|
import mixinViewModule from '@/mixins/view-module' |
||||
|
import { quillEditor } from 'vue-quill-editor' |
||||
|
import 'quill/dist/quill.core.css' |
||||
|
import 'quill/dist/quill.snow.css' |
||||
|
import 'quill/dist/quill.bubble.css' |
||||
|
export default { |
||||
|
mixins: [mixinViewModule], |
||||
|
components: { |
||||
|
quillEditor |
||||
|
}, |
||||
|
data () { |
||||
|
return { |
||||
|
mixinViewModuleOptions: { |
||||
|
getDataListURL: '/cloudAnalysis/typicalcase/detail' + '/' + this.$route.query.id |
||||
|
}, |
||||
|
fileList: [], |
||||
|
visible: false, |
||||
|
content: '', |
||||
|
editorOption: {}, |
||||
|
dataForm: { |
||||
|
id: '', |
||||
|
caseTitle: '', |
||||
|
caseNumber: '', |
||||
|
state: '', |
||||
|
mainPicture: '', |
||||
|
typicalAbstract: '', |
||||
|
revision: '', |
||||
|
delFlag: '', |
||||
|
createdBy: '', |
||||
|
createdTime: '', |
||||
|
updatedBy: '', |
||||
|
updatedTime: '' |
||||
|
}, |
||||
|
dataForm1: { |
||||
|
number: 0, |
||||
|
ids: '', |
||||
|
caseid: '', |
||||
|
content: '', |
||||
|
dynamicItem: [] |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
computed: { |
||||
|
// dataRule () { |
||||
|
// return { |
||||
|
// caseTitle: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// caseNumber: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// state: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// mainPicture: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// typicalAbstract: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// revision: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// delFlag: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// createdBy: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// createdTime: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// updatedBy: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ], |
||||
|
// updatedTime: [ |
||||
|
// { required: true, message: this.$t('validate.required'), trigger: 'blur' } |
||||
|
// ] |
||||
|
// } |
||||
|
// } |
||||
|
}, |
||||
|
methods: { |
||||
|
backToList () { |
||||
|
this.$parent.selectComponent = 'CaseInfoList' |
||||
|
this.$router.push({ path: '/case-typicalcase'}) |
||||
|
}, |
||||
|
// handleChange (file) { |
||||
|
// this.beforeAvatarUpload(file) |
||||
|
// }, |
||||
|
// |
||||
|
// beforeRemove (file, fileList) { |
||||
|
// console.log(file) |
||||
|
// file = null |
||||
|
// this.file1 = file |
||||
|
// this.dataForm.mainPicture = null |
||||
|
// console.log(file) |
||||
|
// // this.canUpload = false; |
||||
|
// }, |
||||
|
// // 限制上传类型和大小 |
||||
|
// beforeAvatarUpload (file) { |
||||
|
// var testmsg = file.name.substring(file.name.lastIndexOf('.') + 1) |
||||
|
// // alert(testmsg) |
||||
|
// const extension = testmsg === 'png' |
||||
|
// const extension2 = testmsg === 'jpg' |
||||
|
// if (!extension && !extension2) { |
||||
|
// this.$message.error('请上传jpg或png格式图片') |
||||
|
// this.$refs.upload1.clearFiles() |
||||
|
// file = null |
||||
|
// this.dataForm.mainPicture = null |
||||
|
// } else { |
||||
|
// this.dataForm.mainPicture = file.name |
||||
|
// this.canUpload = true |
||||
|
// } |
||||
|
// this.file1 = file |
||||
|
// }, |
||||
|
// 动态添加 |
||||
|
addItem () { |
||||
|
this.dataForm1.number++ |
||||
|
this.dataForm1.dynamicItem.push({ |
||||
|
number: this.dataForm1.number, |
||||
|
ids: '', |
||||
|
caseid: '', |
||||
|
content: '' |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
init () { |
||||
|
this.visible = true |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs['dataForm'].resetFields() |
||||
|
if (this.dataForm.id) { |
||||
|
this.getInfo() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
// 获取信息 |
||||
|
getInfo () { |
||||
|
this.$http.get(`/case/typicalcase/${this.dataForm.id}`).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.dataForm = { |
||||
|
...this.dataForm, |
||||
|
...res.data |
||||
|
} |
||||
|
// this.dataForm1.domains = [] |
||||
|
// for (var j = 0; j < res.data.caseData.length; j++) { |
||||
|
// var obj = {} |
||||
|
// obj.label = res.data.data[j].label |
||||
|
// obj.prop = res.data.data[j].prop |
||||
|
// obj.value = res.data.data[j].value |
||||
|
// obj.editable = res.data.data[j].editable |
||||
|
// this.dynamicValidateForm.domains.push(obj) |
||||
|
// } |
||||
|
}).catch(() => {}) |
||||
|
}, |
||||
|
// 表单提交 |
||||
|
dataFormSubmitHandle: debounce(function () { |
||||
|
this.$refs['dataForm'].validate((valid) => { |
||||
|
if (!valid) { |
||||
|
return false |
||||
|
} |
||||
|
this.$http[!this.dataForm.id ? 'post' : 'put']('/typicalcase/addcase', this.dataForm).then(({ data: res }) => { |
||||
|
if (res.code !== 0) { |
||||
|
return this.$message.error(res.msg) |
||||
|
} |
||||
|
this.$message({ |
||||
|
message: this.$t('prompt.success'), |
||||
|
type: 'success', |
||||
|
duration: 500, |
||||
|
onClose: () => { |
||||
|
this.visible = false |
||||
|
this.$emit('refreshDataList') |
||||
|
} |
||||
|
}) |
||||
|
}).catch(() => {}) |
||||
|
}) |
||||
|
}, 1000, { 'leading': true, 'trailing': false }) |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
Loading…
Reference in new issue