Browse Source

Merge branch 'master' of https://git.agilestar.cn/spfm-group/spfm-market-front

noob 3 years ago
parent
commit
3a9aa0163b
2 changed files with 149 additions and 90 deletions
  1. 120 80
      src/pages/main/performance/components/table.vue
  2. 29 10
      src/pages/main/performance/department.vue

+ 120 - 80
src/pages/main/performance/components/table.vue

@@ -6,16 +6,42 @@
  * @FilePath     : \spfm-market-front\src\pages\main\performance\components\table.vue
 -->
 <template>
-    <el-table class="simple-table" :data="computed_list" v-loading="loading">
+  <el-table class="simple-table" :data="computed_list" v-loading="loading">
+    <el-table-column
+      v-for="({ props, label, type, width, align, children }, index) in config"
+      :key="index"
+      :prop="props"
+      :width="width"
+      :label="label"
+      :align="align || 'center'"
+    >
+      <template #default="scope">
+        <div v-if="type === 'edit'">
+          <el-input
+            v-if="scope.row[`${props}_${type}`]"
+            v-model="scope.row[props]"
+            autosize
+            type="textarea"
+          />
+          <pre v-else>{{ scope.row[props] }}</pre>
+          <el-button
+            size="mini"
+            class="margin-top-10"
+            @click="handleEdit({ scope, type, props })"
+          >
+            {{ !scope.row[`${props}_${type}`] ? "编辑" : "完成" }}
+          </el-button>
+        </div>
+        <div v-else>{{ scope.row[props] }}</div>
+      </template>
+      <template v-if="children">
         <el-table-column
-            v-for="(
-                { props, label, type, width, align, children }, index
-            ) in config"
-            :key="index"
-            :prop="props"
-            :width="width"
-            :label="label"
-            :align="align || 'center'"
+          v-for="({ props, label, width, align }, index) in children"
+          :key="index"
+          :prop="props"
+          :width="width"
+          :label="label"
+          :align="align || 'center'"
         >
             <template #default="scope">
                 <div v-if="type === 'edit'">
@@ -54,83 +80,97 @@
                 </el-table-column>
             </template>
         </el-table-column>
-        <el-table-column
-            v-if="handleRow.length"
-            label="操作"
-            :width="handleRow.length * 50"
+      </template>
+    </el-table-column>
+    <el-table-column
+      v-if="handleRow.length"
+      label="操作"
+      :width="handleRow.length * 50"
+    >
+      <template slot-scope="scope">
+        <span
+          v-for="({ label, props, popconfirm, visible }, index) in handleRow"
+          :key="index"
+          class="padding-right-5"
         >
