NGTools/pagesPackage/ngtools_information/detail.vue
ldeyun 9dbfdc6c71 V1.0.0
微信小程序运行成功;
H5运行成功
2024-09-30 01:30:39 +08:00

382 lines
9.5 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<template>
<view class="container">
<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="options"
:collection="collectionList"
field="infoName,infomation,infoSouce,infoType,createTime,createBy,updateTime,updateBy" :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>
<text>{{data.infoName}}</text>
</view>
<view>
<text>资料内容</text>
<text>{{data.infomation}}</text>
</view>
<view>
<text>资料来源</text>
<text>{{data.infoSouce}}</text>
</view>
<view>
<text>资料类型</text>
<text>{{data.infoType}}</text>
</view>
<view>
<text>创建时间</text>
<text>{{data.createTime}}</text>
</view>
<view>
<text>创建人</text>
<text>{{data.createBy}}</text>
</view>
<view>
<text>更新时间</text>
<text>{{data.updateTime}}</text>
</view>
<view>
<text>更新人</text>
<text>{{data.updateBy}}</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 class="table">
<!-- {{jsonData}} -->
<uni-table ref="table" border stripe type="selection" emptyText="暂无更多数据">
<!-- <uni-tr v-for="key,index in jsonKeys"> -->
<uni-tr >
<uni-th width="50" align="center" :key="index">{{key}}</uni-th>
<uni-th width="50" align="center" :key="index">{{key}}</uni-th>
</uni-tr>
<uni-tr v-for="key in jsonKeys">
<td v-for="item in jsonData">{{ item[key] }}</td>
</uni-tr>
</uni-table>
</view>
</view>
</template>
<script>
// 由schema2code生成包含校验规则和enum静态数据
import {
enumConverter
} from '../../js_sdk/validator/ngtools_information.js'
const db = uniCloud.database()
export default {
data() {
return {
queryWhere: '',
collectionList: "ngtools_information",
loadMore: {
contentdown: '',
contentrefresh: '',
contentnomore: ''
},
options: {
// 将scheme enum 属性静态数据中的value转成text
...enumConverter
},
jsonKeys: [],
jsonData: [{
"序号": 1,
"组分": "甲烷",
"摩尔质量Mkg·kmol-I": 16.04246,
"原子个数a": 1,
"原子个数b": 4,
"原子个数C": 0,
"原子个数d": 0,
"原子个数e": 0
}, {
"序号": 2,
"组分": "乙烷",
"摩尔质量Mkg·kmol-I": 30.06904,
"原子个数a": 2,
"原子个数b": 6,
"原子个数C": 0,
"原子个数d": 0,
"原子个数e": 0
}],
tableData: [{
"date": "2020-09-01",
"name": "Dcloud1",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-02",
"name": "Dcloud2",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-03",
"name": "Dcloud3",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-04",
"name": "Dcloud4",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-05",
"name": "Dcloud5",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-06",
"name": "Dcloud6",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-07",
"name": "Dcloud7",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-08",
"name": "Dcloud8",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-09",
"name": "Dcloud9",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-10",
"name": "Dcloud10",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-11",
"name": "Dcloud11",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-12",
"name": "Dcloud12",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-13",
"name": "Dcloud13",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-14",
"name": "Dcloud14",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-15",
"name": "Dcloud15",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-16",
"name": "Dcloud16",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-01",
"name": "Dcloud17",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-02",
"name": "Dcloud18",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-03",
"name": "Dcloud19",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-04",
"name": "Dcloud20",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-05",
"name": "Dcloud21",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-06",
"name": "Dcloud22",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-07",
"name": "Dcloud23",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-08",
"name": "Dcloud24",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-09",
"name": "Dcloud25",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-10",
"name": "Dcloud26",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-11",
"name": "Dcloud27",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-12",
"name": "Dcloud28",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-13",
"name": "Dcloud29",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-14",
"name": "Dcloud30",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-15",
"name": "Dcloud31",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-16",
"name": "Dcloud32",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-01",
"name": "Dcloud33",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-02",
"name": "Dcloud34",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-03",
"name": "Dcloud35",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-04",
"name": "Dcloud36",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-05",
"name": "Dcloud37",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-06",
"name": "Dcloud38",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-07",
"name": "Dcloud39",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-08",
"name": "Dcloud40",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-09",
"name": "Dcloud41",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-10",
"name": "Dcloud42",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-11",
"name": "Dcloud43",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-12",
"name": "Dcloud44",
"address": "上海市普陀区金沙江路 1516 弄"
}, {
"date": "2020-09-13",
"name": "Dcloud45",
"address": "上海市普陀区金沙江路 1518 弄"
}, {
"date": "2020-09-14",
"name": "Dcloud46",
"address": "上海市普陀区金沙江路 1517 弄"
}, {
"date": "2020-09-15",
"name": "Dcloud47",
"address": "上海市普陀区金沙江路 1519 弄"
}, {
"date": "2020-09-16",
"name": "Dcloud48",
"address": "上海市普陀区金沙江路 1516 弄"
}]
}
},
onLoad(e) {
this._id = e.id
},
onReady() {
if (this._id) {
this.queryWhere = '_id=="' + this._id + '"'
}
this.getKeys(this.jsonData)
},
methods: {
getKeys(jsonData) {
this.jsonKeys = Object.keys(jsonData[0]);
console.log(this.jsonKeys)
},
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;
}
.table {
padding: 10px;
display: flex;
flex-wrap: nowrap;
}
.btns {
margin-top: 10px;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
flex-direction: row;
}
.btns button {
flex: 1;
}
.btn-delete {
margin-left: 10px;
}
</style>