style: 插件样式调整

CHANGELOG.md

@@ -81,6 +81,7 @@
 ### 🔨 代码重构
 范围|描述|commitId
 --|--|--
+ api | 调整mock api放入mock.js下；main中加入环境变量的判断 | [053ac31](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/053ac31)
  - | deliver检查人重构；更新真实数据的检查人 | [ce808c4](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/ce808c4)
  - | project init 重构 | [2457a87](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/2457a87)
  - | 交付物代码整理重构 未完 | [d7c6e51](https://101.201.226.163:50022/TALL/TALL-MUI-4/commits/d7c6e51)

components/Globals/Globals.vue

@@ -1,5 +1,4 @@
 <template>
-  <theme>
   <u-card
     @click="openCard"
     :show-foot="false"
@@ -14,10 +13,10 @@
         <!-- 骨架屏 -->
         <skeleton :banner="false" :loading="showGlobalSkeleton" :row="3" animate class="u-line-2 skeleton"></skeleton>
 
-          <view class="grid gap-2">
-            <view v-for="item in globals" :key="item.id">
+        <view class="grid">
+          <template v-for="item in globals" :key="item.id">
             <template v-if="item.plugins && item.plugins.length">
-                <view v-for="(pluginArr, i) in item.plugins" :key="i">
+              <view v-for="(pluginArr, i) in item.plugins" :key="i" class="pb-3">
                 <template class="p-0 u-col-between" v-if="pluginArr.length">
                   <Plugin
                     :class="[`row-span-${plugin.row}`, `col-span-${plugin.col}`]"
@@ -34,22 +33,14 @@
             </template>
 
             <!-- 任务名插件 -->
-              <p-task-title :task="item" v-else />
-
-              <!-- 财务审批 -->
-              <p-finance-audit :task="item" />
-
-              <!-- 资源管理组件 -->
-              <p-source-manage :task="item" />
-
-              <!-- 进度条 -->
-              <p-finance :task="item" />
+            <view v-else class="pb-3">
+              <Plugin plugin-id="1" :task="item" />
             </view>
+          </template>
         </view>
       </scroll-view>
     </template>
   </u-card>
-  </theme>
 </template>
 
 <script setup>

components/Plugin/Plugin.vue

@@ -1,10 +1,9 @@
 <template>
-  <view class="u-font-14 rounded-md mt-1 bg-white" style="height: 100%">
-    <view @click="setStorage">
+  <view class="u-font-14 rounded-md bg-white p-2" style="height: 100%" @click="setStorage">
     <Render :task="task" :pluginId="pluginId" :styleType="styleType" :pluginTaskId="pluginTaskId" :param="param" />
     <!-- <plugin-default /> -->
     <!-- <component :task="task" :is="pluginComponent"></component> -->
-      <p-task-title v-if="pluginId === '1'" />
+    <p-task-title :task="task" v-if="pluginId === '1'" />
     <!-- <p-task-description :task="task" v-if="pluginId === '2'" />
       <p-task-duration-delay :task="task" v-if="pluginId === '3'" />
       <p-task-start-time-delay :task="task" v-if="pluginId === '4'" />
@@ -21,7 +20,9 @@
 
     <!-- 交付物插件 -->
     <p-deliver v-if="pluginId === '15'" />
-    </view>
+    <p-source-manage v-if="pluginId === '16'" />
+    <p-finance-audit v-if="pluginId === '17'" />
+    <p-finance v-if="pluginId === '18'" />
   </view>
 </template>
 

components/TimeLine/component/TimeBox.vue

@@ -17,7 +17,14 @@
           <view class="h-3" v-if="task.process === 4"></view>
           <!-- <view class="ml-3 overflow-hidden shadow-lg task-box"> -->
           <view class="ml-3">
-            <u-card :show-foot="false" :show-head="false" :style="{ height: setHeight(task.panel) }" class="h-16" margin="0" v-if="showSkeleton">
+            <u-card
+              :show-foot="false"
+              :show-head="false"
+              :style="{ height: setHeight(task.panel) }"
+              class="h-16"
+              margin="0"
+              v-if="showSkeleton"
+            >
               <view slot="body">
                 <view><skeleton :banner="false" :loading="true" :row="4" animate class="mt-2 u-line-2 skeleton"></skeleton></view>
               </view>
@@ -32,10 +39,10 @@
               v-if="tasks && tasks.length && task.process !== 4 && !showSkeleton"
             >
               <template v-slot:body> -->
-            <view class="h-16" v-if="tasks && tasks.length && task.process !== 4 && !showSkeleton" @click="onClickTask(task.planStart - 0, task.id)">
+            <view v-if="tasks && tasks.length && task.process !== 4 && !showSkeleton" @click="onClickTask(task.planStart - 0, task.id)">
               <view class="p-0 u-col-between grid gap-3">
                 <view :key="pIndex" v-for="(row, pIndex) in task.plugins">
-                  <view class="grid gap-2 grid-cols-1" v-if="row.length">
+                  <view class="grid grid-cols-1" v-if="row.length">
                     <Plugin
                       :class="[`row-span-${plugin.row}`, `col-span-${plugin.col}`]"
                       :task="task"

pages.json

@@ -44,6 +44,12 @@
       "style": {
         "navigationBarTitleText": "详情页"
       }
+    },
+    {
+      "path": "pages/404/404",
+      "style": {
+        "navigationBarTitleText": "404"
+      }
     }
   ],
   "globalStyle": {

pages/404/404.vue

@@ -0,0 +1,5 @@
+<template>
+  <div class="404">404</div>
+</template>
+
+<script setup></script>

pages/detailWebview/detailWebview.vue

@@ -9,8 +9,17 @@ import { onLoad } from '@dcloudio/uni-app';
 const src = ref('');
 
 onLoad(options => {
-  if (options && options.url) {
+  if (!options) {
+    uni.redirectTo({ url: '/pages/404/404' });
+    return;
+  }
+  if (options.url) {
     src.value = options.url;
   }
+  if (options.name) {
+    uni.setNavigationBarTitle({
+      title: options.name || '详情页',
+    });
+  }
 });
 </script>

plugins/p-deliver-upload/p-deliver-upload.vue

@@ -1,8 +1,8 @@
 <template>
   <!-- 是自己的任务 且该任务有交付物 才显示提交组件 -->
-  <view class="bg-white p-2 rounded-md relative" @longpress.prevent="showMask = true">
+  <view class="bg-white px-2 rounded-md relative" @longpress.prevent="showMask = true">
     <!-- 插件名称输入和提交 -->
-    <view class="flex item-center justify-between py-3 pl-2">
+    <view class="flex item-center justify-between py-2">
       <view class="flex-1">
         <text v-if="deliver.deliverName">
           {{ deliver.deliverName }}

plugins/p-finance-audit/p-finance-audit.vue

@@ -1,8 +1,18 @@
 <template>
   <div class="flex justify-around">
-    <button class="text-xs bg-blue-500 text-white leading-6" style="width: 250rpx">财务审批</button>
-    <button class="text-xs bg-blue-500 text-white leading-6" style="width: 250rpx">财务统计</button>
+    <button class="text-xs bg-blue-500 text-white leading-6" style="width: 250rpx" @click="openAudit">财务审批</button>
+    <button class="text-xs bg-blue-500 text-white leading-6" style="width: 250rpx" @click="openStatistical">财务统计</button>
   </div>
 </template>
 
-<script setup></script>
+<script setup>
+// DEBUG:打开财务审批详情页
+function openAudit() {
+  uni.$ui.openDetail({ url: 'https://www.taobao.com', name: '财务审批' });
+}
+
+// DEBUG:打开财务统计详情页
+function openStatistical() {
+  uni.$ui.openDetail({ url: 'https://www.taobao.com', name: '财务统计' });
+}
+</script>

plugins/p-finance/p-finance.vue

@@ -29,27 +29,27 @@
 </template>
 
 <script setup>
-import { ref, computed } from 'vue';
+import { ref, inject } from 'vue';
 
-const props = defineProps({ task: { type: Object } });
-// const task = inject('task');
+const task = inject('task');
 const data = ref(null);
 
-async function getData() {
+// 查询任务上的财务条数据
+async function getFinanceByTaskData() {
   try {
-    const taskDetailId = props.task.taskDetailId;
+    const taskDetailId = task.taskDetailId;
     data.value = await uni.$u.api.getFinanceByTask(taskDetailId);
   } catch (error) {
-    console.log('error: ', error);
+    console.log('getFinanceByTaskData error: ', error);
   }
 }
 
-getData();
+getFinanceByTaskData();
 
 // 打开详情页
 function openFinance() {
   // DEBUG: 假数据 换成财务条详情页的地址
-  uni.navigateTo({ url: '/pages/detailWebview/detailWebview?url=http://www.baidu.com' });
+  uni.$ui.openDetail({ url: 'http://www.baidu.com', name: '财务' });
 }
 </script>
 

plugins/p-source-manage/p-source-manage.vue

@@ -1,6 +1,11 @@
 <!-- 资源管理 -->
 <template>
-  <button class="text-xs bg-blue-500 text-white leading-6" style="width: 500rpx">资源管理</button>
+  <button class="text-xs bg-blue-500 text-white leading-6" style="width: 500rpx" @click="openSourceManage">资源管理</button>
 </template>
 
-<script setup></script>
+<script setup>
+function openSourceManage() {
+  // DEBUG: 假数据 换成财务条 资源管理的地址
+  uni.$ui.openDetail({ url: 'http://m.jd.com', name: '资源管理' });
+}
+</script>

plugins/p-task-title/p-task-title.vue

@@ -1,19 +1,13 @@
 <template>
   <!-- 任务名插件 -->
-  <view class="box shadow-lg">
-    <view class="bg-white rounded-md pl-2">{{ task.name }}</view>
+  <view class="u-font-14">
+    {{ task.name }}
   </view>
 </template>
 
 <script setup>
+// import { inject } from 'vue';
+
+// inject()
 defineProps({ task: { type: Object, default: () => {} } });
 </script>
-
-<style scoped lang="scss">
-.box {
-  border-radius: 8px;
-  background: #fff;
-  padding: 16px;
-  overflow: hidden;
-}
-</style>

utils/ui.js

@@ -1,3 +1,4 @@
+import { stringify } from 'qs';
 export default {
   /**
    * 显示toast
@@ -41,7 +42,7 @@ export default {
    * @param {boolean} showCancel 是否显示取消按钮 默认true
    */
   showModal(title, content, showCancel = true) {
-		return new Promise(function(resolve, reject) {
+    return new Promise(function (resolve, reject) {
       uni.showModal({
         title,
         content,
@@ -53,4 +54,21 @@ export default {
       });
     });
   },
+
+  /**
+   * 打开详情页
+   * @param {object} options
+   */
+  openDetail(options) {
+    if (!options) {
+      throw new Error('缺少参数');
+    }
+    if (!options.url) {
+      throw new Error('缺少url参数');
+    }
+    const query = stringify(options);
+    console.log('query: ', query);
+    const path = `/pages/detailWebview/detailWebview?${query}`;
+    uni.navigateTo({ url: path });
+  },
 };