Initial commit

src/views/cms/dashboard/components/task-card.vue

@@ -0,0 +1,112 @@
+<template>
+  <a-card :title="title" :bordered="false" :body-style="{ padding: '2px' }">
+    <template #extra
+      ><a @click="openUrl('/oa/task')" class="ele-text-placeholder"
+        >更多<RightOutlined /></a
+    ></template>
+    <a-list :size="`small`" :split="false" :data-source="list">
+      <template #renderItem="{ item }">
+        <a-list-item>
+          <div class="app-box">
+            <div class="app-info">
+              <a
+                class="ele-text-secondary"
+                @click="openNew('/oa/task/detail/' + item.taskId)"
+              >
+                <a-typography-paragraph
+                  ellipsis
+                  :content="`【${item.taskType}】${item.name}`"
+                />
+              </a>
+            </div>
+            <a class="ele-text-placeholder">
+              <a-tag v-if="item.progress === TOBEARRANGED" color="red"
+                >待安排</a-tag
+              >
+              <a-tag v-if="item.progress === PENDING" color="orange"
+                >待处理</a-tag
+              >
+              <a-tag v-if="item.progress === PROCESSING" color="purple"
+                >处理中</a-tag
+              >
+              <a-tag v-if="item.progress === TOBECONFIRMED" color="cyan"
+                >待评价</a-tag
+              >
+              <a-tag v-if="item.progress === COMPLETED" color="green"
+                >已完成</a-tag
+              >
+              <a-tag v-if="item.progress === CLOSED">已关闭</a-tag>
+              <div class="ele-text-danger" v-if="item.overdueDays">
+                已逾期{{ item.overdueDays }}天
+              </div>
+            </a>
+          </div>
+        </a-list-item>
+      </template>
+    </a-list>
+  </a-card>
+</template>
+
+<script lang="ts" setup>
+  import { ref } from 'vue';
+  import { openUrl } from '@/utils/common';
+  import { Task } from '@/api/oa/task/model';
+  import { pageTask } from '@/api/oa/task';
+  import { useUserStore } from '@/store/modules/user';
+  import {
+    CLOSED,
+    COMPLETED,
+    PENDING,
+    PROCESSING,
+    TOBEARRANGED,
+    TOBECONFIRMED
+  } from '@/api/oa/task/model/progress';
+  import { RightOutlined } from '@ant-design/icons-vue';
+
+  const props = defineProps<{
+    title: string;
+  }>();
+
+  const list = ref<Task[]>([]);
+  /**
+   * 加载数据
+   */
+  const reload = () => {
+    const { title } = props;
+    const userStore = useUserStore();
+    const where = {
+      userId: undefined,
+      commander: userStore.info?.userId,
+      limit: 6,
+      status: 0
+    };
+    // 加载列表
+    pageTask(where).then((data) => {
+      if (data?.list) {
+        list.value = data.list;
+      }
+    });
+  };
+  reload();
+</script>
+
+<script lang="ts">
+  export default {
+    name: 'DashboardArticleList'
+  };
+</script>
+
+<style lang="less" scoped>
+  .app-box {
+    display: flex;
+    width: 100%;
+    justify-content: space-between;
+    overflow: hidden;
+    .app-info {
+      display: flex;
+      margin-left: 5px;
+      flex-direction: column;
+      width: 400px;
+    }
+  }
+</style>