NGTools/pagesPackage/ngTools_depart/detail.vue

<template>
  <view class="container">
	  <uni-nav-bar dark :fixed="true" shadow background-color="#007AFF" status-bar left-icon="left" left-text="返回"
	  	title="部门详情" @clickLeft="back" />
    <unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="options" :collection="collectionList" field="parent_id,depart_name,level,sort,manager_uid,status" :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">
       <uni-forms ref="form"    >
       	<!-- <uni-forms-item name="parent_id" label="父级部门ID">
       		<uni-easyinput placeholder="父级部门ID" v-model="formData.parent_id"></uni-easyinput>
       	</uni-forms-item> -->
       <!-- 	<uni-forms-item name="父级部门" label="父级部门">
       		<depart-select @change="onselectionchange"></depart-select>
       	</uni-forms-item> -->
        	<uni-forms-item name="depart_name" label="部门名称">
       		<uni-easyinput placeholder="部门名称" v-model="data.depart_name" trim="both"></uni-easyinput>
       	</uni-forms-item>
       	<uni-forms-item name="level" label="部门层级">
       		<uni-easyinput placeholder="部门层级，为提升检索效率而作的冗余设计" type="number" v-model="data.level"></uni-easyinput>
       	</uni-forms-item>
       	<uni-forms-item name="sort" label="显示顺序">
       		<uni-easyinput placeholder="部门在当前层级下的顺序，由小到大" type="number" v-model="data.sort"></uni-easyinput>
       	</uni-forms-item>
       	<uni-forms-item name="manager_uid" label="部门主管用户">
       		<uni-easyinput placeholder="部门主管的userid， 参考`uni-id-users` 表"
       			v-model="data.manager_uid"></uni-easyinput>
       	</uni-forms-item>
       	<uni-forms-item name="status" label="部门状态">
       		<radio-group>
       			<radio :checked="true" @click="data.status=0">正常</radio>
       			<radio :checked="false" @click="data.status=1">禁用</radio>
       		</radio-group>
       	</uni-forms-item>
        
       </uni-forms>
      </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/ngTools_depart.js'
  const db = uniCloud.database()

  export default {
    data() {
      return {
        queryWhere: '',
        collectionList: "ngTools_depart",
        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: {back() {
				uni.navigateBack({
					delta: 1
				})
			},
      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: 0px;
  }

  .btns {
    margin-top: 10px;
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-direction: row;
  }

  .btns button {
    flex: 1;
  }

  .btn-delete {
    margin-left: 10px;
  }
</style>