NGTools/pagesPackage/opendb-banner/detail.vue

127 lines
3.4 KiB
Vue
Raw Normal View History

<template>
<view class="container">
<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="options" :collection="collectionList" field="bannerfile,open_url,title,sort,category_id,status,description" :where="queryWhere" :getone="true" :manual="true">
<view v-if="error">{{error.message}}</view>
<view v-else-if="loading">
<uni-load-more :contentText="loadMore" status="loading"></uni-load-more>
</view>
<view v-else-if="data">
<view>
<text>图片文件</text>
<uni-file-picker v-if="data.bannerfile && data.bannerfile.fileType == 'image'" :value="data.bannerfile" :file-mediatype="data.bannerfile && data.bannerfile.fileType" return-type="object" readonly></uni-file-picker>
<uni-link v-else-if="data.bannerfile" :href="data.bannerfile.url" :text="data.bannerfile.url"></uni-link>
<text v-else></text>
</view>
<view>
<text>点击目标地址</text>
<uni-link :href="data.open_url" :download="data.open_url" :text="data.open_url"></uni-link>
</view>
<view>
<text>标题</text>
<text>{{data.title}}</text>
</view>
<view>
<text>排序</text>
<text>{{data.sort}}</text>
</view>
<view>
<text>分类id</text>
<text>{{data.category_id}}</text>
</view>
<view>
<text>生效状态</text>
<text>{{data.status == true ? '✅' : '❌'}}</text>
</view>
<view>
<text>备注</text>
<text>{{data.description}}</text>
</view>
</view>
</unicloud-db>
<view class="btns">
<button type="primary" @click="handleUpdate">修改</button>
<button type="warn" class="btn-delete" @click="handleDelete">删除</button>
</view>
</view>
</template>
<script>
// 由schema2code生成包含校验规则和enum静态数据
import { enumConverter } from '../../js_sdk/validator/opendb-banner.js'
const db = uniCloud.database()
export default {
data() {
return {
queryWhere: '',
collectionList: "opendb-banner",
loadMore: {
contentdown: '',
contentrefresh: '',
contentnomore: ''
},
options: {
// 将scheme enum 属性静态数据中的value转成text
...enumConverter
}
}
},
onLoad(e) {
this._id = e.id
},
onReady() {
if (this._id) {
this.queryWhere = '_id=="' + this._id + '"'
}
},
methods: {
handleUpdate() {
// 打开修改页面
uni.navigateTo({
url: './edit?id=' + this._id,
events: {
// 监听修改页面成功修改数据后, 刷新当前页面数据
refreshData: () => {
this.$refs.udb.loadData({
clear: true
})
}
}
})
},
handleDelete() {
this.$refs.udb.remove(this._id, {
success: (res) => {
// 删除数据成功后跳转到list页面
uni.navigateTo({
url: './list'
})
}
})
}
}
}
</script>
<style>
.container {
padding: 10px;
}
.btns {
margin-top: 10px;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
}
.btns button {
flex: 1;
}
.btn-delete {
margin-left: 10px;
}
</style>