fix: post请求改为使用原形链上实例

main
wu.jian2 2 years ago
parent 4f4fecdd75
commit 2a66b40a50

@ -2,27 +2,63 @@
<div class="big-screen-list-wrap">
<div class="internal-box">
<div class="top-search-wrap">
<el-select v-if="catalogInfo !== 'system'" v-model="catalogCode" class="bs-el-select" popper-class="bs-el-select"
placeholder="请选择分组" clearable @change="reSearch">
<el-option v-for="item in catalogList" :key="item.code" :label="item.name" :value="item.code" />
<el-select
v-if="catalogInfo !== 'system'"
v-model="catalogCode"
class="bs-el-select"
popper-class="bs-el-select"
placeholder="请选择分组"
clearable
@change="reSearch"
>
<el-option
v-for="item in catalogList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
<el-input v-model="searchKey" class="bs-el-input" placeholder="请输入组件名称" prefix-icon="el-icon-search" clearable
@clear="reSearch" @keyup.enter.native="reSearch" />
<el-button type="primary" @click="reSearch">
<el-input
v-model="searchKey"
class="bs-el-input"
placeholder="请输入组件名称"
prefix-icon="el-icon-search"
clearable
@clear="reSearch"
@keyup.enter.native="reSearch"
/>
<el-button
type="primary"
@click="reSearch"
>
搜索
</el-button>
<el-button v-if="catalogInfo !== 'system'" type="primary" @click="catalogManage">
<el-button
v-if="catalogInfo !== 'system'"
type="primary"
@click="catalogManage"
>
分组管理
</el-button>
</div>
<div v-loading="loading" class="list-wrap bs-scrollbar" element-loading-text="" :style="{
display: gridComputed ? 'grid' : 'flex',
justifyContent: gridComputed ? 'space-around' : 'flex-start'
}">
<div
v-loading="loading"
class="list-wrap bs-scrollbar"
element-loading-text="加载中"
:style="{
display: gridComputed ? 'grid' : 'flex',
justifyContent: gridComputed ? 'space-around' : 'flex-start'
}"
>
<!-- 第一个是新增大屏卡片 -->
<div v-if="catalogInfo !== 'system'" class="big-screen-card-wrap" :style="{
width: gridComputed ? 'auto' : '290px'
}" @click="add">
<div
v-if="catalogInfo !== 'system'"
class="big-screen-card-wrap"
:style="{
width: gridComputed ? 'auto' : '290px'
}"
@click="add"
>
<div class="big-screen-card-inner big-screen-card-inner-add">
<div class="add-big-screen-card">
<div class="add-big-screen-card-inner">
@ -34,38 +70,72 @@
</div>
</div>
<!-- 后面遍历 list -->
<div v-for="screen in list" :key="screen.id" class="big-screen-card-wrap" :style="{
width: gridComputed ? 'auto' : '290px'
}">
<div
v-for="screen in list"
:key="screen.id"
class="big-screen-card-wrap"
:style="{
width: gridComputed ? 'auto' : '290px'
}"
>
<div class="big-screen-card-inner">
<div class="screen-card__hover">
<div class="screen-card__hover-box">
<div class="preview">
<div class="screen-card__oper-label circle" @click="preview(screen)">
<div
class="screen-card__oper-label circle"
@click="preview(screen)"
>
<span>预览</span>
</div>
<div v-if="catalogInfo !== 'system'" class="circle" @click="design(screen)">
<div
v-if="catalogInfo !== 'system'"
class="circle"
@click="design(screen)"
>
<span>设计</span>
</div>
<div v-if="catalogInfo !== 'system'" class="circle" @click="edit(screen)">
<div
v-if="catalogInfo !== 'system'"
class="circle"
@click="edit(screen)"
>
<span>编辑</span>
</div>
<div v-if="catalogInfo !== 'system'" class="circle" @click="copy(screen)">
<div
v-if="catalogInfo !== 'system'"
class="circle"
@click="copy(screen)"
>
<span>复制</span>
</div>
<div v-if="catalogInfo !== 'system'" class="circle" @click="del(screen)">
<div
v-if="catalogInfo !== 'system'"
class="circle"
@click="del(screen)"
>
<span>删除</span>
</div>
</div>
</div>
</div>
<div class="big-screen-card-img">
<el-image :src="catalogInfo !== 'system' ? screen.coverPicture : screen.img" fit="fill"
style="width: 100%; height: 100%">
<div slot="placeholder" class="image-slot">
<el-image
:src="catalogInfo !== 'system' ? screen.coverPicture : screen.img"
fit="fill"
style="width: 100%; height: 100%"
>
<div
slot="placeholder"
class="image-slot"
>
加载中···
</div>
<div slot="error" class="image-slot" style="font-size: 20px">
<div
slot="error"
class="image-slot"
style="font-size: 20px"
>
<div class="error-img-text">
{{ catalogInfo !== 'system' ? screen.name : screen.title }}
</div>
@ -73,29 +143,54 @@
</el-image>
</div>
<div class="big-screen-bottom">
<div class="left-bigscreen-title" :title="catalogInfo !== 'system' ? screen.name : screen.title">
<div
class="left-bigscreen-title"
:title="catalogInfo !== 'system' ? screen.name : screen.title"
>
{{ catalogInfo !== 'system' ? screen.name : screen.title }}
</div>
</div>
</div>
</div>
</div>
<div v-if="catalogInfo !== 'system'" class="footer-pagination-wrap">
<div
v-if="catalogInfo !== 'system'"
class="footer-pagination-wrap"
>
<!-- <div class="footer-pagination-wrap-text">
总共 {{ totalCount }} 个项目
</div> -->
<div class="bs-pagination">
<el-pagination class="bs-el-pagination" popper-class="bs-el-pagination" background
layout="total, prev, pager, next, sizes" :page-size="size" prev-text="上一页" next-text="下一页" :total="totalCount"
:page-sizes="[10, 20, 50, 100]" :current-page="current" @current-change="currentChangeHandle"
@size-change="sizeChangeHandle" />
<el-pagination
class="bs-el-pagination"
popper-class="bs-el-pagination"
background
layout="total, prev, pager, next, sizes"
:page-size="size"
prev-text="上一页"
next-text="下一页"
:total="totalCount"
:page-sizes="[10, 20, 50, 100]"
:current-page="current"
@current-change="currentChangeHandle"
@size-change="sizeChangeHandle"
/>
</div>
</div>
</div>
<!-- 新增或编辑弹窗 -->
<EditForm v-if="catalogInfo !== 'system'" ref="EditForm" :type="catalogInfo" @refreshData="reSearch" />
<CatalogEditForm v-if="catalogInfo !== 'system'" ref="CatalogEditForm" :catalog-type="catalogType"
@updateCatalogList="updateCatalogList" />
<EditForm
v-if="catalogInfo !== 'system'"
ref="EditForm"
:type="catalogInfo"
@refreshData="reSearch"
/>
<CatalogEditForm
v-if="catalogInfo !== 'system'"
ref="CatalogEditForm"
:catalog-type="catalogType"
@updateCatalogList="updateCatalogList"
/>
</div>
</template>
<script>
@ -114,7 +209,7 @@ export default {
}
},
components: { EditForm, CatalogEditForm },
data() {
data () {
return {
name: '',
catalogVisible: false,
@ -128,41 +223,41 @@ export default {
}
},
computed: {
catalogType() {
catalogType () {
if (this.catalogInfo === 'component') {
return 'componentCatalog'
} else {
return 'bizComponentCatalog'
}
},
code() {
code () {
return ''
},
gridComputed() {
gridComputed () {
return this.list.length > 2
}
},
watch: {
catalogInfo() {
catalogInfo () {
this.reset()
this.init()
},
catalogCode(value) {
catalogCode (value) {
this.reSearch()
}
},
mounted() {
mounted () {
this.init()
},
methods: {
reset() {
reset () {
this.searchKey = ''
this.current = 1
this.size = 10
this.catalogCode = ''
this.init()
},
init() {
init () {
if (this.catalogInfo !== 'system') {
this.getDataList()
this.getCatalogList()
@ -171,10 +266,10 @@ export default {
this.list = [...innerRemoteComponents, ...getRemoteComponents()]
}
},
updateCatalogList(list) {
updateCatalogList (list) {
this.catalogList = list
},
reSearch() {
reSearch () {
if (this.catalogInfo !== 'system') {
this.current = 1
this.getDataList()
@ -183,18 +278,18 @@ export default {
this.list = arr?.filter((item) => item.title.indexOf(this.searchKey) !== -1)
}
},
catalogManage() {
catalogManage () {
this.$refs.CatalogEditForm.formVisible = true
},
//
getCatalogList() {
getCatalogList () {
this.$dataRoomAxios.get(`/bigScreen/type/list/${this.catalogType}`)
.then((data) => {
this.catalogList = data
})
.catch(() => { })
},
getDataList() {
getDataList () {
this.loading = true
if (this.catalogInfo === 'component') {
this.$dataRoomAxios.get('/bigScreen/design/page', {
@ -228,7 +323,7 @@ export default {
})
}
},
preview(screen) {
preview (screen) {
let path = ''
let query = {
code: screen.code
@ -249,7 +344,7 @@ export default {
})
window.open(href, '_blank')
},
design(screen) {
design (screen) {
const path = this.catalogInfo === 'component' ? (window.BS_CONFIG?.routers?.designUrl || '/big-screen/design') : (window.BS_CONFIG?.routers?.bizComponentDesignUrl || 'big-screen-biz-component-design')
const { href } = this.$router.resolve({
path,
@ -259,17 +354,17 @@ export default {
})
window.open(href, '_self')
},
add() {
add () {
const page = {
code: '',
type: this.catalogInfo === 'component' ? 'bigScreen' : 'bizComponent'
}
this.$refs.EditForm.init(page, this.catalogCode)
},
edit(screen) {
edit (screen) {
this.$refs.EditForm.init(screen, this.catalogCode)
},
del(screen) {
del (screen) {
this.$confirm('确定删除该组件', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
@ -278,7 +373,7 @@ export default {
})
.then(async () => {
const url = this.catalogInfo === 'component' ? `/bigScreen/design/delete/${screen.code}` : `/bigScreen/bizComponent/delete/${screen.id}`
post(url)
this.$dataRoomAxios.post(url)
.then(() => {
this.$message({
type: 'success',
@ -295,8 +390,8 @@ export default {
})
.catch()
},
copy(screen) {
const url = this.catalogInfo === 'component' ? `/bigScreen/design/copy/${screen.code}` : `/bigScreen/bizComponent/copy/${screen.code}`
copy (screen) {
const url = this.catalogInfo === 'component' ? `/bigScreen/design/copy/${screen.code}` : `/Component/copy/${screen.code}`
this.$confirm('确定复制该组件', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
@ -304,7 +399,7 @@ export default {
customClass: 'bs-el-message-box'
})
.then(async () => {
post(url)
this.$dataRoomAxios.post(url)
.then(() => {
this.$message({
type: 'success',

Loading…
Cancel
Save