소스 검색

修改资产图片上传界面

yanwentao 2 년 전
부모
커밋
908f1e2834

+ 39 - 1
src/components/customer/ManuallyConfirmCountingDataStep1.vue

@@ -46,11 +46,29 @@
     <a-button type="primary" style="margin-top: 20px" @click="previousStep">
       上一步
     </a-button>
+    <a-modal v-model:visible="visible" width="800px" title="查看盘点单">
+      <li class="site">
+        <span class="labels">
+          <label>盘点单名称:{{ inventoryName }}</label>
+        </span>
+      </li>
+      <li class="site">
+        <span class="labels">
+          <label>盘点单编号: {{ inventoryNo }} </label>
+        </span>
+      </li>
+      <li class="site">
+        <span class="labels">
+          <a-button type="primary" @click="openCurdWindow()">查看盘点单</a-button>
+        </span>
+      </li>
+    </a-modal>
+    <Loading v-if="loading" />
   </div>
 </template>
 <script setup>
 import Common from '../../common/Common';
-import { SqlApi, Notify } from 'pc-component-v3';
+import { SqlApi, Notify,Uuid } from 'pc-component-v3';
 import { ref, reactive, defineEmits, onMounted } from 'vue';
 import { useRouter } from 'vue-router';
 import CommonTable from './CommonTable.vue';
@@ -137,6 +155,11 @@ const columns = reactive(
 );
 const dataSource = ref([]);
 const total = ref(0); // 数据总数