-            <template slot-scope="scope">
-                <span
-                    v-for="({ label, props, popconfirm }, index) in handleRow"
-                    :key="index"
-                    class="padding-right-5"
-                >
-                    <el-popconfirm
-                        v-if="popconfirm"
-                        :title="`确定要${label}吗?`"
-                    >
-                        <el-button
-                            slot="reference"
-                            @click="handleClick(props, scope.row)"
-                            type="text"
-                            size="small"
-                            >{{ label }}</el-button
-                        >
-                    </el-popconfirm>
-                    <el-button
-                        v-else
-                        @click="handleClick(props, scope.row)"
-                        type="text"
-                        size="small"
-                        >{{ label }}</el-button
-                    >
-                </span>
-            </template>
-        </el-table-column>
-    </el-table>
+          <span v-if="handleFormat(visible,scope.row)">
+            <el-popconfirm v-if="popconfirm" :title="`确定要${label}吗?`">
+              <el-button
+                slot="reference"
+                @click="handleClick(props, scope.row)"
+                type="text"
+                size="small"
+                >{{ label }}</el-button
+              >
+            </el-popconfirm>
+            <el-button
+              v-else
+              @click="handleClick(props, scope.row)"
+              type="text"
+              size="small"
+              >{{ label }}</el-button
+            >
+          </span>
+        </span>
+      </template>
+    </el-table-column>
+  </el-table>
 </template>
 <script>
 export default {
-    props: {
-        list: {
-            type: Array,
-            default: () => [],
-        },
-        config: {
-            type: Array,
-            default: () => [],
-        },
-        loading: {
-            type: Boolean,
-            default: false,
-        },
-        handleRow: {
-            type: Array,
-            default: () => [],
-        },
+  props: {
+    list: {
+      type: Array,
+      default: () => [],
+    },
+    config: {
+      type: Array,
+      default: () => [],
+    },
+    loading: {
+      type: Boolean,
+      default: false,
+    },
+    handleRow: {
+      type: Array,
+      default: () => [],
+    },
+  },
+  computed: {
+    computed_list() {
+      const object = {};
+      this.config
+        .filter(({ type }) => type === "edit")
+        .forEach(({ props, type }) => {
+          object[`${props}_${type}`] = false;
+        });
+      return this.list.map((element) => ({
+        ...element,
+        ...object,
+      }));
+    },
+  },
+  methods: {
+    handleFormat(params,data) {
+      let visible = true;
+      if (params) {
+        visible = false;
+        console.log(Object.keys(params));
+        Object.keys(params).forEach((element) => {
+          if (params[element].includes(data[element])) {
+            visible = true;
+          }
+        });
+      }
+      return visible;
     },
-    computed: {
-        computed_list() {
-            const object = {};
-            this.config
-                .filter(({ type }) => type === "edit")
-                .forEach(({ props, type }) => {
-                    object[`${props}_${type}`] = false;
-                });
-            return this.list.map((element) => ({
-                ...element,
-                ...object,
-            }));
-        },
+    handleClick(props, row) {
+      this.$emit(props, row);
     },
-    methods: {
-        handleClick(props, row) {
-            this.$emit(props, row);
-        },
-        handleEdit({ scope, type, props }) {
-            scope.row[`${props}_${type}`] = !scope.row[`${props}_${type}`];
-            this.$emit(props, scope.row);
-        },
+    handleEdit({ scope, type, props }) {
+      scope.row[`${props}_${type}`] = !scope.row[`${props}_${type}`];
+      this.$emit(props, scope.row);
     },
+  },
 };
 </script>

+ 29 - 10
src/pages/main/performance/department.vue

@@ -22,6 +22,7 @@
       ></simple-pagination>
     </div>
     <simple-dialog
+      fullscreen
       title="部门绩效"
       :visible="visible"
       :reload="reload"
@@ -30,15 +31,21 @@
     >
       <template>
         <!-- 按钮部分 -->
-        <div class="flex-justify-between">
+        <div class="flex-justify-between padding-right-20 padding-left-20">
           <div>
-            <el-button type="primary">转派</el-button>
-            <el-button type="primary" @click="handleApprove">审批</el-button>
-            <el-button type="primary" @click="handleTrack">流程跟踪</el-button>
-            <el-button type="primary">导出</el-button>
+            <el-button type="primary" size="small">转派</el-button>
+            <el-button type="primary" @click="handleApprove" size="small"
+              >审批</el-button
+            >
+            <el-button type="primary" @click="handleTrack" size="small"
+              >流程跟踪</el-button
+            >
+            <el-button type="primary" size="small">导出</el-button>
           </div>
           <div>
-            <el-button @click="handleCancel" type="primary">返回</el-button>
+            <el-button @click="handleCancel" type="primary" size="small"
+              >返回</el-button
+            >
           </div>
         </div>
         <!-- 主体部分 -->
@@ -48,6 +55,7 @@
     </simple-dialog>
     <simple-dialog
       title="审批"
+      fullscreen
       :visible="approve_visible"
       :reload="reload"
       width="500px"
@@ -84,6 +92,7 @@
     </simple-dialog>
     <simple-dialog
       title="流程跟踪"
+      fullscreen
       :visible="track_visible"
       :reload="reload"
       width="600px"
@@ -91,9 +100,19 @@
       @cancel="beforeCancel"
     >
       <el-table :data="trackList" border>
-        <el-table-column prop="link" label="流程环节" align="center" width="180">
+        <el-table-column
+          prop="link"
+          label="流程环节"
+          align="center"
+          width="180"
+        >
         </el-table-column>
-        <el-table-column prop="creatperson" label="处理人" align="center" width="180">
+        <el-table-column
+          prop="creatperson"
+          label="处理人"
+          align="center"
+          width="180"
+        >
         </el-table-column>
         <el-table-column prop="explain" label="审批说明" align="center">
         </el-table-column>
@@ -107,14 +126,14 @@ import simpleForm from "./components/form.vue";
 import simpleTable from "./components/table.vue";
 import simplePagination from "./components/pagination.vue";
 import simpleDialog from "./components/dialog.vue";
-import Analysis from "./analysis.vue";
+import analysis from "./analysis.vue";
 export default {
   components: {
     simpleForm,
     simpleTable,
     simplePagination,
     simpleDialog,
-    Analysis,
+    analysis,
   },
   data() {
     return {