You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
iot/projects/WebMVC/wwwroot/router/shared/details.html

65 lines
2.7 KiB

<template>
<layout v-bind:title="data.schema.title">
<h1>{{data.schema.title}}详情页</h1>
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body" v-if="hasPermission('Read')">
<div class="form-group row" v-for="(value,key,index) in data.schema.properties" v-if="showForDetails(key,value)">
<label class="col-sm-2 col-form-label" :for="key">{{value.title}}:</label>
<div class="col-sm-6 form-control" style="border-color:transparent;height:auto;min-height:calc(2.25rem + 2px);">
<component :is="getDisplayComponent(key)" :title="value.title" :name="key" :value="data.model[key]" :data="data.data" v-if="data.model" />
</div>
<div class="col-sm-4">{{value.description}}</div>
</div>
</div>
<div class="card-footer">
<router-link :to="{path:'/router/shared/list.html',query:{entity:entity}}" class="btn btn-primary" v-if="hasPermission('Read')">返回</router-link>
</div>
</div>
</div>
</div>
</layout>
</template>
<script>
export default {
data: function () {
return {
url: '/IoTCenter/Admin/' + this.$route.query.entity + '/Details?id=' + this.$route.query.id,
entity: this.$route.query.entity,
data: {
schema: {
title: ''
},
model: {},
data: {}
}
}
},
mounted: function () {
this.load();
},
methods: {
load: function () {
var vm = this;
var url = config.baseUrl + this.url;
axios.get(url).then(function (response) {
vm.data = response.data;
});
},
hasPermission: function (cmd) {
var permission = cmd + '-' + this.entity;
return Enumerable.from(store.state.permissions).any(o => o === permission);
},
getDisplayComponent: function (key) {
var property = this.data.schema.properties[key];
var template = 'display-' + (property.ui || property.format || property.type);
console.log(template);
return template;
},
showForDetails: function (key, value) {
return key !== 'id';
}
}
}
</script>