收货详情编辑

src/views/system/doctor/detail.vue

@@ -77,8 +77,8 @@
   import { Descriptions, Card } from 'ant-design-vue';
   import { descriptionColumns } from './schema';
   import * as DoctorApi from '/@/api/system/doctorApi';
-  import { Device } from '/@/api/model/device';
   import { useDrawer } from '/@/components/Drawer';
+  import { Doctor } from '/@/api/model/doctor';
   const [registerDrawer, { openDrawer }] = useDrawer();
   const router = useRouter();
   const route = useRoute();
@@ -88,7 +88,7 @@
     isOver: false,
   });
   const getDetail = () => {
-    DoctorApi.getById(id.value).then((res: Device) => {
+    DoctorApi.getById(id.value).then((res: Doctor) => {
       data.isOver = true;
       data.detail = res;
     });
@@ -105,10 +105,7 @@
   const reload = () => {
     data.isOver = false;
     data.detail = {};
-    DoctorApi.getById(id.value).then((res: Device) => {
-      data.isOver = true;
-      data.detail = res;
-    });
+    getDetail();
   };
 
   const handleSuccess = () => {

src/views/system/receiver/detail.vue

 <template>
-  <Card :bordered="false">
-    <Descriptions bordered :column="3">
-      <Descriptions.Item
-        v-for="p in displayProps"
-        :key="p.title"
-        :label="p.title"
-        :span="['avatar'].includes(p.name) ? 3 : 1"
-      >
-        <span v-if="p.key === 'avatar'">
-          <img :src="p.value" style="width: 120px; height: 120px" />
-        </span>
-        <template v-else>
-          {{ p.value }}
-        </template>
-      </Descriptions.Item>
-    </Descriptions>
-  </Card>
+  <div>
+    <Card :bordered="false" :loading="!data.isOver">
+      <template #extra v-if="data.isOver">
+        <a-button type="primary" v-if="isShowHandleEdit(data.detail.status)" @click="handleEdit">
+          <template #icon> <Icon icon="clarity:note-edit-line" /></template>
+          编辑
+        </a-button>
+        <a-popconfirm
+          class="ml-4"
+          title="确定通过吗"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="handleVerify(StatusValEnum.PASSED)"
+        >
+          <a-button type="primary" v-if="isShowHandlePassed(data.detail.status)">通过</a-button>
+        </a-popconfirm>
+
+        <a-popconfirm
+          class="ml-4"
+          title="确定拒绝吗"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="handleVerify(StatusValEnum.PASSED)"
+        >
+          <a-button type="danger" v-if="isShowHandleReject(data.detail.status)">拒绝</a-button>
+        </a-popconfirm>
+
+        <a-popconfirm
+          class="ml-4"
+          title="确定禁用吗"
+          ok-text="是"
+          cancel-text="否"
+          @confirm="handleVerify(StatusValEnum.FORBIDDEN)"
+        >
+          <a-button type="danger" v-if="isShowHandleForbidden(data.detail.status)">禁用</a-button>
+        </a-popconfirm>
+
+        <a-popconfirm class="ml-4" title="确定删除吗" ok-text="是" cancel-text="否" @confirm="handleDelete">
+          <a-button type="danger" v-if="isShowHandleDelete()">删除</a-button>
+        </a-popconfirm>
+      </template>
+      <Descriptions bordered :column="3">
+        <Descriptions.Item
+          v-for="p in displayProps"
+          :key="p.title"
+          :label="p.title"
+          :span="['avatar'].includes(p.name) ? 3 : 1"
+        >
+          <span v-if="p.key === 'avatar'">
+            <img :src="p.value" style="width: 120px; height: 120px" />
+          </span>
+          <template v-else>
+            {{ p.value }}
+          </template>
+        </Descriptions.Item>
+      </Descriptions>
+    </Card>
+    <ReceiverDrawer @register="registerDrawer" @success="handleSuccess" />
+  </div>
 </template>
 <script lang="ts" setup name="DeviceDetail">
+  import { Icon } from '/@/components/Icon';
+  import {
+    isShowHandleEdit,
+    isShowHandlePassed,
+    isShowHandleForbidden,
+    isShowHandleReject,
+    isShowHandleDelete,
+    getVerifyParams,
+    StatusValEnum,
+  } from './schema';
+  import ReceiverDrawer from './drawer.vue';
   import { onMounted, computed, ref, reactive } from 'vue';
-  import { useRoute } from 'vue-router';
+  import { useRoute, useRouter } from 'vue-router';
   import { ComputedRef } from '@vue/reactivity';
   import { Descriptions, Card } from 'ant-design-vue';
   import { descriptionColumns } from './schema';
   import * as ReceiverApi from '/@/api/system/receiverApi';
-  import { Device } from '/@/api/model/device';
-
+  import { useDrawer } from '/@/components/Drawer';
+  import { Receiver } from '/@/api/model/receiver';
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const router = useRouter();
   const route = useRoute();
   const id = ref(route.params?.id);
   let data = reactive({
     detail: {},
     isOver: false,
   });
+  const setLoading = (flag: boolean) => {
+    data.isOver = !flag;
+  };
+
+  const reload = () => {
+    data.isOver = false;
+    data.detail = {};
+    getDetail();
+  };
+
+  const handleSuccess = () => {
+    reload();
+  };
+
+  const handleVerify = (status: string) => {
+    setLoading(true);
+    ReceiverApi.batchVerify(getVerifyParams(data.detail, status))
+      .then((_) => {
+        reload();
+      })
+      .catch(() => {
+        setLoading(false);
+      });
+  };
   const getDetail = () => {
-    ReceiverApi.getById(id.value).then((res: Device) => {
+    ReceiverApi.getById(id.value).then((res: Receiver) => {
       data.isOver = true;
       data.detail = res;
     });
   };
+  const handleEdit = () => {
+    openDrawer(true, {
+      record: data.detail,
+      isUpdate: true,
+    });
+  };
+
+  const handleDelete = () => {
+    setLoading(true);
+    ReceiverApi.remove(data.detail.id)
+      .then((_) => {
+        router.back();
+      })
+      .catch(() => {
+        setLoading(false);
+      });
+  };
 
   onMounted(() => {
     getDetail();