Skip to content

F
founder_vue
Commit 1e76b315 by 米嘉伟
Options

导入文件取消

parent 8783fbc4
Showing with 1017 additions and 1118 deletions
src/views/drFPTX/Index.vue
<template> <template>
<div <div
class='drFPTX' class='drFPTX'
id="drFPTX" id="drFPTX"
>
<el-radio-group
class='drlx'
v-model="drlx"
> >
<el-radio-group <el-radio
class='drlx' :label="3"
v-model="drlx" v-if="roleArr.includes('B-1-1')"
> >人员
<el-radio </el-radio>
:label="3" <el-radio
v-if="roleArr.includes('B-1-1')" :label="6"
>人员 v-if="roleArr.includes('B-1-2')"
</el-radio> >案件
<el-radio </el-radio>
:label="6" <el-radio
v-if="roleArr.includes('B-1-2')" :label="9"
>案件 v-if="roleArr.includes('B-1-3')"
</el-radio> >比中关系
<el-radio </el-radio>
:label="9" </el-radio-group>
v-if="roleArr.includes('B-1-3')" <div class='choose'>
>比中关系 <div class="wjlx">
</el-radio> <div class="left">
</el-radio-group> <el-radio-group v-model="wjlx">
<div class='choose'> <el-radio :label="3">文件</el-radio>
<div class="wjlx"> <el-radio :label="6">文件夹</el-radio>
<div class="left"> </el-radio-group>
<el-radio-group v-model="wjlx"> </div>
<el-radio :label="3">文件</el-radio> <div class="right">
<el-radio :label="6">文件夹</el-radio> <div class='center'>
</el-radio-group> <el-input
</div> placeholder="请选择文件路径"
<div class="right"> v-model="fileName"
<div class='center'> ></el-input>
<el-input <div class="line"></div>
placeholder="请选择文件路径" <div
v-model="fileName" class="text"
></el-input> @click="wjlx==3 ? uploadFile() : uploadFiles()"
<div class="line"></div> >选择
<div
class="text"
@click="wjlx==3 ? uploadFile() : uploadFiles()"
>选择
</div>
<!-- 上传 -->
<!-- style="display:none" -->
<el-upload
class="upload-demo"
ref="upload"
:multiple="true"
:action='action'
:on-preview="handlePreview"
:on-remove="handleRemove"
:on-success="uploadSuccess"
:on-change='onChange'
:on-progress="uploadProcess"
:file-list="fileList"
:auto-upload="false"
:before-upload="beforeUpload"
:show-file-list="false"
>
</el-upload>
</div>
</div>
</div> </div>
<el-button <!-- 上传 -->
type="primary" <!-- style="display:none" -->
@click="submitUpload" <el-upload
>导入 class="upload-demo"
</el-button> ref="upload"
:multiple="true"
:action='action'
:on-preview="handlePreview"
:on-remove="handleRemove"
:on-success="uploadSuccess"
:on-change='onChange'
:on-progress="uploadProcess"
:file-list="fileList"
:auto-upload="false"
:before-upload="beforeUpload"
:show-file-list="false"
>
</el-upload>
</div>
</div> </div>
<div class="divider"></div> </div>
<div <el-button
class='bottom' type="primary"
v-show="this.drlx==3||this.drlx==6" @click="submitUpload"
> >导入
<div class="left"> </el-button>
<el-col :span="11"> </div>
<div class="head"> <div class="divider"></div>
<div></div> <div
FPTX的条码号 class='bottom'
</div> v-show="this.drlx==3||this.drlx==6"
<el-table >
height="550" <div class="left">
:data="datas" <el-col :span="11">
@selection-change="checkAll1" <div class="head">
style="width: 100%" <div></div>
row-key="pid" FPTX的条码号
:tree-props="{children: 'sonBarcode', hasChildren: 'hasChildren'}" </div>
@expand-change="hadnlExpandChange1" <el-table
> height="550"
<el-table-column :data="datas"
type="selection" @selection-change="checkAll1"
:width="fptxWidth1" style="width: 100%"
:selectable="checkSelectable" row-key="pid"
> :tree-props="{children: 'sonBarcode', hasChildren: 'hasChildren'}"
@expand-change="hadnlExpandChange1"
</el-table-column> >
<el-table-column <el-table-column
prop="wjxh" type="selection"
:width="fptxWidth2" :width="fptxWidth1"
label="文件序号" :selectable="checkSelectable"
> >
<template slot-scope="scope">
<svg-icon </el-table-column>
style=" <el-table-column
prop="wjxh"
:width="fptxWidth2"
label="文件序号"
>
<template slot-scope="scope">
<svg-icon
style="
width: 0.875rem; width: 0.875rem;
height: 0.6875rem; height: 0.6875rem;
margin-bottom: 0.125rem; margin-bottom: 0.125rem;
...@@ -112,400 +112,400 @@ ...@@ -112,400 +112,400 @@
margin-right:0.625rem; margin-right:0.625rem;
" "
v-if="scope.row.sonBarcode || scope.row.sonBarcode === null" v-if="scope.row.sonBarcode || scope.row.sonBarcode === null"
icon-class="tree_f" icon-class="tree_f"
> >
</svg-icon> </svg-icon>
<svg-icon <svg-icon
style=" style="
width: 0.8125rem; width: 0.8125rem;
height: 0.375rem; height: 0.375rem;
margin: 0 0 0.1875rem 0; margin: 0 0 0.1875rem 0;
" "
v-else-if="!scope.row.sonBarcode || scope.row.sonBarcode !== null" v-else-if="!scope.row.sonBarcode || scope.row.sonBarcode !== null"
icon-class="tree_c" icon-class="tree_c"
></svg-icon> ></svg-icon>
{{ {{
scope.row.sonBarcode || scope.row.sonBarcode === null scope.row.sonBarcode || scope.row.sonBarcode === null
? scope.row.wjxh ? scope.row.wjxh
: scope.row.wjxh : scope.row.wjxh
}} }}
<div <div
v-show="scope.row.sonBarcode && scope.row.sonBarcode !== null&& scope.row.sonBarcode.length > 1" v-show="scope.row.sonBarcode && scope.row.sonBarcode !== null&& scope.row.sonBarcode.length > 1"
class="children-count" class="children-count"
> >
{{ scope.row.sonBarcode ? scope.row.sonBarcode.length : 0 }} {{ scope.row.sonBarcode ? scope.row.sonBarcode.length : 0 }}
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="nx" prop="nx"
label="内序" label="内序"
:width="fptxWidth3" :width="fptxWidth3"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="barcode" prop="barcode"
label="条码号" label="条码号"
> >
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-col> </el-col>
<el-col :span="2"> <el-col :span="2">
<div class="opSetting"> <div class="opSetting">
<div @click="handelSelect"> <div @click="handelSelect">
<el-button <el-button
icon="el-icon-arrow-right" icon="el-icon-arrow-right"
:disabled="nowSelectData.length?false:true" :disabled="nowSelectData.length?false:true"
:size="buttonSize" :size="buttonSize"
type="primary" type="primary"
> >
</el-button> </el-button>
</div> </div>
<div <div
class="spacing" class="spacing"
@click="handleRemoveSelect" @click="handleRemoveSelect"
> >
<el-button <el-button
icon="el-icon-arrow-left" icon="el-icon-arrow-left"
:disabled="nowSelectRightData.length?false:true" :disabled="nowSelectRightData.length?false:true"
:size="buttonSize" :size="buttonSize"
type="primary" type="primary"
> >
</el-button> </el-button>
</div> </div>
</div> </div>
</el-col> </el-col>
<el-col :span="11"> <el-col :span="11">
<div class="head"> <div class="head">
<div></div> <div></div>
需要导入的条码号 需要导入的条码号
</div> </div>
<el-table <el-table
height="550" height="550"
:data="selectArr" :data="selectArr"
style="width: 100%" style="width: 100%"
row-key="pid" row-key="pid"
:tree-props="{children: 'sonBarcode'}" :tree-props="{children: 'sonBarcode'}"
@selection-change="checkRightAll" @selection-change="checkRightAll"
@expand-change="hadnlExpandChange2" @expand-change="hadnlExpandChange2"
> >
<el-table-column <el-table-column
type="selection" type="selection"
:width="fptxWidth1" :width="fptxWidth1"
:selectable="checkSelectable" :selectable="checkSelectable"
> >
</el-table-column> </el-table-column>
<el-table-column <el-table-column
prop="wjxh" prop="wjxh"
:width="fptxWidth2" :width="fptxWidth2"
label="文件序号" label="文件序号"
> >
<template slot-scope="scope"> <template slot-scope="scope">
<svg-icon <svg-icon
style=" style="
width: 0.875rem; width: 0.875rem;
height: 0.6875rem; height: 0.6875rem;
margin-bottom: 0.125rem; margin-bottom: 0.125rem;
margin-left: 0.3125rem; margin-left: 0.3125rem;
margin-right:0.625rem; margin-right:0.625rem;
" "
v-if="scope.row.sonBarcode || scope.row.sonBarcode === null" v-if="scope.row.sonBarcode || scope.row.sonBarcode === null"
icon-class="tree_f" icon-class="tree_f"
> >
</svg-icon> </svg-icon>
<svg-icon <svg-icon
style=" style="
width: 0.8125rem; width: 0.8125rem;
height: 0.375rem; height: 0.375rem;
margin: 0 0 0.1875rem 0; margin: 0 0 0.1875rem 0;
" "
v-else-if="!scope.row.sonBarcode || scope.row.sonBarcode !== null" v-else-if="!scope.row.sonBarcode || scope.row.sonBarcode !== null"
icon-class="tree_c" icon-class="tree_c"
></svg-icon> ></svg-icon>
{{ {{
scope.row.sonBarcode || scope.row.sonBarcode === null scope.row.sonBarcode || scope.row.sonBarcode === null
? scope.row.wjxh ? scope.row.wjxh
: scope.row.wjxh : scope.row.wjxh
}} }}
<div <div
v-show="scope.row.sonBarcode && scope.row.sonBarcode !== null&& scope.row.sonBarcode.length > 1" v-show="scope.row.sonBarcode && scope.row.sonBarcode !== null&& scope.row.sonBarcode.length > 1"
class="children-count" class="children-count"
> >
{{ scope.row.sonBarcode ? scope.row.sonBarcode.length : 0 }} {{ scope.row.sonBarcode ? scope.row.sonBarcode.length : 0 }}
</div>
</template>
</el-table-column>
<el-table-column
prop="nx"
label="内序"
:width="fptxWidth3"
>
</el-table-column>
<el-table-column
prop="barcode"
label="条码号"
>
</el-table-column>
</el-table>
</el-col>
</div>
<div class="right">
<div class='target'>
<div class="targetHead">
{{targetHead}}
</div>
<div class="targetBody">
<el-checkbox-group v-model="checkedTargets">
<el-checkbox
v-for="(value,key) in targets"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
</div> </div>
</div> </template>
</el-table-column>
<el-table-column
prop="nx"
label="内序"
:width="fptxWidth3"
>
</el-table-column>
<el-table-column
prop="barcode"
label="条码号"
>
</el-table-column>
</el-table>
</el-col>
</div>
<div class="right">
<div class='target'>
<div class="targetHead">
{{targetHead}}
</div>
<div class="targetBody">
<el-checkbox-group v-model="checkedTargets">
<el-checkbox
v-for="(value,key) in targets"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
</div> </div>
<div </div>
class='bdbottom' </div>
v-show="this.drlx==9" <div
> class='bdbottom'
<div class="left"> v-show="this.drlx==9"
<el-col :span="11"> >
<div class="head"> <div class="left">
<div></div> <el-col :span="11">
FPTX的条码号 <div class="head">
</div> <div></div>
<el-table FPTX的条码号
height='550' </div>
:data="datas" <el-table
@selection-change="checkAll1" height='550'
style="width: 100%" :data="datas"
> @selection-change="checkAll1"
<el-table-column style="width: 100%"
type="selection" >
:width="fptxWidth1" <el-table-column
> type="selection"
</el-table-column> :width="fptxWidth1"
<el-table-column >
:width="fptxWidth2" </el-table-column>
label="文件名" <el-table-column
> :width="fptxWidth2"
<template slot-scope="scope"> label="文件名"
<div>{{scope.row.name}}</div> >
</template> <template slot-scope="scope">
</el-table-column> <div>{{scope.row.name}}</div>
<el-table-column </template>
:width="fptxWidth3" </el-table-column>
label="查询类型" <el-table-column
> :width="fptxWidth3"
<template slot-scope="scope"> label="查询类型"
<div >
v-if='scope.row.type==0' <template slot-scope="scope">
style="color: #fa9500;" <div
>{{scope.row.type | typeNum}} v-if='scope.row.type==0'
</div> style="color: #fa9500;"
<div >{{scope.row.type | typeNum}}
v-if='scope.row.type==1'
style="color: #e60012;"
>{{scope.row.type | typeNum}}
</div>
<div
v-if='scope.row.type==2'
style="color: #00b47a;"
>{{scope.row.type | typeNum}}
</div>
<div
v-if='scope.row.type==3'
style="color: #055fe7;"
>{{scope.row.type | typeNum}}
</div>
</template>
</el-table-column>
<el-table-column label="案事件编号/人员编号">
<template slot-scope="scope">
<div>{{scope.row.barcode1}}</div>
<div>{{scope.row.barcode2}}</div>
</template>
</el-table-column>
</el-table>
</el-col>
<el-col :span="2">
<div class="opSetting">
<div @click="handelSelect">
<el-button
icon="el-icon-arrow-right"
:disabled="nowSelectData.length?false:true"
:size="buttonSize"
type="primary"
>
</el-button>
</div>
<div
class="spacing"
@click="handleRemoveSelect"
>
<el-button
icon="el-icon-arrow-left"
:disabled="nowSelectRightData.length?false:true"
:size="buttonSize"
type="primary"
>
</el-button>
</div>
</div>
</el-col>
<el-col :span="11">
<div class="head">
<div></div>
需要导入的条码号
</div>
<el-table
height="550"
:data="selectArr"
@selection-change="checkRightAll"
style="width: 100%"
>
<el-table-column
type="selection"
:width="fptxWidth1"
>
</el-table-column>
<el-table-column
:width="fptxWidth2"
label="文件名"
>
<template slot-scope="scope">
<div>{{scope.row.name}}</div>
</template>
</el-table-column>
<el-table-column
:width="fptxWidth3"
label="查询类型"
>
<template slot-scope="scope">
<div
v-if='scope.row.type==0'
style="color: #fa9500;"
>{{scope.row.type | typeNum}}
</div>
<div
v-if='scope.row.type==1'
style="color: #e60012;"
>{{scope.row.type | typeNum}}
</div>
<div
v-if='scope.row.type==2'
style="color: #00b47a;"
>{{scope.row.type | typeNum}}
</div>
<div
v-if='scope.row.type==3'
style="color: #055fe7;"
>{{scope.row.type | typeNum}}
</div>
</template>
</el-table-column>
<el-table-column label="案事件编号/人员编号">
<template slot-scope="scope">
<div>{{scope.row.barcode1}}</div>
<div>{{scope.row.barcode2}}</div>
</template>
</el-table-column>
</el-table>
</el-col>
</div>
<div class="right">
<div class="head">
人员逻辑分库
<div></div>
案件逻辑分库
</div> </div>
<div class="bottom"> <div
<div class="targetLeft"> v-if='scope.row.type==1'
<el-checkbox-group v-model="checkedTargetsLeft"> style="color: #e60012;"
<el-checkbox >{{scope.row.type | typeNum}}
v-for="(value,key) in targetsLeft"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
<div class="line"></div>
<div class="targetRight">
<el-checkbox-group v-model="checkedTargetsRight">
<el-checkbox
v-for="(value,key) in targetsRight"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
</div> </div>
</div>
</div>
<el-dialog
style=" margin-top:10vh"
:visible.sync="dialogVisible"
width="30rem"
:modal-append-to-body="false"
:close-on-click-modal='false'
>
<div v-if="showProgress">
<el-progress
type="circle"
:percentage="UploadPercent"
></el-progress>
<div <div
v-show="UploadPercent<100" v-if='scope.row.type==2'
style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;" style="color: #00b47a;"
>正在上传指纹文件，点击“取消”可终止处理 >{{scope.row.type | typeNum}}
</div> </div>
<div <div
v-show="UploadPercent==100" v-if='scope.row.type==3'
style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;" style="color: #055fe7;"
>正在解析指纹文件，请稍等。。。 >{{scope.row.type | typeNum}}
</div> </div>
<el-button </template>
@click="abort" </el-table-column>
v-show="UploadPercent<100" <el-table-column label="案事件编号/人员编号">
><span style="color:#333;font-size: 14px;">取消</span></el-button> <template slot-scope="scope">
<el-button <div>{{scope.row.barcode1}}</div>
v-show="UploadPercent==100" <div>{{scope.row.barcode2}}</div>
disabled </template>
><span style="color:#333;font-size: 14px;">正在入库</span></el-button> </el-table-column>
</el-table>
</el-col>
<el-col :span="2">
<div class="opSetting">
<div @click="handelSelect">
<el-button
icon="el-icon-arrow-right"
:disabled="nowSelectData.length?false:true"
:size="buttonSize"
type="primary"
>
</el-button>
</div>
<div
class="spacing"
@click="handleRemoveSelect"
>
<el-button
icon="el-icon-arrow-left"
:disabled="nowSelectRightData.length?false:true"
:size="buttonSize"
type="primary"
>
</el-button>
</div> </div>
<div v-else> </div>
<div> </el-col>
<img
style="width: 8.375rem;height:8.375rem" <el-col :span="11">
src="../../assets/img/drFptx/success.svg" <div class="head">
alt="" <div></div>
> 需要导入的条码号
</div>
<el-table
height="550"
:data="selectArr"
@selection-change="checkRightAll"
style="width: 100%"
>
<el-table-column
type="selection"
:width="fptxWidth1"
>
</el-table-column>
<el-table-column
:width="fptxWidth2"
label="文件名"
>
<template slot-scope="scope">
<div>{{scope.row.name}}</div>
</template>
</el-table-column>
<el-table-column
:width="fptxWidth3"
label="查询类型"
>
<template slot-scope="scope">
<div
v-if='scope.row.type==0'
style="color: #fa9500;"
>{{scope.row.type | typeNum}}
</div> </div>
<div style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;"> <div
导入成功{{successCount}}条，失败{{failCount}}条 v-if='scope.row.type==1'
style="color: #e60012;"
>{{scope.row.type | typeNum}}
</div> </div>
<el-button <div
class='ckxq' v-if='scope.row.type==2'
style="background: #055FE7;border-radius: .25rem; border-color:#055FE7;" style="color: #00b47a;"
@click="goList" >{{scope.row.type | typeNum}}
><span style="color:#fff;font-size: 14px;">查看详情</span></el-button> </div>
</div> <div
</el-dialog> v-if='scope.row.type==3'
style="color: #055fe7;"
>{{scope.row.type | typeNum}}
</div>
</template>
</el-table-column>
<el-table-column label="案事件编号/人员编号">
<template slot-scope="scope">
<div>{{scope.row.barcode1}}</div>
<div>{{scope.row.barcode2}}</div>
</template>
</el-table-column>
</el-table>
</el-col>
</div>
<div class="right">
<div class="head">
人员逻辑分库
<div></div>
案件逻辑分库
</div>
<div class="bottom">
<div class="targetLeft">
<el-checkbox-group v-model="checkedTargetsLeft">
<el-checkbox
v-for="(value,key) in targetsLeft"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
<div class="line"></div>
<div class="targetRight">
<el-checkbox-group v-model="checkedTargetsRight">
<el-checkbox
v-for="(value,key) in targetsRight"
:key="key"
:label="value.code"
>{{ value.name }}
</el-checkbox>
</el-checkbox-group>
</div>
</div>
</div>
</div> </div>
<el-dialog
style=" margin-top:10vh"
:visible.sync="dialogVisible"
width="30rem"
:modal-append-to-body="false"
:close-on-click-modal='false'
>
<div v-if="showProgress">
<el-progress
type="circle"
:percentage="UploadPercent"
></el-progress>
<div
v-show="UploadPercent<100"
style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;"
>正在上传指纹文件，点击“取消”可终止处理
</div>
<div
v-show="UploadPercent==100"
style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;"
>正在解析指纹文件，请稍等。。。
</div>
<el-button
@click="abort"
v-show="UploadPercent<100"
><span style="color:#333;font-size: 14px;">取消</span></el-button>
<el-button
v-show="UploadPercent==100"
disabled
><span style="color:#333;font-size: 14px;">正在入库</span></el-button>
</div>
<div v-else>
<div>
<img
style="width: 8.375rem;height:8.375rem"
src="../../assets/img/drFptx/success.svg"
alt=""
>
</div>
<div style="margin-top:.9375rem; margin-bottom:.9375rem;font-size: .875rem;font-family: MicrosoftYaHei;color: #909090;">
导入成功{{successCount}}条，失败{{failCount}}条
</div>
<el-button
class='ckxq'
style="background: #055FE7;border-radius: .25rem; border-color:#055FE7;"
@click="goList"
><span style="color:#fff;font-size: 14px;">查看详情</span></el-button>
</div>
</el-dialog>
</div>
</template> </template>
...@@ -517,9 +517,9 @@ import axios from 'axios' ...@@ -517,9 +517,9 @@ import axios from 'axios'
export default { export default {
name: 'drFPTX', name: 'drFPTX',
components: {}, components: {},
mounted() { mounted () {
}, },
data() { data () {
return { return {
successCount: 0, // 成功条数 successCount: 0, // 成功条数
failCount: 0, // 失败条数 failCount: 0, // 失败条数
...@@ -569,7 +569,7 @@ export default { ...@@ -569,7 +569,7 @@ export default {
expandedRight: null, // 左边表格展开关闭标志 expandedRight: null, // 左边表格展开关闭标志
} }
}, },
created() { created () {
let w1 = 1920 let w1 = 1920
let w2 = window.innerWidth let w2 = window.innerWidth
...@@ -578,7 +578,7 @@ export default { ...@@ -578,7 +578,7 @@ export default {
this.fptxWidth3 = this.fptxWidth3 * w2 / w1 this.fptxWidth3 = this.fptxWidth3 * w2 / w1
}, },
watch: { watch: {
drlx(newValue, oldValue) { drlx (newValue, oldValue) {
if (newValue == 3) { if (newValue == 3) {
this.targetHead = '人员逻辑分库' this.targetHead = '人员逻辑分库'
this.targets = this.$store.state.ljk.targetOptions_ry this.targets = this.$store.state.ljk.targetOptions_ry
...@@ -626,7 +626,7 @@ export default { ...@@ -626,7 +626,7 @@ export default {
}, },
methods: { methods: {
// 展开或关闭行 // 展开或关闭行
hadnlExpandChange1(row, expanded) { hadnlExpandChange1 (row, expanded) {
// console.log(row, expanded, "zhankaiguanbi") // console.log(row, expanded, "zhankaiguanbi")
// 获取下标 // 获取下标
var i = this.datas.findIndex((table) => table.wjxh === row.wjxh) var i = this.datas.findIndex((table) => table.wjxh === row.wjxh)
...@@ -666,7 +666,7 @@ export default { ...@@ -666,7 +666,7 @@ export default {
} }
}, },
// 展开或关闭行 // 展开或关闭行
hadnlExpandChange2(row, expanded) { hadnlExpandChange2 (row, expanded) {
// console.log(row, expanded, "zhankaiguanbi") // console.log(row, expanded, "zhankaiguanbi")
// 获取下标 // 获取下标
var i = this.selectArr.findIndex((table) => table.wjxh === row.wjxh) var i = this.selectArr.findIndex((table) => table.wjxh === row.wjxh)
...@@ -706,11 +706,11 @@ export default { ...@@ -706,11 +706,11 @@ export default {
} }
}, },
// 判断能不能选择 // 判断能不能选择
checkSelectable(row) { checkSelectable (row) {
return row.sonBarcode return row.sonBarcode
}, },
// 导入成功,跳转详情 // 导入成功,跳转详情
goList() { goList () {
if (this.drlx == 3) { if (this.drlx == 3) {
this.dialogVisible = false this.dialogVisible = false
...@@ -764,10 +764,11 @@ export default { ...@@ -764,10 +764,11 @@ export default {
} }
}, },
// 取消上传 // 取消上传
abort() { abort () {
this.nowSelectRightData = [] this.nowSelectRightData = []
this.dialogVisible = false this.dialogVisible = false
// this.cancel() // this.cancel()
this.UploadPercent = 0
fHttp.cancel() fHttp.cancel()
// this.$refs.upload.clearFiles(); // 清空上传列表 // this.$refs.upload.clearFiles(); // 清空上传列表
...@@ -775,23 +776,12 @@ export default { ...@@ -775,23 +776,12 @@ export default {
}, },
// 上传进度 // 上传进度
uploadProcess(event, file, fileList) { uploadProcess (event, file, fileList) {
// //console.log(event)
this.dialogVisible = true this.dialogVisible = true
// this.UploadPercent = Number(file.percentage.toFixed(0));
// this.UploadPercent = Number(event.percent.toFixed())
// if (this.UploadPercent == 99) {
// // this.dialogVisible = false;
// // this.$refs.upload.clearFiles()
// // this.nowSelectRightData = []
// // this.showProgress = false;
// return
// }
}, },
// 获取文件列表 // 获取文件列表
onChange(file, fileList) { onChange (file, fileList) {
// console.log(file.raw, 2222233333) // console.log(file.raw, 2222233333)
// 重复文件过滤 // 重复文件过滤
let existFile = fileList.slice(0, fileList.length - 1).find(f => f.name === file.name) let existFile = fileList.slice(0, fileList.length - 1).find(f => f.name === file.name)
if (existFile) { if (existFile) {
...@@ -1014,10 +1004,10 @@ export default { ...@@ -1014,10 +1004,10 @@ export default {
}, 100) }, 100)
}, },
// 提交前钩子函数 // 提交前钩子函数
beforeUpload() { beforeUpload () {
// //console.log('数据liebiao', this.$refs.upload.uploadFiles) // //console.log('数据liebiao', this.$refs.upload.uploadFiles)
}, },
submitUpload() { submitUpload () {
if (this.nowSelectRightData.length == 0) { if (this.nowSelectRightData.length == 0) {
this.$message.error('请选择要上传的文件') this.$message.error('请选择要上传的文件')
} else { } else {
...@@ -1042,7 +1032,7 @@ export default { ...@@ -1042,7 +1032,7 @@ export default {
}, },
// 上传文件函数 // 上传文件函数
upload() { upload () {
let that = this let that = this
// 创建一个空的FormData对象: // 创建一个空的FormData对象:
const formData = new FormData() const formData = new FormData()
...@@ -1060,144 +1050,53 @@ export default { ...@@ -1060,144 +1050,53 @@ export default {
this.dialogVisible = true this.dialogVisible = true
NetUtil.drFptx.upload(formData, this.drlx, (progressEvent) => { NetUtil.drFptx.upload(formData, this.drlx, (progressEvent) => {
logger.info('11111111111') logger.info('11111111111')
}).then() that.UploadPercent = Number((((progressEvent.loaded / 10 * 10) / progressEvent.total) * 100).toFixed(2))
}).then(res => {
if (res.code === 0) {
if (this.drlx == 3 || this.drlx == 6) {
this.successCount = res.ret.successCount
this.failCount = res.ret.failCount
this.showProgress = false;
this.checkedTargets = ['1']
this.selectArr = [] // 右边列表
this.datas = []// 左边表格数据项
this.nowSelectData = [] // 左边选中列表数据
this.nowSelectRightData = [] // 右边选中列表数据
this.UploadPercent = 0
} else if (this.drlx == 9) {
this.successCount = res.ret.successCount
this.failCount = res.ret.failCount
this.showProgress = false;
this.selectArr = [] // 右边列表
this.datas = []// 左边表格数据项
this.nowSelectData = [] // 左边选中列表数据
this.nowSelectRightData = [] // 右边选中列表数据
this.checkedTargetsLeft = ['1'] // 选定逻辑库
this.checkedTargetsRight = ['1'] // 选定逻辑库
this.UploadPercent = 0
}
// this.$refs.upload.clearFiles()
this.showProgress = false;
} else {
this.$message.error(res.data.message);
this.dialogVisible = false// 进度条弹窗
this.UploadPercent = 0
}
})
}, },
// 上传文件函数
// upload () {
// let that = this
// // 创建一个空的FormData对象:
// const formData = new FormData()
// // 可以使用FormData.append来添加键/值对到表单里面；
// this.nowSelectRightData.forEach((file) => {
// formData.append('file', file.raw)
// })
// // 添加自定义参数，不传可删除
// if (this.drlx == 3 || this.drlx == 6) {
// formData.append('logicList', this.logicList)
// } else if (this.drlx == 9) {
// formData.append('logicPsnList', this.logicPsnList)
// formData.append('logicCaseList', this.logicCaseList)
// }
// this.dialogVisible = true;
// // this.$axios({
// // method: 'post',
// // url: this.action,
// // data: formData,
// // loading: false,
// // onUploadProgress: function (progressEvent) {
// // // this.dialogVisible = true;
// // //console.log(progressEvent, 1);
// // that.UploadPercent = Number((((progressEvent.loaded / 10 * 9.9) / progressEvent.total) * 100).toFixed(2))
// // //console.log(that.UploadPercent, 123)
// // // Number(event.percent.toFixed())
// // },
// // }).then(res => {
// // if (res.data.code === 0) {
// // if (this.drlx == 3 || this.drlx == 6) {
// // this.successCount = res.data.ret.successCount
// // this.failCount = res.data.ret.failCount
// // this.showProgress = false;
// // this.selectArr = [] // 右边列表
// // this.datas = []// 左边表格数据项
// // this.nowSelectData = [] // 左边选中列表数据
// // this.nowSelectRightData = [] // 右边选中列表数据
// // this.logicList = [] // 目标逻辑库
// // this.UploadPercent = 0
// // } else if (this.drlx == 9) {
// // this.successCount = res.data.ret.successCount
// // this.failCount = res.data.ret.failCount
// // this.showProgress = false;
// // this.selectArr = [] // 右边列表
// // this.datas = []// 左边表格数据项
// // this.nowSelectData = [] // 左边选中列表数据
// // this.nowSelectRightData = [] // 右边选中列表数据
// // this.UploadPercent = 0
// // }
// // // this.$refs.upload.clearFiles()
// // this.showProgress = false;
// // } else {
// // this.$message.error(res.data.message);
// // this.dialogVisible = false// 进度条弹窗
// // this.UploadPercent = 0
// // }
// // });
// let CancelToken = axios.CancelToken
// let self = this
// axios({
// method: 'post',
// url: this.action,
// data: formData,
// loading: false,
// cancelToken: new CancelToken(function executor (c) {
// self.cancel = c
// console.log(c)
// // 这个参数 c 就是CancelToken构造函数里面自带的取消请求的函数，这里把该函数当参数用
// }),
// headers: {
// Authorization: localStorage.getItem("token"),
// BrowserHeader: 'H5'
// },
// onUploadProgress: function (progressEvent) {
// that.UploadPercent = Number((((progressEvent.loaded / 10 * 10) / progressEvent.total) * 100).toFixed(2))
// },
// }).then(res => {
// if (res.code === 0) {
// if (this.drlx == 3 || this.drlx == 6) {
// this.successCount = res.ret.successCount
// this.failCount = res.ret.failCount
// this.showProgress = false;
// this.checkedTargets = ['1']
// this.selectArr = [] // 右边列表
// this.datas = []// 左边表格数据项
// this.nowSelectData = [] // 左边选中列表数据
// this.nowSelectRightData = [] // 右边选中列表数据
// this.UploadPercent = 0
// } else if (this.drlx == 9) {
// this.successCount = res.ret.successCount
// this.failCount = res.ret.failCount
// this.showProgress = false;
// this.selectArr = [] // 右边列表
// this.datas = []// 左边表格数据项
// this.nowSelectData = [] // 左边选中列表数据
// this.nowSelectRightData = [] // 右边选中列表数据
// this.checkedTargetsLeft = ['1'] // 选定逻辑库
// this.checkedTargetsRight = ['1'] // 选定逻辑库
// this.UploadPercent = 0
// }
// // this.$refs.upload.clearFiles()
// this.showProgress = false;
// } else {
// this.$message.error(res.data.message);
// this.dialogVisible = false// 进度条弹窗
// this.UploadPercent = 0
// }
// });
// //手速够快就不用写这个定时器了，点击取消获取就可以看到效果了
// // setTimeout(function () {
// // //只要我们去调用了这个cancel()方法，没有完成请求的接口便会停止请求
// // self.cancel()
// // }, 1000)
// },
// 删除文件 // 删除文件
handleRemove(file, fileList) { handleRemove (file, fileList) {
//console.log(file, fileList); //console.log(file, fileList);
}, },
// 点击文件列表 // 点击文件列表
handlePreview(file) { handlePreview (file) {
//console.log('上传文件', file); //console.log('上传文件', file);
}, },
// 上传成功 // 上传成功
uploadSuccess(res) { uploadSuccess (res) {
if (this.drlx == 3 || this.drlx == 6) { if (this.drlx == 3 || this.drlx == 6) {
this.successCount = res.ret.successCount this.successCount = res.ret.successCount
this.failCount = res.ret.failCount this.failCount = res.ret.failCount
...@@ -1209,14 +1108,14 @@ export default { ...@@ -1209,14 +1108,14 @@ export default {
this.showProgress = false this.showProgress = false
}, },
// 选择上传文件 // 选择上传文件
uploadFile() { uploadFile () {
// this.$refs.file.dispatchEvent(new MouseEvent("click")); // this.$refs.file.dispatchEvent(new MouseEvent("click"));
this.$refs['upload'].$children[0].$refs.input.webkitdirectory = false this.$refs['upload'].$children[0].$refs.input.webkitdirectory = false
this.$refs['upload'].$children[0].$refs.input.accept = '.fptx' this.$refs['upload'].$children[0].$refs.input.accept = '.fptx'
this.$refs['upload'].$children[0].$refs.input.click() this.$refs['upload'].$children[0].$refs.input.click()
}, },
// 上传文件夹 // 上传文件夹
uploadFiles() { uploadFiles () {
// //console.log(this.$refs['upload'].$children[0].$refs.input) // //console.log(this.$refs['upload'].$children[0].$refs.input)
this.$refs['upload'].$children[0].$refs.input.webkitdirectory = true this.$refs['upload'].$children[0].$refs.input.webkitdirectory = true
this.$refs['upload'].$children[0].$refs.input.accept = '.fptx' this.$refs['upload'].$children[0].$refs.input.accept = '.fptx'
...@@ -1230,15 +1129,15 @@ export default { ...@@ -1230,15 +1129,15 @@ export default {
//console.log(fileDic, 111222) //console.log(fileDic, 111222)
}, },
// 表格穿梭框 // 表格穿梭框
checkAll1(val) { checkAll1 (val) {
this.nowSelectData = val this.nowSelectData = val
}, },
checkRightAll(val) { checkRightAll (val) {
// //console.log('val111', val) // //console.log('val111', val)
this.nowSelectRightData = val this.nowSelectRightData = val
}, },
// 选中 // 选中
handelSelect() { handelSelect () {
// let self = this // let self = this
...@@ -1270,17 +1169,17 @@ export default { ...@@ -1270,17 +1169,17 @@ export default {
this.nowSelectData = [] this.nowSelectData = []
}, },
// 取消 // 取消
handleRemoveSelect() { handleRemoveSelect () {
this.datas = this.handleConcatArr(this.datas, this.nowSelectRightData) this.datas = this.handleConcatArr(this.datas, this.nowSelectRightData)
this.handleRemoveTabList(this.nowSelectRightData, this.selectArr) this.handleRemoveTabList(this.nowSelectRightData, this.selectArr)
this.nowSelectRightData = [] this.nowSelectRightData = []
}, },
handleConcatArr(selectArr, nowSelectData) { handleConcatArr (selectArr, nowSelectData) {
let arr = [] let arr = []
arr = arr.concat(selectArr, nowSelectData) arr = arr.concat(selectArr, nowSelectData)
return arr return arr
}, },
handleRemoveTabList(isNeedArr, originalArr) { handleRemoveTabList (isNeedArr, originalArr) {
if (isNeedArr.length && originalArr.length) { if (isNeedArr.length && originalArr.length) {
for (let i = 0; i < isNeedArr.length; i++) { for (let i = 0; i < isNeedArr.length; i++) {
for (let k = 0; k < originalArr.length; k++) { for (let k = 0; k < originalArr.length; k++) {
...@@ -1293,7 +1192,7 @@ export default { ...@@ -1293,7 +1192,7 @@ export default {
} }
}, },
filters: { filters: {
typeNum(val) { typeNum (val) {
//console.log(val); //console.log(val);
// if (!val) return; // if (!val) return;
const data = { const data = {
...@@ -1306,7 +1205,7 @@ export default { ...@@ -1306,7 +1205,7 @@ export default {
} }
}, },
computed: { computed: {
roleArr() { roleArr () {
return this.$store.state.layout.Menu return this.$store.state.layout.Menu
} }
}, },
...@@ -1315,563 +1214,563 @@ export default { ...@@ -1315,563 +1214,563 @@ export default {
<!--table树--> <!--table树-->
<style scoped lang="scss"> <style scoped lang="scss">
/deep/ .children-count { /deep/ .children-count {
width: 34px; width: 34px;
font-size: 12px; font-size: 12px;
text-align: center; text-align: center;
background: #f6f8fa; background: #f6f8fa;
border-radius: 11px; border-radius: 11px;
position: absolute; position: absolute;
right: 10px; right: 10px;
top: 50%; top: 50%;
transform: translate(0, -50%); transform: translate(0, -50%);
} }
.el-tree /deep/ .el-tree-node__expand-icon.expanded { .el-tree /deep/ .el-tree-node__expand-icon.expanded {
-webkit-transform: rotate(0deg); -webkit-transform: rotate(0deg);
transform: rotate(0deg); transform: rotate(0deg);
} }
/*有子节点 且未展开*/ /*有子节点 且未展开*/
.el-table /deep/ .el-icon-arrow-right:before { .el-table /deep/ .el-icon-arrow-right:before {
content: ""; content: "";
display: block; display: block;
width: 16px; width: 16px;
height: 16px; height: 16px;
font-size: 16px; font-size: 16px;
background-size: 16px; background-size: 16px;
} }
/*有子节点 且已展开*/ /*有子节点 且已展开*/
.el-table /deep/ .el-table__expand-icon--expanded { .el-table /deep/ .el-table__expand-icon--expanded {
.el-icon-arrow-right:before { .el-icon-arrow-right:before {
content: ""; content: "";
display: block; display: block;
width: 15px; width: 15px;
height: 20px; height: 20px;
font-size: 18px; font-size: 18px;
background-size: 21px; background-size: 21px;
} }
} }
/*没有子节点*/ /*没有子节点*/
.el-tree .el-tree
/deep/ /deep/
.el-tree-node__expand-icon.is-leaf::before .el-tree-node__expand-icon.is-leaf::before
.el-table .el-table
/deep/ /deep/
.el-table__placeholder::before { .el-table__placeholder::before {
// background: url("../../icons/tree_f.svg") no-repeat 0 3px; // background: url("../../icons/tree_f.svg") no-repeat 0 3px;
content: ""; content: "";
display: block; display: block;
width: 16px; width: 16px;
height: 18px; height: 18px;
font-size: 16px; font-size: 16px;
background-size: 16px; background-size: 16px;
} }
/deep/ .el-table--enable-row-hover .el-table__body tr:hover { /deep/ .el-table--enable-row-hover .el-table__body tr:hover {
cursor: pointer; cursor: pointer;
} }
</style> </style>
<style lang="scss"> <style lang="scss">
.el-table__expand-icon { .el-table__expand-icon {
.el-icon-arrow-right { .el-icon-arrow-right {
cursor: pointer !important; cursor: pointer !important;
} }
cursor: pointer !important; cursor: pointer !important;
position: absolute; position: absolute;
right: 45px; right: 45px;
cursor: pointer; cursor: pointer;
color: #b51f1f; color: #b51f1f;
transition: transform 0.2s ease-in-out; transition: transform 0.2s ease-in-out;
width: 11px; width: 11px;
height: 11px; height: 11px;
/* border: black 1px solid; */ /* border: black 1px solid; */
margin: 0; margin: 0;
background-image: url("../../assets/img/confirm/expend.png"); background-image: url("../../assets/img/confirm/expend.png");
background-position: center; background-position: center;
background-size: 11px; background-size: 11px;
background-repeat: no-repeat; background-repeat: no-repeat;
} }
.el-table__expand-icon.el-table__expand-icon--expanded { .el-table__expand-icon.el-table__expand-icon--expanded {
width: 11px; width: 11px;
height: 11px; height: 11px;
background-image: url("../../assets/img/confirm/shrink.png"); background-image: url("../../assets/img/confirm/shrink.png");
background-position: center; background-position: center;
background-size: 11px; background-size: 11px;
background-repeat: no-repeat; background-repeat: no-repeat;
transform: rotate(180deg) !important; transform: rotate(180deg) !important;
} }
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
// /deep/.el-dialog__wrapper { // /deep/.el-dialog__wrapper {
// background: rgba($color: #fff, $alpha: 0.65); // background: rgba($color: #fff, $alpha: 0.65);
// // filter: blur(2px); // // filter: blur(2px);
// } // }
/deep/ .el-dialog { /deep/ .el-dialog {
margin-top: 30vh; margin-top: 30vh;
.el-button { .el-button {
width: 96px; width: 96px;
height: 40px; height: 40px;
} }
/deep/ .el-button:focus,
.el-button:hover {
color: #055fe7;
}
}
/deep/ .el-button:focus, /deep/ .el-dialog__header {
.el-button:hover { display: none;
color: #055fe7; }
}
}
/deep/ .el-dialog__header { /deep/ .el-dialog__body {
display: none; text-align: center;
} }
/deep/ .el-dialog__body { /deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
text-align: center; .el-checkbox__input.is-indeterminate .el-checkbox__inner {
} background-color: #055fe7;
border-color: #055fe7;
}
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner, /deep/ .el-checkbox__input.is-checked .el-checkbox__inner,
.el-checkbox__input.is-indeterminate .el-checkbox__inner { /deep/ .el-checkbox__input.is-indeterminate .el-checkbox__inner {
background-color: #055fe7; background-color: #055fe7;
border-color: #055fe7; border-color: #055fe7;
} }
/deep/ .el-checkbox__input.is-checked .el-checkbox__inner, /deep/ .el-checkbox__input.is-checked + .el-checkbox__label {
/deep/ .el-checkbox__input.is-indeterminate .el-checkbox__inner { color: #333333;
background-color: #055fe7; }
border-color: #055fe7;
}
/deep/ .el-checkbox__input.is-checked + .el-checkbox__label { /deep/ .el-table.el-table--fit.el-table--enable-row-hover {
color: #333333; height: 501px !important;
} }
/deep/ .el-table.el-table--fit.el-table--enable-row-hover { /deep/ .el-table__body-wrapper.is-scrolling-none {
height: 501px !important; height: 499px !important;
} }
/deep/ .el-table__body-wrapper.is-scrolling-none { .drFPTX {
height: 499px !important; padding: 25px;
} }
.drFPTX { .drlx .el-radio {
padding: 25px; width: 86px;
} height: 32px;
line-height: 32px;
background: #f6f8fa;
border-radius: 2px;
text-align: center;
font-size: 14px;
font-family: MicrosoftYaHei;
margin-right: 25px;
color: #282f3c;
/deep/ .el-radio__label {
padding: 0;
}
/deep/ .el-radio__input.is-checked + .el-radio__label {
color: #055fe7;
}
}
.drlx .el-radio { /deep/ .drlx .is-checked {
width: 86px; background: #ddebff;
height: 32px; }
line-height: 32px;
background: #f6f8fa;
border-radius: 2px;
text-align: center;
font-size: 14px;
font-family: MicrosoftYaHei;
margin-right: 25px;
color: #282f3c;
/deep/ .el-radio__label { .drlx /deep/ .el-radio__input {
padding: 0; display: none;
} }
/deep/ .el-radio__input.is-checked + .el-radio__label { .choose {
color: #055fe7; width: 100%;
} display: flex;
justify-content: space-between;
align-items: flex-end;
.wjlx {
display: flex;
width: 609px;
height: 72px;
background: #f6f8fa;
border-radius: 6px;
margin-top: 24px;
}
.left {
width: 242px;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
/deep/ .el-radio {
margin-right: 15px;
} }
/deep/ .drlx .is-checked { /deep/ .el-radio__input.is-checked .el-radio__inner {
background: #ddebff; border-color: #055fe7;
background: #055fe7;
} }
.drlx /deep/ .el-radio__input { /deep/ .el-radio__input.is-checked + .el-radio__label {
display: none; color: #333;
} }
}
.choose {
width: 100%; .right {
display: flex; display: flex;
justify-content: space-between; justify-content: center;
align-items: flex-end; align-items: center;
.wjlx { .center {
display: flex; display: flex;
width: 609px; align-items: center;
height: 72px; width: 343px;
background: #f6f8fa; // height: 40px;
border-radius: 6px; background: #ffffff;
margin-top: 24px; border-radius: 4px;
border: 1px solid #e6e6e8;
/deep/ .el-input {
width: 282px;
height: 40px;
.el-input__inner {
border: none;
outline: none;
} }
}
.left { .line {
width: 242px; width: 1px;
height: 100%; height: 14px;
display: flex; background-color: #e6e6e8;
justify-content: center; margin-right: 14px;
align-items: center; }
/deep/ .el-radio { .text {
margin-right: 15px; font-size: 14px;
} font-family: MicrosoftYaHei;
color: #006aff;
}
}
}
.el-button {
width: 72px;
height: 32px;
background: #055fe7;
border-color: #055fe7;
border-radius: 4px;
padding: 0;
}
}
/deep/ .el-radio__input.is-checked .el-radio__inner { .divider {
border-color: #055fe7; width: 100%;
background: #055fe7; height: 1px;
} background: #eeeeee;
margin: 20px 0;
}
/deep/ .el-radio__input.is-checked + .el-radio__label { .bottom {
color: #333; display: flex;
}
}
.right { .left {
display: flex; display: flex;
justify-content: center; height: 560px;
align-items: center; width: 1392px;
.center {
display: flex;
align-items: center;
width: 343px;
// height: 40px;
background: #ffffff;
border-radius: 4px;
border: 1px solid #e6e6e8;
/deep/ .el-input {
width: 282px;
height: 40px;
.el-input__inner {
border: none;
outline: none;
}
}
.line { .el-col {
width: 1px; .el-table {
height: 14px; height: 550px;
background-color: #e6e6e8; }
margin-right: 14px;
}
.text { .head {
font-size: 14px; height: 56px;
font-family: MicrosoftYaHei; width: 100%;
color: #006aff; background: #f0f3f6;
} border-radius: 7px 7px 0px 0px;
} display: flex;
} align-items: center;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
.el-button { div {
width: 72px; width: 4px;
height: 32px; height: 16px;
background: #055fe7; background: #055fe7;
border-color: #055fe7; border-radius: 2px;
border-radius: 4px; margin-left: 10px;
padding: 0; margin-right: 6px;
} }
}
/deep/ .el-table tr th {
background-color: #f6f8fa;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #282f3c;
font-weight: 500;
}
} }
.divider { .el-col-11 {
width: 100%; background: #ffffff;
height: 1px; border-radius: 6px;
background: #eeeeee; border: 1px solid #d1d1d1;
margin: 20px 0;
} }
.bottom { .opSetting {
display: flex; text-align: center;
margin-top: 230px;
.left { button {
display: flex; width: 56px;
height: 560px; height: 56px;
width: 1392px; background: #f6f8fa;
border-radius: 10px;
.el-col { color: #333333;
.el-table { border: none;
height: 550px; }
}
.head { button:hover {
height: 56px; background-color: #055fe7;
width: 100%; color: #ffffff;
background: #f0f3f6; }
border-radius: 7px 7px 0px 0px; }
display: flex;
align-items: center;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
div {
width: 4px;
height: 16px;
background: #055fe7;
border-radius: 2px;
margin-left: 10px;
margin-right: 6px;
}
}
/deep/ .el-table tr th { .spacing {
background-color: #f6f8fa; margin-top: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #282f3c;
font-weight: 500;
}
}
.el-col-11 { button {
background: #ffffff; width: 56px;
border-radius: 6px; height: 56px;
border: 1px solid #d1d1d1; background: #f6f8fa;
} border-radius: 10px;
color: #333333;
border-color: #f6f8fa;
}
.opSetting { button:hover {
text-align: center; background-color: #055fe7;
margin-top: 230px; color: #ffffff;
}
}
}
.right {
height: 560px;
width: 161px;
.target {
margin: 0 auto;
width: 137px;
height: 560px;
border-radius: 6px;
border: 1px solid #d1d1d1;
.targetHead {
width: 135px;
height: 56px;
background: #f0f3f6;
border-radius: 6px 6px 0px 0px;
line-height: 56px;
text-align: center;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #333333;
}
button { .targetBody {
width: 56px; overflow: hidden;
height: 56px; padding-top: 16px;
background: #f6f8fa; padding-left: 15px;
border-radius: 10px;
/deep/ .el-checkbox {
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #666666;
line-height: 22px;
margin: 5px 0;
}
}
}
}
}
color: #333333; .bdbottom {
border: none; display: flex;
}
button:hover { .left {
background-color: #055fe7; display: flex;
color: #ffffff; height: 560px;
} width: 1240px;
} margin-right: 14px;
.spacing { .el-col {
margin-top: 22px; .el-table {
height: 550px;
}
button { .head {
width: 56px; height: 56px;
height: 56px; width: 100%;
background: #f6f8fa; background: #f0f3f6;
border-radius: 10px; border-radius: 7px 7px 0px 0px;
color: #333333; display: flex;
border-color: #f6f8fa; align-items: center;
} font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
button:hover { div {
background-color: #055fe7; width: 4px;
color: #ffffff; height: 16px;
} background: #055fe7;
} border-radius: 2px;
margin-left: 10px;
margin-right: 6px;
} }
}
.right { /deep/ .el-table tr th {
height: 560px; background-color: #f6f8fa;
width: 161px; font-size: 14px;
font-family: MicrosoftYaHei;
.target { color: #282f3c;
margin: 0 auto; font-weight: 500;
width: 137px; }
height: 560px;
border-radius: 6px;
border: 1px solid #d1d1d1;
.targetHead {
width: 135px;
height: 56px;
background: #f0f3f6;
border-radius: 6px 6px 0px 0px;
line-height: 56px;
text-align: center;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #333333;
}
.targetBody {
overflow: hidden;
padding-top: 16px;
padding-left: 15px;
/deep/ .el-checkbox {
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #666666;
line-height: 22px;
margin: 5px 0;
}
}
}
}
} }
.bdbottom { .el-col-11 {
display: flex; background: #ffffff;
border-radius: 6px;
.left { border: 1px solid #d1d1d1;
display: flex; }
height: 560px;
width: 1240px;
margin-right: 14px;
.el-col {
.el-table {
height: 550px;
}
.head { .opSetting {
height: 56px; text-align: center;
width: 100%; margin-top: 230px;
background: #f0f3f6;
border-radius: 7px 7px 0px 0px;
display: flex;
align-items: center;
font-size: 16px;
font-family: MicrosoftYaHei;
color: #282f3c;
div {
width: 4px;
height: 16px;
background: #055fe7;
border-radius: 2px;
margin-left: 10px;
margin-right: 6px;
}
}
/deep/ .el-table tr th { button {
background-color: #f6f8fa; width: 56px;
font-size: 14px; height: 56px;
font-family: MicrosoftYaHei; background: #f6f8fa;
color: #282f3c; border-radius: 10px;
font-weight: 500; color: #333333;
} border: none;
} }
.el-col-11 {
background: #ffffff;
border-radius: 6px;
border: 1px solid #d1d1d1;
}
.opSetting { button:hover {
text-align: center; background-color: #055fe7;
margin-top: 230px; color: #ffffff;
}
button { }
width: 56px;
height: 56px;
background: #f6f8fa;
border-radius: 10px;
color: #333333;
border: none;
}
button:hover { .spacing {
background-color: #055fe7; margin-top: 22px;
color: #ffffff;
}
}
.spacing { button {
margin-top: 22px; width: 56px;
height: 56px;
background: #f6f8fa;
border-radius: 10px;
color: #333333;
border-color: #f6f8fa;
}
button { button:hover {
width: 56px; background-color: #055fe7;
height: 56px; color: #ffffff;
background: #f6f8fa; }
border-radius: 10px; }
color: #333333; }
border-color: #f6f8fa;
} .right {
height: 560px;
width: 284px;
.head {
display: flex;
justify-content: space-around;
align-items: center;
width: 100%;
height: 55px;
padding: 0 10px;
box-sizing: border-box;
background: #f0f3f6;
border: 1px solid #d1d1d1;
border-bottom: none;
border-radius: 6px 6px 0px 0px;
div {
width: 1px;
height: 30px;
background: #bfd1eb;
}
}
button:hover { .bottom {
background-color: #055fe7; width: 284px;
color: #ffffff; height: 500px;
} display: flex;
} border-radius: 0 0 6px 6px;
border: 1px solid #d1d1d1;
box-sizing: border-box;
border-top: none;
.targetLeft {
flex: 1;
padding-top: 16px;
padding-left: 20px;
/deep/ .el-checkbox {
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #666666;
line-height: 22px;
margin: 5px 0;
overflow: hidden;
} }
}
.right { .line {
height: 560px; margin-top: 30px;
width: 284px; width: 1px;
height: 440px;
.head { border: 1px dashed #eeeeee;
display: flex; }
justify-content: space-around;
align-items: center;
width: 100%;
height: 55px;
padding: 0 10px;
box-sizing: border-box;
background: #f0f3f6;
border: 1px solid #d1d1d1;
border-bottom: none;
border-radius: 6px 6px 0px 0px;
div {
width: 1px;
height: 30px;
background: #bfd1eb;
}
}
.bottom {
width: 284px;
height: 500px;
display: flex;
border-radius: 0 0 6px 6px;
border: 1px solid #d1d1d1;
box-sizing: border-box;
border-top: none;
.targetLeft {
flex: 1;
padding-top: 16px;
padding-left: 20px;
/deep/ .el-checkbox {
height: 22px;
font-size: 14px;
font-family: MicrosoftYaHei;
color: #666666;
line-height: 22px;
margin: 5px 0;
overflow: hidden;
}
}
.line {
margin-top: 30px;
width: 1px;
height: 440px;
border: 1px dashed #eeeeee;
}
.targetRight { .targetRight {
flex: 1; flex: 1;
padding-top: 16px; padding-top: 16px;
padding-left: 20px; padding-left: 20px;
/deep/ .el-checkbox { /deep/ .el-checkbox {
height: 22px; height: 22px;
font-size: 14px; font-size: 14px;
font-family: MicrosoftYaHei; font-family: MicrosoftYaHei;
color: #666666; color: #666666;
line-height: 22px; line-height: 22px;
margin: 5px 0; margin: 5px 0;
overflow: hidden; overflow: hidden;
}
}
}
} }
}
} }
}
}
</style> </style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment