赋能场景按钮顺序
This commit is contained in:
a0049873
parent
508669b7c5
commit
88d84bbcb5
|
|
@ -88,9 +88,8 @@
|
|||
</el-form>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
<el-button @click="closeModal">{{ $t("cancel") }}</el-button>
|
||||
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,6 @@
|
|||
<el-dialog custom-class="customClass" :visible.sync="areaVisibleCopy" :title="modalTypeText[modalType]"
|
||||
@close="closeModal" :close-on-click-modal="false" :close-on-press-escape="false">
|
||||
|
||||
|
||||
<!-- 挂载和修改 -->
|
||||
<div class="right">
|
||||
<el-form :model="dataForm" :rules="rules" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
|
||||
|
|
@ -52,12 +51,11 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</el-form>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
<el-button @click="closeModal">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
|
@ -83,14 +81,14 @@ export default {
|
|||
watch: {
|
||||
|
||||
dataForm: {
|
||||
handler(newVal) {
|
||||
handler (newVal) {
|
||||
this.dataForm = newVal
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
},
|
||||
areaVisible: {
|
||||
handler(newVal) {
|
||||
handler (newVal) {
|
||||
this.getSceneArea()
|
||||
this.getArea()
|
||||
this.areaVisibleCopy = newVal
|
||||
|
|
@ -112,25 +110,25 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
areas:[],//所属区市
|
||||
sceneAreas:[],
|
||||
areas: [], // 所属区市
|
||||
sceneAreas: [],
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
|
||||
dataForm: {
|
||||
district: 1,//0市级，1基层
|
||||
area: '',//所属区市
|
||||
district: 1, // 0市级，1基层
|
||||
area: '', // 所属区市
|
||||
infrastructureCount: null,
|
||||
dataSourceCount: null,
|
||||
componentCount: null,
|
||||
name: '',
|
||||
applicationArea: '',//赋能领域
|
||||
applicationArea: '', // 赋能领域
|
||||
description: '',
|
||||
sceneUrl: '',
|
||||
fuseAttrList: [
|
||||
{
|
||||
attrType: '构建步骤',
|
||||
attrValue: [{ question: '', answer: [{ 'answer': '' }, { 'answer': '' }] }]
|
||||
attrValue: [{ question: '', answer: [{ answer: '' }, { answer: '' }] }]
|
||||
},
|
||||
{
|
||||
attrType: '基础设施',
|
||||
|
|
@ -156,7 +154,7 @@ export default {
|
|||
attrType: '服务图片',
|
||||
attrValue: ''
|
||||
}
|
||||
],
|
||||
]
|
||||
|
||||
},
|
||||
rules: {
|
||||
|
|
@ -186,7 +184,7 @@ export default {
|
|||
abilityListObj: {},
|
||||
imgData: [],
|
||||
// 限定图片
|
||||
handleExceed() {
|
||||
handleExceed () {
|
||||
this.$message({ type: 'error', message: '最多支持一张图片上传' })
|
||||
},
|
||||
imageUrl: ''
|
||||
|
|
@ -194,8 +192,8 @@ export default {
|
|||
},
|
||||
|
||||
methods: {
|
||||
//获取所属区市
|
||||
getArea(){
|
||||
// 获取所属区市
|
||||
getArea () {
|
||||
const params = {
|
||||
pid: '250000'
|
||||
}
|
||||
|
|
@ -207,8 +205,8 @@ export default {
|
|||
this.areas = res.data.data
|
||||
})
|
||||
},
|
||||
//获取赋能场景
|
||||
getSceneArea() {
|
||||
// 获取赋能场景
|
||||
getSceneArea () {
|
||||
const params = {
|
||||
topCategoryName: '应用资源'
|
||||
}
|
||||
|
|
@ -221,18 +219,16 @@ export default {
|
|||
})
|
||||
},
|
||||
|
||||
clearForm() {
|
||||
clearForm () {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields()
|
||||
},
|
||||
closeModal() {
|
||||
closeModal () {
|
||||
this.$emit('closeModal')
|
||||
},
|
||||
|
||||
|
||||
// 表单提交
|
||||
dataFormSubmitHandle: debounce(
|
||||
function () {
|
||||
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
if (!valid) {
|
||||
this.$message.error('请检查表单是否填写完整')
|
||||
|
|
@ -253,10 +249,9 @@ export default {
|
|||
})
|
||||
|
||||
this.dataForm.fuseAttrList.forEach(item => {
|
||||
if(item.attrType!=='服务图片'){
|
||||
item.attrValue = JSON.stringify(item.attrValue);
|
||||
if (item.attrType !== '服务图片') {
|
||||
item.attrValue = JSON.stringify(item.attrValue)
|
||||
}
|
||||
|
||||
})
|
||||
this.$http
|
||||
[methodsObj[this.modalType]]('/fuse', _obj)
|
||||
|
|
@ -284,16 +279,16 @@ export default {
|
|||
{ leading: true, trailing: false }
|
||||
),
|
||||
// 详情
|
||||
getDetail(data) {
|
||||
getDetail (data) {
|
||||
this.dataForm = data
|
||||
},
|
||||
handleAvatarSuccess(res, file) {
|
||||
handleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
beforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
|
|
@ -303,11 +298,11 @@ export default {
|
|||
}
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile(file, fileList) {
|
||||
addUploadRemoveFile (file, fileList) {
|
||||
this.$refs.addUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
editBeforeAvatarUpload(file) {
|
||||
editBeforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
|
|
@ -318,22 +313,21 @@ export default {
|
|||
}
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile(file, fileList) {
|
||||
editUploadRemoveFile (file, fileList) {
|
||||
this.$refs.editUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
eidtHandleAvatarSuccess(res, file) {
|
||||
eidtHandleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
mounted () {
|
||||
},
|
||||
beforeDestroy() {
|
||||
beforeDestroy () {
|
||||
this.clearForm()
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -368,14 +362,11 @@ export default {
|
|||
background-position-y: 22px;
|
||||
}
|
||||
|
||||
|
||||
|
||||
.right {
|
||||
width: 770px;
|
||||
margin-left: 100px;
|
||||
margin-top: 24px;
|
||||
|
||||
|
||||
.info-inner {
|
||||
|
||||
margin-left: 10px;
|
||||
|
|
@ -392,7 +383,6 @@ export default {
|
|||
|
||||
border-radius: 2px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.baseTitle {
|
||||
|
|
@ -404,7 +394,6 @@ export default {
|
|||
background: url("~@/assets/img/biaoti.png") no-repeat;
|
||||
background-position-y: 2px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.baseInner {
|
||||
|
|
@ -438,7 +427,6 @@ export default {
|
|||
height: 580px;
|
||||
overflow: auto;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
|
|
@ -558,4 +546,3 @@ export default {
|
|||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -22,7 +22,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 挂载和修改 -->
|
||||
<div class="right">
|
||||
<el-form :model="dataForm" :rules="rules" ref="dataForm" @keyup.enter.native="dataFormSubmitHandle()"
|
||||
|
|
@ -140,8 +139,8 @@
|
|||
</el-form>
|
||||
</div>
|
||||
<template slot="footer">
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
<el-button @click="closeModal">{{ $t("cancel") }}</el-button>
|
||||
<el-button type="primary" @click="dataFormSubmitHandle()">提交</el-button>
|
||||
|
||||
</template>
|
||||
</el-dialog>
|
||||
|
|
@ -160,7 +159,6 @@ import InfrastructureModal from './components/infrastructure-modal.vue'
|
|||
import Cookies from 'js-cookie'
|
||||
import upload from '@/views/modules/components/upload'
|
||||
|
||||
|
||||
export const getDescJson = (text) => {
|
||||
return {
|
||||
descObj: {
|
||||
|
|
@ -189,14 +187,14 @@ export default {
|
|||
watch: {
|
||||
|
||||
dataForm: {
|
||||
handler(newVal) {
|
||||
handler (newVal) {
|
||||
this.dataForm = newVal
|
||||
},
|
||||
deep: true,
|
||||
immediate: true
|
||||
},
|
||||
cityVisible: {
|
||||
handler(newVal) {
|
||||
handler (newVal) {
|
||||
this.getSceneArea()
|
||||
this.cityVisibleCopy = newVal
|
||||
if (this.modalType == 'add' && newVal) {
|
||||
|
|
@ -218,42 +216,42 @@ export default {
|
|||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
data () {
|
||||
return {
|
||||
domArr: [],
|
||||
scrollTop: 0,
|
||||
selectNow: '',
|
||||
activeStepIndex: 0,//选择的步骤
|
||||
activeStepIndex: 0, // 选择的步骤
|
||||
activeStepIndexs: 0,
|
||||
baseTypeList: [{ value: '视频资源', label: '视频资源' }, { value: '云资源', label: '云资源' }, { value: '其他', label: '其他' }],
|
||||
componetTypeList: [{ value: '智能算法', label: '智能算法' }, { value: ' 图层服务', label: ' 图层服务' },
|
||||
{ value: '开发组件', label: '开发组件' }, { value: '业务组件', label: '业务组件' }],
|
||||
dataTypeList: [{ value: '数据', label: '数据' }],
|
||||
sceneAreas: [],//赋能领域
|
||||
sceneAreas: [], // 赋能领域
|
||||
|
||||
steps: [{ 'name': '基本信息', 'id': "anchor1" },
|
||||
{ 'name': '场景痛点', 'id': "anchor2" },
|
||||
{ 'name': '解决方案', 'id': "anchor3" },
|
||||
{ 'name': '使用能力', 'id': "anchor4" },
|
||||
{ 'name': '构建步骤', 'id': "anchor5" }],
|
||||
steps: [{ name: '基本信息', id: 'anchor1' },
|
||||
{ name: '场景痛点', id: 'anchor2' },
|
||||
{ name: '解决方案', id: 'anchor3' },
|
||||
{ name: '使用能力', id: 'anchor4' },
|
||||
{ name: '构建步骤', id: 'anchor5' }],
|
||||
fileUploadUrl: window.SITE_CONFIG.apiURL + '/upload',
|
||||
|
||||
painKeyTextObj: getDescJson('痛点'),
|
||||
solutionKeyTextObj: getDescJson('方案'),
|
||||
dataForm: {
|
||||
district: 0,//市级
|
||||
area: '',//所属区市
|
||||
district: 0, // 市级
|
||||
area: '', // 所属区市
|
||||
infrastructureCount: null,
|
||||
dataSourceCount: null,
|
||||
componentCount: null,
|
||||
name: '',
|
||||
applicationArea: '',//赋能领域
|
||||
applicationArea: '', // 赋能领域
|
||||
description: '',
|
||||
sceneUrl: '',
|
||||
fuseAttrList: [
|
||||
{
|
||||
attrType: '构建步骤',
|
||||
attrValue: [{ question: '', answer: [{ 'answer': '' }, { 'answer': '' }] }]
|
||||
attrValue: [{ question: '', answer: [{ answer: '' }, { answer: '' }] }]
|
||||
},
|
||||
{
|
||||
attrType: '基础设施',
|
||||
|
|
@ -279,7 +277,7 @@ export default {
|
|||
attrType: '服务图片',
|
||||
attrValue: ''
|
||||
}
|
||||
],
|
||||
]
|
||||
|
||||
},
|
||||
rules: {
|
||||
|
|
@ -318,7 +316,7 @@ export default {
|
|||
abilityListObj: {},
|
||||
imgData: [],
|
||||
// 限定图片
|
||||
handleExceed() {
|
||||
handleExceed () {
|
||||
this.$message({ type: 'error', message: '最多支持一张图片上传' })
|
||||
},
|
||||
imageUrl: ''
|
||||
|
|
@ -327,16 +325,14 @@ export default {
|
|||
|
||||
methods: {
|
||||
|
||||
|
||||
handleStep(item, index) {
|
||||
handleStep (item, index) {
|
||||
this.activeStepIndex = index
|
||||
this.selectNow = item.id // 设置选中的锚点为当前点击的
|
||||
let top = document.querySelector('#' + item.id).offsetTop - 100
|
||||
document.querySelectorAll(".customClass .el-dialog__body")[0].scrollTop = top
|
||||
|
||||
const top = document.querySelector('#' + item.id).offsetTop - 100
|
||||
document.querySelectorAll('.customClass .el-dialog__body')[0].scrollTop = top
|
||||
},
|
||||
//获取赋能场景
|
||||
getSceneArea() {
|
||||
// 获取赋能场景
|
||||
getSceneArea () {
|
||||
const params = {
|
||||
topCategoryName: '应用资源'
|
||||
}
|
||||
|
|
@ -349,23 +345,22 @@ export default {
|
|||
})
|
||||
},
|
||||
|
||||
clearForm() {
|
||||
clearForm () {
|
||||
this.$refs.dataForm && this.$refs.dataForm.resetFields()
|
||||
},
|
||||
closeModal() {
|
||||
closeModal () {
|
||||
this.$emit('closeModal')
|
||||
},
|
||||
// 更新表单
|
||||
updateDataForm(data) {
|
||||
updateDataForm (data) {
|
||||
this.dataForm.fuseAttrList.map(v => {
|
||||
if (v.attrType === data.title) {
|
||||
v.attrValue = data.list
|
||||
}
|
||||
})
|
||||
|
||||
},
|
||||
//更新数量
|
||||
updateCount(data) {
|
||||
// 更新数量
|
||||
updateCount (data) {
|
||||
if (data.title === '基础设施') {
|
||||
this.dataForm.infrastructureCount = data.count
|
||||
}
|
||||
|
|
@ -375,13 +370,11 @@ export default {
|
|||
if (data.title === '数据资源') {
|
||||
this.dataForm.dataSourceCount = data.count
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
// 表单提交
|
||||
dataFormSubmitHandle: debounce(
|
||||
function () {
|
||||
|
||||
this.$refs.dataForm.validate((valid) => {
|
||||
if (!valid) {
|
||||
this.$message.error('请检查表单是否填写完整')
|
||||
|
|
@ -401,10 +394,9 @@ export default {
|
|||
type: '赋能场景'
|
||||
})
|
||||
this.dataForm.fuseAttrList.forEach(item => {
|
||||
if(item.attrType!=='服务图片'){
|
||||
item.attrValue = JSON.stringify(item.attrValue);
|
||||
if (item.attrType !== '服务图片') {
|
||||
item.attrValue = JSON.stringify(item.attrValue)
|
||||
}
|
||||
|
||||
})
|
||||
this.$http
|
||||
[methodsObj[this.modalType]]('/fuse', _obj)
|
||||
|
|
@ -432,7 +424,7 @@ export default {
|
|||
{ leading: true, trailing: false }
|
||||
),
|
||||
// 详情
|
||||
getDetail(data) {
|
||||
getDetail (data) {
|
||||
this.dataForm = data
|
||||
this.$nextTick(() => {
|
||||
for (const key in this.refsParseArray) {
|
||||
|
|
@ -440,19 +432,15 @@ export default {
|
|||
}
|
||||
const _imgObj = data.fuseAttrList.find(v => v.attrType == '服务图片') || {}
|
||||
this.imageUrl = _imgObj.attrValue
|
||||
|
||||
|
||||
|
||||
})
|
||||
|
||||
},
|
||||
handleAvatarSuccess(res, file) {
|
||||
handleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
},
|
||||
beforeAvatarUpload(file) {
|
||||
beforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
|
|
@ -462,11 +450,11 @@ export default {
|
|||
}
|
||||
return isImage
|
||||
},
|
||||
addUploadRemoveFile(file, fileList) {
|
||||
addUploadRemoveFile (file, fileList) {
|
||||
this.$refs.addUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
editBeforeAvatarUpload(file) {
|
||||
editBeforeAvatarUpload (file) {
|
||||
const isImage =
|
||||
file.type === 'image/jpeg' ||
|
||||
file.type === 'image/jpg' ||
|
||||
|
|
@ -477,54 +465,45 @@ export default {
|
|||
}
|
||||
return isImage
|
||||
},
|
||||
editUploadRemoveFile(file, fileList) {
|
||||
editUploadRemoveFile (file, fileList) {
|
||||
this.$refs.editUpload.clearFiles()
|
||||
this.imageUrl = ''
|
||||
},
|
||||
eidtHandleAvatarSuccess(res, file) {
|
||||
eidtHandleAvatarSuccess (res, file) {
|
||||
if (res.code !== 0) {
|
||||
return this.$message.error(res.msg)
|
||||
}
|
||||
this.imageUrl = res.data
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
const that = this;
|
||||
mounted () {
|
||||
const that = this
|
||||
this.$nextTick(() => {
|
||||
document.querySelector(".el-dialog__body").onscroll = function () {
|
||||
|
||||
let top = document.querySelectorAll(".customClass .el-dialog__body")[0].scrollTop - 100
|
||||
document.querySelector('.el-dialog__body').onscroll = function () {
|
||||
const top = document.querySelectorAll('.customClass .el-dialog__body')[0].scrollTop - 100
|
||||
|
||||
if (top < document.querySelector('#anchor1').offsetTop - 100) {
|
||||
that.activeStepIndexs = 0
|
||||
}
|
||||
else if (top < document.querySelector('#anchor2').offsetTop - 100) {
|
||||
} else if (top < document.querySelector('#anchor2').offsetTop - 100) {
|
||||
that.activeStepIndexs = 1
|
||||
}
|
||||
else if (top < document.querySelector('#anchor3').offsetTop - 100) {
|
||||
} else if (top < document.querySelector('#anchor3').offsetTop - 100) {
|
||||
that.activeStepIndexs = 2
|
||||
}
|
||||
else if (top < document.querySelector('#anchor4').offsetTop - 100) {
|
||||
} else if (top < document.querySelector('#anchor4').offsetTop - 100) {
|
||||
that.activeStepIndexs = 3
|
||||
}
|
||||
else if (top < document.querySelector('#anchor5').offsetTop - 100) {
|
||||
} else if (top < document.querySelector('#anchor5').offsetTop - 100) {
|
||||
that.activeStepIndexs = 4
|
||||
} else {
|
||||
that.activeStepIndexs = 0
|
||||
}
|
||||
if (that.activeStepIndex !== that.activeStepIndexs) {
|
||||
that.activeStepIndex = that.activeStepIndexs;
|
||||
that.$forceUpdate();
|
||||
that.activeStepIndex = that.activeStepIndexs
|
||||
that.$forceUpdate()
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
},
|
||||
beforeDestroy() {
|
||||
beforeDestroy () {
|
||||
this.clearForm()
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -632,9 +611,6 @@ export default {
|
|||
border: 4px solid #1160e2;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
.advice {
|
||||
font-size: 10px;
|
||||
color: #1160e2;
|
||||
|
|
@ -653,7 +629,6 @@ export default {
|
|||
margin-left: 157px;
|
||||
margin-top: -5px;
|
||||
|
||||
|
||||
.info-inner {
|
||||
|
||||
margin-left: 10px;
|
||||
|
|
@ -670,7 +645,6 @@ export default {
|
|||
|
||||
border-radius: 2px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.baseTitle {
|
||||
|
|
@ -682,7 +656,6 @@ export default {
|
|||
background: url("~@/assets/img/biaoti.png") no-repeat;
|
||||
background-position-y: 2px;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.baseInner {
|
||||
|
|
@ -716,7 +689,6 @@ export default {
|
|||
height: 580px;
|
||||
overflow: auto;
|
||||
|
||||
|
||||
}
|
||||
|
||||
.icon-input ::v-deep .el-input__inner {
|
||||
|
|
@ -836,4 +808,3 @@ export default {
|
|||
display: block;
|
||||
}
|
||||
</style>
|
||||
|
||||
Loading…
Reference in New Issue