p-pc-ui 1.3.5 → 1.3.6

package/dist/components/p-table/p-table.vue

@@ -2,33 +2,36 @@
 // import "viewerjs/dist/viewer.css";
 import { api as viewerApi } from "v-viewer";
 import PForm from "../p-form/p-form.vue";
-import { h, ref, reactive, onMounted, toRaw,defineExpose } from "vue";
+import { h, ref, reactive, onMounted, toRaw } from "vue";
 import * as _ from "../../utils/dataUtils";
 import dayjs from "dayjs";
-import { Table as ATable, Button as AButton,Textarea as ATextarea  } from "ant-design-vue";
+import { Table as ATable, Button as AButton, Textarea as ATextarea } from "ant-design-vue";
 import type { FormDataItem } from "../p-form/index.d";
 import type { TableColumn } from "./index.d";
 import { useSlots } from "vue";
 const SearchFormRef = ref();
 
-const uSlots  = useSlots()
+const uSlots = useSlots();
 
-
-interface Props{
+interface Props {
   tableColumns: TableColumn[];
   height?: number;
-  editColumns?:string[]
-  getData?: ((query: object) => Promise<{ data: any[]; count: number; pages: { total: number; now: number } }>);
+  editColumns?: string[];
+  getData?: (query: object) => Promise<{ data: any[]; count: number; pages: { total: number; now: number } }>;
   searchRenderData?: FormDataItem[];
   initSearchFormData?: any;
-  data?:any[]
+  data?: any[];
 }
 
-
-
-const  {getData =null,data= [],height=1000,searchRenderData = [],editColumns = [],tableColumns = [],initSearchFormData =[]} = defineProps<Props>()
-
-
+const {
+  getData = null,
+  data = [],
+  height = 1000,
+  searchRenderData = [],
+  editColumns = [],
+  tableColumns = [],
+  initSearchFormData = [],
+} = defineProps<Props>();
 
 const pageQuery = reactive({
   p: 1,
@@ -55,14 +58,13 @@ const rowSelection = {
 
 const editableData = reactive({});
 
-
 const loading = ref(false);
 
 let searchQuery = {};
 
 const renderTableColumns = (tableColumns: TableColumn[]) => {
   const returnColumns: any = [];
-  for (const [index,renderItem] of tableColumns.entries()) {
+  for (const [index, renderItem] of tableColumns.entries()) {
     if (renderItem.type == "operate") {
       // renderItem.customRender = ({ text, record }) => {
       //   const buttons: any = [];
@@ -83,15 +85,14 @@ const renderTableColumns = (tableColumns: TableColumn[]) => {
       //   return h("div", { style: { display: "flex", justifyContent: "space-around" } }, buttons);
       // };
 
-      if(!renderItem.width){
+      if (!renderItem.width) {
         renderItem.width = renderItem.operateButtons.length * 60;
       }
 
-      if(editColumns.length > 0){
-        renderItem.width +=110
+      if (editColumns.length > 0) {
+        renderItem.width += 110;
       }
       renderItem.align = "center";
-
     }
 
     // 处理默认字段
@@ -137,7 +138,7 @@ const renderTableColumns = (tableColumns: TableColumn[]) => {
               height: (renderItem.picHeight || 60) + "px",
               marginLeft: "10px",
             },
-          })
+          }),
         );
       };
     }
@@ -160,12 +161,8 @@ const renderTableColumns = (tableColumns: TableColumn[]) => {
 
     renderItem["dataIndex"] = renderItem["key"];
     returnColumns.push(renderItem);
-    
   }
 
-
-
-
   return returnColumns;
 };
 
@@ -173,24 +170,21 @@ const columns = renderTableColumns(tableColumns);
 
 const renderTableData = async () => {
   loading.value = true;
-  if(getData){
+  if (getData) {
     const _searchInitFormData = initSearchFormData ? JSON.parse(JSON.stringify(initSearchFormData)) : {};
     const _pageQuery = JSON.parse(JSON.stringify(pageQuery));
     const _tableData = await getData({ ..._searchInitFormData, ..._pageQuery, ..._.cloneDeep(searchQuery) });
     tableData.data = _tableData.data;
     tableData.count = _tableData.count;
     tableData.pages = _tableData.pages;
+  } else if (data) {
+    tableData.data = data;
   }
 
-  else if(data){
-    tableData.data = data
-  }
-
+  tableData.data.forEach((item, index) => {
+    item["index"] = index;
+  });
 
-  tableData.data.forEach((item,index)=>{
-      item["index"] = index
-  })
-  
   loading.value = false;
 };
 
@@ -249,15 +243,11 @@ const getTableData = () => {
   return toRaw(tableData)["data"];
 };
 
-
-
 const edit = (index: string) => {
   editableData[index] = _.cloneDeep(tableData.data[index]);
-
-
 };
 const save = (key: string) => {
-  Object.assign(tableData.data.filter(item => key === item.key)[0], editableData[key]);
+  Object.assign(tableData.data.filter((item) => key === item.key)[0], editableData[key]);
   delete editableData[key];
 };
 
@@ -292,7 +282,7 @@ defineExpose({
     </PForm>
   </div>
 
-  <div v-if="uSlots.button"  style="display: flex; justify-content: flex-end; margin-bottom: 10px; padding: 20px">
+  <div v-if="uSlots.button" style="display: flex; justify-content: flex-end; margin-bottom: 10px; padding: 20px">
     <slot name="button"></slot>
   </div>
 
@@ -300,21 +290,25 @@ defineExpose({
     rowKey="id"
     :row-selection="rowSelection"
     :columns="columns"
-    :data-source="data && data.length >0 ? data : (tableData.data || [])"
+    :data-source="data && data.length > 0 ? data : tableData.data || []"
     :loading="loading"
-    :pagination="data.length >0?  false :{
-      current: pageQuery.p,
-      defaultPageSize: pageQuery.pc,
-      showSizeChanger: true,
-      pageSizeOptions: ['10', '20', '50', '100', '200'],
-      total: tableData.count,
-      onChange: onPageChange,
-      onShowSizeChange: onPageSizeChange,
-    }"
+    :pagination="
+      data.length > 0
+        ? false
+        : {
+            current: pageQuery.p,
+            defaultPageSize: pageQuery.pc,
+            showSizeChanger: true,
+            pageSizeOptions: ['10', '20', '50', '100', '200'],
+            total: tableData.count,
+            onChange: onPageChange,
+            onShowSizeChange: onPageSizeChange,
+          }
+    "
     bordered
     @change="onchange"
   >
-    <template #bodyCell="{ column, text, record,index }">
+    <template #bodyCell="{ column, text, record, index }">
       <template v-if="editColumns.includes(column.key as string)">
         <div>
           <a-textarea
@@ -324,22 +318,25 @@ defineExpose({
             :auto-size="true"
           />
           <template v-else>
-           {{text}}
+            {{ text }}
           </template>
         </div>
       </template>
 
       <template v-else-if="column['type'] === 'operate'">
-
-        <div style="display:flex;gap:10px;justify-content: center;">
-          <a class="operate-a" v-for="item in column['operateButtons']" @click="item.click(record)"> {{ item.label}}</a>
+        <div style="display: flex; gap: 10px; justify-content: center">
+          <span v-for="item in column['operateButtons']">
+            <a v-if="item.visibleFunc && item.visibleFunc(record)" class="operate-a" @click="item.click(record)">
+              {{ item.label }}</a
+            >
+          </span>
           <a class="operate-a" v-if="editableData[record.index]" @click="save(record.index)">保存</a>
-              <a class="operate-a" v-if="editableData[record.index]" @click="cancel(record.index)">退出</a>
-            <a v-if="editColumns.length>0" class="operate-a" @click="edit(record.index)">编辑</a>
+          <a class="operate-a" v-if="editableData[record.index]" @click="cancel(record.index)">退出</a>
+          <a v-if="editColumns.length > 0" class="operate-a" @click="edit(record.index)">编辑</a>
         </div>
       </template>
 
-      <slot name="bodyCell" v-bind="{column, text, record,index}" />
+      <slot name="bodyCell" v-bind="{ column, text, record, index }" />
     </template>
   </a-table>
 </template>
@@ -365,8 +362,7 @@ defineExpose({
   border-bottom: 10px solid #f5f5f5;
 }
 
-
-.operate-a{
+.operate-a {
   color: #126cff;
 }
 </style>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "p-pc-ui",
-  "version": "1.3.5",
+  "version": "1.3.6",
   "type": "module",
   "module": "dist/index.ts",
   "main": "dist/index.ts",