一、页面构图部分
![](https://i-blog.csdnimg.cn/blog_migrate/3e9c14b9ed6ed18339489a7c0ce631fc.png)
<div style="display: flex">
<el-card class="dialogCardLeft">
<div slot="header">
<span> 待选运营位</span>
<el-input
placeholder="输入运营位名称"
v-model="dialogCardLeftInputData"
class="dialogCardLeftInput"
>
<img
slot="suffix"
src="../../assets/u8351.png"
class="InputSearchImg"
/>
</el-input>
</div>
<el-table
:data="OperationPositionData"
@selection-change="OperationPositionalSelectionChange"
@select="handleSelectTable"
@select-all="handleSelectTableAll"
@row-click="handleRowClick"
:row-class-name="tableRowClassNameMySelf"
style="width: 100%"
ref="OperationPositionTable"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column
label="序号"
type="index"
:index="indexMethod"
width="50"
>
</el-table-column>
<el-table-column prop="sms" label="运营位编码"> </el-table-column>
<el-table-column prop="name" label="运营位名称"> </el-table-column>
<el-table-column prop="position" label="归属渠道">
</el-table-column>
</el-table>
</el-card>
<div class="OperationPositionButtonFather">
<button
class="OperationPositionButton button-blue"
@click="giveDataToAlreadyTable"
:disabled="ChangeStatusButton.length == 0 ? 'true' : undefined"
>
>>
</button>
<button
class="OperationPositionButton button-red"
@click="giveDataToBeTable"
:disabled="ChangeStatusRedButton.length == 0 ? 'true' : undefined"
>
<<
</button>
</div>
<el-card class="dialogCardRight">
<div slot="header">
<span> 已选运营位</span>
</div>
<el-table
@selection-change="OperationPositionalAlreadySelectionChange"
:data="OperationPositionAlreadySelectData"
style="width: 100%&