+const loading = ref(false);
+const visible = ref(false);
+const inventoryName = ref('');
+const inventoryNo = ref('');
+const inventoryId = ref(0);
 
 // 查询参数
 const searchParams = reactive({
@@ -167,6 +190,7 @@ const confirmInventory = id => {
 //盘亏数据生成盘点单
 const generateInventory = id => {
   const params = new FormData();
+  loading.value = true;
   params.append('id', String(id));
   $.ajax({
     url: Common.getApiURL('AssetInstanceResource/generateNewFromOld'),
@@ -181,6 +205,11 @@ const generateInventory = id => {
     success: function (data) {
       if (data.errorCode === 0) {
         Notify.success('提示', '盘亏数据生成盘点单成功!', 1500);
+        loading.value = false;
+        visible.value = true;
+        inventoryName.value = data.data.name;
+        inventoryNo.value = data.data.documentNo;
+        inventoryId.value = data.data.id;
       } else {
         Notify.error(data.errorMessage);
       }
@@ -210,6 +239,15 @@ const queryAssetDiscovery = () => {
   );
 };
 
+/**
+       * 打开资产盘点单的CURD窗口
+       */
+const openCurdWindow = () => {
+  let url = Common.getRedirectUrl('#/desktop/window/window-read/view/041101/0/' + inventoryId.value +
+          '?currPage=1&currIndex=1&totalCount=1&uuid=' + Uuid.createUUID());
+  window.open(url);
+};
+
 // 上一步跳转
 const previousStep = () => {
   router.push('/eam/assetInventory');

+ 7 - 1
src/components/sonicAlbumUpload/ImagesUpload.vue

@@ -27,6 +27,7 @@ import { UploadOutlined } from '@ant-design/icons-vue';
 const loading = ref(false);
 const imageFiles = ref([]); // 图片文件列表
 const imagesTotal = ref(0); // 一个文件内图片数量
+const imagesSize = ref(0); // 一个文件内图片大小
 const files = reactive({
   fileList: [], // 用来操作文件数据
   allFiles: [], // 文件夹中所有文件
@@ -37,6 +38,7 @@ const handleFolderUpload = info => {
   const filesArray = Array.from(files.fileList);
   imageFiles.value = filesArray.filter(file => file.type.includes('image'));
   imagesTotal.value = imageFiles.value.length;
+  imagesSize.value += info.file.size;
   uploadImages();
 };
 
@@ -48,7 +50,11 @@ const uploadImages = debounce(() => {
 const uploadFile = () => {
   if (imagesTotal.value == 0) {
     message.warning('请选择含有图片的文件夹!');
-  } else {
+  } 
+  // else if(imagesSize.value > 209715200) {
+  //   message.warning('文件夹内文件大小超过200M无法上传!');
+  // } 
+  else{
     const formData = new FormData();
     imageFiles.value.map(item => {
       formData.append('imageFiles', item);

+ 32 - 5
src/components/sonicAlbumUpload/configData.js

@@ -17,21 +17,48 @@ export const imageColumns = [{
   width: 120,
 }];
 
-export const assetColumns = [{
+export const resultColumns = [{
   title: '资产名称',
   key: 'assetName',
   dataIndex: 'assetName',
-  width: 120,
+  width: 100,
 }, {
   title: '资产编号',
   key: 'assetNo',
   dataIndex: 'assetNo',
+  width: 100,
+}, {
+  title: '导入结果',
+  key: 'result',
+  dataIndex: 'result',
   width: 120,
+}];
+
+export const assetColumns = [{
+  title: '资产名称',
+  key: 'assetName',
+  dataIndex: 'assetName',
+  width: 100,
+}, {
+  title: '资产编号',
+  key: 'assetNo',
+  dataIndex: 'assetNo',
+  width: 100,
+},{
+  title: '使用人',
+  key: 'useUser',
+  dataIndex: 'useUser',
+  width: 100,
+},{
+  title: '保管人',
+  key: 'custodianUser',
+  dataIndex: 'custodianUser',
+  width: 100,
 }, {
   title: '主图片',
   key: 'mainImageName',
   dataIndex: 'mainImageName',
-  width: 120,
+  width: 100,
 }, {
   title: '其他图片',
   key: 'otherImageName',
@@ -147,9 +174,9 @@ export const importExcel = () => {
     });
   });
 };
-// 查询临时表资产数据及图片
+// 查询资产数据及图片
 export const queryAssetData = params => {
-  var requestUrl = 'AssetImageImportResource/queryAssetImageImport';
+  var requestUrl = 'AssetInstanceResource/queryAssetImageImport';
   return new Promise((resolve, reject) => {
     $.ajax({
       url: Common.getApiURL(requestUrl),

+ 159 - 169
src/components/sonicAlbumUpload/index.vue

@@ -3,63 +3,55 @@
   <div class="container-box">
     <div class="step">
       <label>1. 选择公司</label>
-      <a-select
-        v-model:value="company"
-        style="width: 200px; margin: 0 12px"
-        :options="companies"
-      />
-      <a-button @click="downloadBtn">下载导入模板</a-button>
+      <a-select v-model:value="company" style="width: 200px; margin: 0 12px" :options="companies" />
+      <a-button :disabled="company==''?true:false" @click="downloadBtn">下载导入模板</a-button>
     </div>
     <div class="step">
-      <label style="margin-bottom: 12px">2. 上传资产图片Excel和图片文件</label>
+      <label style="margin-bottom: 12px">2. 上传资产图片文件夹</label>
       <div>
-        <ImagesUpload />
+        <ImagesUpload v-show="company==''?false:true" />
         <p class="pStyle">支持拓展名:.png .jpg .jpeg .gif</p>
         <p class="pStyle">
-          <a @click="viewImage">查看上传的图片</a>
+          <a :disabled="company==''?true:false" @click="viewImage">查看上传的图片</a>
         </p>
+      </div>
+      <div class="step">
+        <label style="margin-bottom: 12px">3. 上传资产图片名称Excel</label>
         <div style="display: flex">
           <a-upload
-            v-model:file-list="excelFiles"
-            :max-count="1"
-            :before-upload="beforeUpload"
-            :show-upload-list="{ showRemoveIcon: false }"
+            v-model:file-list="excelFiles" :max-count="1" :before-upload="beforeUpload" :show-upload-list="{ showRemoveIcon: false }"
             @change="excelFileChange"
           >
-            <a-button>
+            <a-button :disabled="company==''?true:false">
               <upload-outlined />
               上传资产图片Excel
             </a-button>
           </a-upload>
-          <a-button
-            style="margin-left: 8px"
-            type="primary"
-            @click="testImport"
-          >
+          <a-button :disabled="company==''?true:false" style="margin-left: 8px" type="primary" @click="testImport">
             测试导入
           </a-button>
-          <a-button
-            style="margin-left: 8px"
-            type="primary"
-            @click="importImageExcel"
-          >
+          <a-button :disabled="company==''?true:false" style="margin-left: 8px" type="primary" @click="importImageExcel">
             正式导入
           </a-button>
         </div>
         <p class="pStyle">支持拓展名:.xlsx</p>
+        <div v-show="company==''?false:true">
+          <CommonTable
+            ref="table" :total="totalResult" :is-select="false" :columns="resultImageColumns" :is-loading="isLoading"
+            :data-source="resultImageDatas" 
+          />
+        </div>
       </div>
     </div>
     <div class="step">
-      <label style="margin-bottom: 12px">3. 资产图片</label>
+      <label style="margin-bottom: 12px">4. 资产实际图片</label>
       <ul class="siteList">
         <li class="site">
           <span class="labels">
             <label>资产名称</label>
           </span>
           <a-input
-            v-model:value="assetName"
-            style="width: 70%; height: 30px"
-            placeholder="请输入资产名称"
+            v-model:value="assetName" :disabled="company==''?true:false" style="width: 70%; height: 30px" placeholder="请输入资产名称"
             @change="searchDatas"
           />
         </li>
@@ -68,9 +60,7 @@
             <label>资产编号</label>
           </span>
           <a-input
-            v-model:value="assetNo"
-            style="width: 70%; height: 30px"
-            placeholder="请输入资产编号"
+            v-model:value="assetNo" :disabled="company==''?true:false" style="width: 70%; height: 30px" placeholder="请输入资产编号"
             @change="searchDatas"
           />
         </li>
@@ -79,43 +69,32 @@
             <label>图片状态</label>
           </span>
           <a-select
-            v-model:value="imageStatus"
-            style="width: 70%"
-            placeholder="请选择图片状态"
-            :options="imageAllStatus"
-            @change="searchDatas"
+            v-model:value="imageStatus" :disabled="company==''?true:false" style="width: 70%" placeholder="请选择图片状态"
+            :options="imageAllStatus" @change="searchDatas"
           />
         </li>
+        <li class="site">
+          <span class="labels">
+            <a-button :disabled="company==''?true:false" type="primary" @click="searchDatas">查询</a-button>
+          </span>
+        </li>
       </ul>
       <CommonTable
-        ref="table"
-        class="table"
-        :total="assetTotal"
-        :is-loading="isLoading"
-        :columns="assetImageColumns"
-        :data-source="assetImageDatas"
-        @page-params="getPageParams"
-        @select-column="selectColumn"
+        ref="table" class="table" :total="assetTotal" :is-loading="isLoading" :columns="assetImageColumns"
+        :data-source="assetImageDatas" @page-params="getPageParams" @select-column="selectColumn"
       >
         <template #bodyCell="{ column, record }">
           <template v-if="column.key === 'mainImageName'">
             <a-image
-              v-if="record.mainImageName !== ''"
-              :width="50"
-              :src="
+              v-if="record.mainImageName !== ''&&record.mainImageName !== null" :width="50" :src="
                 getThumbnailImageSrc(record.className, record.mainImageName)
               "
             />
           </template>
           <template v-if="column.key === 'otherImageName'">
-            <template v-if="record.otherImageName !== ''">
+            <template v-if="record.otherImageName !== ''&&record.otherImageName !== null">
               <div style="display: flex">
-                <a-image
-                  v-for="item in record.otherImageNameArr"
-                  :key="item"
-                  :width="50"
-                  :src="getThumbnailImageSrc(record.className, item)"
-                />
+                <a-image v-for="item in record.otherImageNameArr" :key="item" :width="50" :src="getThumbnailImageSrc(record.className, item)" />
               </div>
             </template>
           </template>
@@ -125,19 +104,13 @@
   </div>
   <a-modal v-model:visible="downloadVisible" title="请选择下载数据范围">
     <p>
-      全部数据:下载当前选择公司的全部资产图片数据。<a
-        @click="downloadReport(0)"
-      >下载</a>
+      全部数据:下载当前选择公司的全部资产图片数据。<a @click="downloadReport(0)">下载</a>
     </p>
     <p>
-      无主图片:下载当前选择公司的资产中无主图片的数据。<a
-        @click="downloadReport(1)"
-      >下载</a>
+      无主图片:下载当前选择公司的资产中无主图片的数据。<a @click="downloadReport(1)">下载</a>
     </p>
     <p>
-      无主图片或其他图片:下载当前选择公司中资产无主图片或无其他图片的数据。<a
-        @click="downloadReport(2)"
-      >下载</a>
+      无主图片或其他图片:下载当前选择公司中资产无主图片或无其他图片的数据。<a @click="downloadReport(2)">下载</a>
     </p>
     <template #footer>
       <a-button @click="downloadVisible = false">取消</a-button>
@@ -145,38 +118,22 @@
   </a-modal>
   <a-modal v-model:visible="imagesVisible" width="800px" title="已上传图片数据">
     <div class="operation">
-      <a-button
-        danger
-        :disabled="deleteParams.length > 0 ? false : true"
-        @click="deleteImageData"
-      >
+      <a-button danger :disabled="deleteParams.length > 0 ? false : true" @click="deleteImageData">
         删除
         {{ deleteParams.length > 0 ? `${deleteParams.length} 张资产图片` : "" }}
       </a-button>
       <a-input-search
-        v-model:value="imageNameParams"
-        placeholder="请输入图片名称进行搜索"
-        style="width: 30%"
-        @change="searchImage"
+        v-model:value="imageNameParams" placeholder="请输入图片名称进行搜索" style="width: 30%" @change="searchImage"
         @search="searchImage"
       />
     </div>
     <CommonTable
-      ref="table"
-      :total="total"
-      :is-select="true"
-      :columns="viewColumns"
-      :is-loading="isLoading"
-      :data-source="viewDatas"
+      ref="table" :total="total" :is-select="true" :columns="viewColumns" :is-loading="isLoading" :data-source="viewDatas"
       @select-column="selectColumn"
     >
       <template #bodyCell="{ column, record }">
         <template v-if="column.key === 'imageName'">
-          <a-image
-            v-if="record.imageName !== ''"
-            :width="50"
-            :src="getImageSrc(record.className, record.imageName)"
-          />
+          <a-image v-if="record.imageName !== ''" :width="50" :src="getImageSrc(record.className, record.imageName)" />
           <span>{{ record.imageName }}</span>
         </template>
       </template>
@@ -190,12 +147,23 @@
 
 <script setup>
 import Common from '../../common/Common';
-import { Notify } from 'pc-component-v3';
-import { message } from 'ant-design-vue';
+import {
+  Notify,
+} from 'pc-component-v3';
+import {
+  message,
+} from 'ant-design-vue';
 import ImagesUpload from './ImagesUpload.vue';
 import CommonTable from './CommonTable.vue';
-import { UploadOutlined } from '@ant-design/icons-vue';
-import { ref, reactive, onMounted, onBeforeUnmount } from 'vue';
+import {
+  UploadOutlined,
+} from '@ant-design/icons-vue';
+import {
+  ref,
+  reactive,
+  onMounted,
+  onBeforeUnmount,
+} from 'vue';
 import {
   debounce,
   queryImages,
@@ -203,14 +171,19 @@ import {
   deleteImage,
   imageColumns,
   assetColumns,
+  resultColumns,
   queryAssetData,
   deleteAssetData,
   testImportExcel,
   listClientCanAccess,
 } from './configData.js';
-import { getImageSrc, getThumbnailImageSrc } from '../../common/image-src.js';
+import {
+  getImageSrc,
+  getThumbnailImageSrc,
+} from '../../common/image-src.js';
 
 const total = ref(0);
+const totalResult = ref(0);
 const company = ref('');
 const table = ref(null);
 const assetNo = ref('');
@@ -219,6 +192,7 @@ const imageStatus = ref(0);
 const assetTotal = ref(0);
 const companies = ref([]);
 const viewDatas = ref([]);
+const resultImageDatas = ref([]);
 const excelFiles = ref([]);
 const loading = ref(false);
 const isLoading = ref(false);
@@ -229,24 +203,24 @@ const imagesVisible = ref(false);
 const downloadVisible = ref(false);
 const viewColumns = ref(imageColumns);
 const assetImageColumns = ref(assetColumns);
+const resultImageColumns = ref(resultColumns);
 const excelFile = ref(null);
 const pager = reactive({
   start: 0,
   length: 20,
 });
-const imageAllStatus = reactive([
-  {
-    value: 0,
-    label: '全部',
-  },
-  {
-    value: 1,
-    label: '缺图片(无主图片或无其他图片)',
-  },
-  {
-    value: 2,
-    label: '有图片(有主图片或有其他图片)',
-  },
+const imageAllStatus = reactive([{
+  value: 0,
+  label: '全部',
+},
+{
+  value: 1,
+  label: '缺图片(无主图片或无其他图片)',
+},
+{
+  value: 2,
+  label: '有图片(有主图片或有其他图片)',
+},
 ]);
 
 // 打开下载模板模态框
@@ -356,7 +330,7 @@ const testImport = () => {
       successData => {
         if (successData.errorCode == 0) {
           message.success('测试导入资产excel成功,请点击正式导入!');
-          searchAsset();
+          resultImageDatas.value = successData.datas;
         } else {
           message.warning(successData.errorMessage);
         }
@@ -396,6 +370,7 @@ const searchAsset = () => {
     assetNo: assetNo.value,
     type: imageStatus.value,
     assetName: assetName.value,
+    clientId: company.value,
     ...pager,
   };
   loading.value = true;
@@ -403,7 +378,7 @@ const searchAsset = () => {
     successData => {
       if (successData.errorCode == 0) {
         successData.datas.forEach(item => {
-          if (item.otherImageName !== '') {
+          if (item.otherImageName !== null && item.otherImageName !== '') {
             item.otherImageNameArr = item.otherImageName.split(',');
           }
         });
@@ -463,7 +438,10 @@ const getClient = () => {
     successData => {
       if (successData.errorCode == 0) {
         successData.datas.forEach(item => {
-          companies.value.push({ label: item.name, value: item.id });
+          companies.value.push({
+            label: item.name,
+            value: item.id,
+          });
         });
       } else {
         Notify.error('错误', successData.errorMessage, false);
@@ -477,68 +455,80 @@ const getClient = () => {
 </script>
 
 <style scoped>
-.step {
-  margin-bottom: 12px;
-}
-.step > label {
-  font-size: 16px;
-}
-.pStyle {
-  margin: 6px 0;
-  color: rgba(0, 0, 0, 0.65);
-}
-.table {
-  margin-top: 2px !important;
-}
-
-.siteList {
-  margin-bottom: 0 !important;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-}
-.siteList .site {
-  width: 300px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  position: relative;
-}
-.siteList > li {
-  margin-bottom: 8px;
-  margin-left: 0px;
-}
-
-@media (min-width: 500px) {
-  .siteList {
-    margin-left: 0;
-    margin-right: -20px;
-    justify-content: flex-start;
-  }
-  .siteList > li {
-    margin-right: 8px;
-  }
-}
-.labels {
-  width: 80px;
-  text-align: center;
-}
-.labels > label {
-  font-weight: 400 !important;
-}
-.operation {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-}
-.tablePaganations {
-  margin-top: 6px;
-}
-:deep(.ant-image-img) {
-  width: 50px !important;
-  height: 50px !important;
-}
-.ant-image {
-  margin-right: 6px !important;
-}
-</style>
+	.step {
+		margin-bottom: 12px;
+	}
+
+	.step>label {
+		font-size: 16px;
+	}
+
+	.pStyle {
+		margin: 6px 0;
+		color: rgba(0, 0, 0, 0.65);
+	}
+
+	.table {
+		margin-top: 2px !important;
+	}
+
+	.siteList {
+		margin-bottom: 0 !important;
+		display: flex;
+		flex-wrap: wrap;
+		justify-content: space-between;
+	}
+
+	.siteList .site {
+		width: 300px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		position: relative;
+	}
+
+	.siteList>li {
+		margin-bottom: 8px;
+		margin-left: 0px;
+	}
+
+	@media (min-width: 500px) {
+		.siteList {
+			margin-left: 0;
+			margin-right: -20px;
+			justify-content: flex-start;
+		}
+
+		.siteList>li {
+			margin-right: 8px;
+		}
+	}
+
+	.labels {
+		width: 80px;
+		text-align: center;
+	}
+
+	.labels>label {
+		font-weight: 400 !important;
+	}
+
+	.operation {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+	}
+
+	.tablePaganations {
+		margin-top: 6px;
+	}
+
+	:deep(.ant-image-img) {
+		width: 50px !important;
+		height: 50px !important;
+	}
+
+	.ant-image {
+		margin-right: 6px !important;
+	}
+</style>