|
@@ -3,63 +3,55 @@
|
|
|
<div class="container-box">
|
|
<div class="container-box">
|
|
|
<div class="step">
|
|
<div class="step">
|
|
|
<label>1. 选择公司</label>
|
|
<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>
|
|
|
<div class="step">
|
|
<div class="step">
|
|
|
- <label style="margin-bottom: 12px">2. 上传资产图片Excel和图片文件</label>
|
|
|
|
|
|
|
+ <label style="margin-bottom: 12px">2. 上传资产图片文件夹</label>
|
|
|
<div>
|
|
<div>
|
|
|
- <ImagesUpload />
|
|
|
|
|
|
|
+ <ImagesUpload v-show="company==''?false:true" />
|
|
|
<p class="pStyle">支持拓展名:.png .jpg .jpeg .gif</p>
|
|
<p class="pStyle">支持拓展名:.png .jpg .jpeg .gif</p>
|
|
|
<p class="pStyle">
|
|
<p class="pStyle">
|
|
|
- <a @click="viewImage">查看上传的图片</a>
|
|
|
|
|
|
|
+ <a :disabled="company==''?true:false" @click="viewImage">查看上传的图片</a>
|
|
|
</p>
|
|
</p>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ <div class="step">
|
|
|
|
|
+ <label style="margin-bottom: 12px">3. 上传资产图片名称Excel</label>
|
|
|
<div style="display: flex">
|
|
<div style="display: flex">
|
|
|
<a-upload
|
|
<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"
|
|
@change="excelFileChange"
|
|
|
>
|
|
>
|
|
|
- <a-button>
|
|
|
|
|
|
|
+ <a-button :disabled="company==''?true:false">
|
|
|
<upload-outlined />
|
|
<upload-outlined />
|
|
|
上传资产图片Excel
|
|
上传资产图片Excel
|
|
|
</a-button>
|
|
</a-button>
|
|
|
</a-upload>
|
|
</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>
|
|
|
- <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>
|
|
</a-button>
|
|
|
</div>
|
|
</div>
|
|
|
<p class="pStyle">支持拓展名:.xlsx</p>
|
|
<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>
|
|
</div>
|
|
|
<div class="step">
|
|
<div class="step">
|
|
|
- <label style="margin-bottom: 12px">3. 资产图片</label>
|
|
|
|
|
|
|
+ <label style="margin-bottom: 12px">4. 资产实际图片</label>
|
|
|
<ul class="siteList">
|
|
<ul class="siteList">
|
|
|
<li class="site">
|
|
<li class="site">
|
|
|
<span class="labels">
|
|
<span class="labels">
|
|
|
<label>资产名称</label>
|
|
<label>资产名称</label>
|
|
|
</span>
|
|
</span>
|
|
|
<a-input
|
|
<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"
|
|
@change="searchDatas"
|
|
|
/>
|
|
/>
|
|
|
</li>
|
|
</li>
|
|
@@ -68,9 +60,7 @@
|
|
|
<label>资产编号</label>
|
|
<label>资产编号</label>
|
|
|
</span>
|
|
</span>
|
|
|
<a-input
|
|
<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"
|
|
@change="searchDatas"
|
|
|
/>
|
|
/>
|
|
|
</li>
|
|
</li>
|
|
@@ -79,43 +69,32 @@
|
|
|
<label>图片状态</label>
|
|
<label>图片状态</label>
|
|
|
</span>
|
|
</span>
|
|
|
<a-select
|
|
<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>
|
|
|
|
|
+ <li class="site">
|
|
|
|
|
+ <span class="labels">
|
|
|
|
|
+ <a-button :disabled="company==''?true:false" type="primary" @click="searchDatas">查询</a-button>
|
|
|
|
|
+ </span>
|
|
|
|
|
+ </li>
|
|
|
</ul>
|
|
</ul>
|
|
|
<CommonTable
|
|
<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 #bodyCell="{ column, record }">
|
|
|
<template v-if="column.key === 'mainImageName'">
|
|
<template v-if="column.key === 'mainImageName'">
|
|
|
<a-image
|
|
<a-image
|
|
|
- v-if="record.mainImageName !== ''"
|
|
|
|
|
- :width="50"
|
|
|
|
|
- :src="
|
|
|
|
|
|
|
+ v-if="record.mainImageName !== ''&&record.mainImageName !== null" :width="50" :src="
|
|
|
getThumbnailImageSrc(record.className, record.mainImageName)
|
|
getThumbnailImageSrc(record.className, record.mainImageName)
|
|
|
"
|
|
"
|
|
|
/>
|
|
/>
|
|
|
</template>
|
|
</template>
|
|
|
<template v-if="column.key === 'otherImageName'">
|
|
<template v-if="column.key === 'otherImageName'">
|
|
|
- <template v-if="record.otherImageName !== ''">
|
|
|
|
|
|
|
+ <template v-if="record.otherImageName !== ''&&record.otherImageName !== null">
|
|
|
<div style="display: flex">
|
|
<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>
|
|
</div>
|
|
|
</template>
|
|
</template>
|
|
|
</template>
|
|
</template>
|
|
@@ -125,19 +104,13 @@
|
|
|
</div>
|
|
</div>
|
|
|
<a-modal v-model:visible="downloadVisible" title="请选择下载数据范围">
|
|
<a-modal v-model:visible="downloadVisible" title="请选择下载数据范围">
|
|
|
<p>
|
|
<p>
|
|
|
- 全部数据:下载当前选择公司的全部资产图片数据。<a
|
|
|
|
|
- @click="downloadReport(0)"
|
|
|
|
|
- >下载</a>
|
|
|
|
|
|
|
+ 全部数据:下载当前选择公司的全部资产图片数据。<a @click="downloadReport(0)">下载</a>
|
|
|
</p>
|
|
</p>
|
|
|
<p>
|
|
<p>
|
|
|
- 无主图片:下载当前选择公司的资产中无主图片的数据。<a
|
|
|
|
|
- @click="downloadReport(1)"
|
|
|
|
|
- >下载</a>
|
|
|
|
|
|
|
+ 无主图片:下载当前选择公司的资产中无主图片的数据。<a @click="downloadReport(1)">下载</a>
|
|
|
</p>
|
|
</p>
|
|
|
<p>
|
|
<p>
|
|
|
- 无主图片或其他图片:下载当前选择公司中资产无主图片或无其他图片的数据。<a
|
|
|
|
|
- @click="downloadReport(2)"
|
|
|
|
|
- >下载</a>
|
|
|
|
|
|
|
+ 无主图片或其他图片:下载当前选择公司中资产无主图片或无其他图片的数据。<a @click="downloadReport(2)">下载</a>
|
|
|
</p>
|
|
</p>
|
|
|
<template #footer>
|
|
<template #footer>
|
|
|
<a-button @click="downloadVisible = false">取消</a-button>
|
|
<a-button @click="downloadVisible = false">取消</a-button>
|
|
@@ -145,38 +118,22 @@
|
|
|
</a-modal>
|
|
</a-modal>
|
|
|
<a-modal v-model:visible="imagesVisible" width="800px" title="已上传图片数据">
|
|
<a-modal v-model:visible="imagesVisible" width="800px" title="已上传图片数据">
|
|
|
<div class="operation">
|
|
<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} 张资产图片` : "" }}
|
|
{{ deleteParams.length > 0 ? `${deleteParams.length} 张资产图片` : "" }}
|
|
|
</a-button>
|
|
</a-button>
|
|
|
<a-input-search
|
|
<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"
|
|
@search="searchImage"
|
|
|
/>
|
|
/>
|
|
|
</div>
|
|
</div>
|
|
|
<CommonTable
|
|
<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"
|
|
@select-column="selectColumn"
|
|
|
>
|
|
>
|
|
|
<template #bodyCell="{ column, record }">
|
|
<template #bodyCell="{ column, record }">
|
|
|
<template v-if="column.key === 'imageName'">
|
|
<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>
|
|
<span>{{ record.imageName }}</span>
|
|
|
</template>
|
|
</template>
|
|
|
</template>
|
|
</template>
|
|
@@ -190,12 +147,23 @@
|
|
|
|
|
|
|
|
<script setup>
|
|
<script setup>
|
|
|
import Common from '../../common/Common';
|
|
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 ImagesUpload from './ImagesUpload.vue';
|
|
|
import CommonTable from './CommonTable.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 {
|
|
import {
|
|
|
debounce,
|
|
debounce,
|
|
|
queryImages,
|
|
queryImages,
|
|
@@ -203,14 +171,19 @@ import {
|
|
|
deleteImage,
|
|
deleteImage,
|
|
|
imageColumns,
|
|
imageColumns,
|
|
|
assetColumns,
|
|
assetColumns,
|
|
|
|
|
+ resultColumns,
|
|
|
queryAssetData,
|
|
queryAssetData,
|
|
|
deleteAssetData,
|
|
deleteAssetData,
|
|
|
testImportExcel,
|
|
testImportExcel,
|
|
|
listClientCanAccess,
|
|
listClientCanAccess,
|
|
|
} from './configData.js';
|
|
} from './configData.js';
|
|
|
-import { getImageSrc, getThumbnailImageSrc } from '../../common/image-src.js';
|
|
|
|
|
|
|
+import {
|
|
|
|
|
+ getImageSrc,
|
|
|
|
|
+ getThumbnailImageSrc,
|
|
|
|
|
+} from '../../common/image-src.js';
|
|
|
|
|
|
|
|
const total = ref(0);
|
|
const total = ref(0);
|
|
|
|
|
+const totalResult = ref(0);
|
|
|
const company = ref('');
|
|
const company = ref('');
|
|
|
const table = ref(null);
|
|
const table = ref(null);
|
|
|
const assetNo = ref('');
|
|
const assetNo = ref('');
|
|
@@ -219,6 +192,7 @@ const imageStatus = ref(0);
|
|
|
const assetTotal = ref(0);
|
|
const assetTotal = ref(0);
|
|
|
const companies = ref([]);
|
|
const companies = ref([]);
|
|
|
const viewDatas = ref([]);
|
|
const viewDatas = ref([]);
|
|
|
|
|
+const resultImageDatas = ref([]);
|
|
|
const excelFiles = ref([]);
|
|
const excelFiles = ref([]);
|
|
|
const loading = ref(false);
|
|
const loading = ref(false);
|
|
|
const isLoading = ref(false);
|
|
const isLoading = ref(false);
|
|
@@ -229,24 +203,24 @@ const imagesVisible = ref(false);
|
|
|
const downloadVisible = ref(false);
|
|
const downloadVisible = ref(false);
|
|
|
const viewColumns = ref(imageColumns);
|
|
const viewColumns = ref(imageColumns);
|
|
|
const assetImageColumns = ref(assetColumns);
|
|
const assetImageColumns = ref(assetColumns);
|
|
|
|
|
+const resultImageColumns = ref(resultColumns);
|
|
|
const excelFile = ref(null);
|
|
const excelFile = ref(null);
|
|
|
const pager = reactive({
|
|
const pager = reactive({
|
|
|
start: 0,
|
|
start: 0,
|
|
|
length: 20,
|
|
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 => {
|
|
successData => {
|
|
|
if (successData.errorCode == 0) {
|
|
if (successData.errorCode == 0) {
|
|
|
message.success('测试导入资产excel成功,请点击正式导入!');
|
|
message.success('测试导入资产excel成功,请点击正式导入!');
|
|
|
- searchAsset();
|
|
|
|
|
|
|
+ resultImageDatas.value = successData.datas;
|
|
|
} else {
|
|
} else {
|
|
|
message.warning(successData.errorMessage);
|
|
message.warning(successData.errorMessage);
|
|
|
}
|
|
}
|
|
@@ -396,6 +370,7 @@ const searchAsset = () => {
|
|
|
assetNo: assetNo.value,
|
|
assetNo: assetNo.value,
|
|
|
type: imageStatus.value,
|
|
type: imageStatus.value,
|
|
|
assetName: assetName.value,
|
|
assetName: assetName.value,
|
|
|
|
|
+ clientId: company.value,
|
|
|
...pager,
|
|
...pager,
|
|
|
};
|
|
};
|
|
|
loading.value = true;
|
|
loading.value = true;
|
|
@@ -403,7 +378,7 @@ const searchAsset = () => {
|
|
|
successData => {
|
|
successData => {
|
|
|
if (successData.errorCode == 0) {
|
|
if (successData.errorCode == 0) {
|
|
|
successData.datas.forEach(item => {
|
|
successData.datas.forEach(item => {
|
|
|
- if (item.otherImageName !== '') {
|
|
|
|
|
|
|
+ if (item.otherImageName !== null && item.otherImageName !== '') {
|
|
|
item.otherImageNameArr = item.otherImageName.split(',');
|
|
item.otherImageNameArr = item.otherImageName.split(',');
|
|
|
}
|
|
}
|
|
|
});
|
|
});
|
|
@@ -463,7 +438,10 @@ const getClient = () => {
|
|
|
successData => {
|
|
successData => {
|
|
|
if (successData.errorCode == 0) {
|
|
if (successData.errorCode == 0) {
|
|
|
successData.datas.forEach(item => {
|
|
successData.datas.forEach(item => {
|
|
|
- companies.value.push({ label: item.name, value: item.id });
|
|
|
|
|
|
|
+ companies.value.push({
|
|
|
|
|
+ label: item.name,
|
|
|
|
|
+ value: item.id,
|
|
|
|
|
+ });
|
|
|
});
|
|
});
|
|
|
} else {
|
|
} else {
|
|
|
Notify.error('错误', successData.errorMessage, false);
|
|
Notify.error('错误', successData.errorMessage, false);
|
|
@@ -477,68 +455,80 @@ const getClient = () => {
|
|
|
</script>
|
|
</script>
|
|
|
|
|
|
|
|
<style scoped>
|
|
<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>
|