element框架在html中让el-switch选择开关的文字显示在里面

我想实现的效果：

实现代码如下：

<style>
.switchStyle .el-switch__label {
  position: absolute!important;
  display: none!important;
  color: #fff!important;
}
.switchStyle .el-switch__label--left {
  z-index: 9!important;
  left: 6px!important;
}
.switchStyle .el-switch__label--right {
  z-index: 9!important;
  left: -14px!important;
}
.switchStyle .el-switch__label.is-active {
  display: block!important;
}
.switchStyle.el-switch .el-switch__core,
.el-switch .el-switch__label {
  width: 60px !important;
}
</style>
<el-table-column prop="new" label="新服标识" align="center">
	<template slot-scope="scope">
		<el-switch
		    class="switchStyle"
		    active-value="1"
		    inactive-value="0"
		    v-model="scope.row.status"
		    active-text="新区"
		    inactive-text="老区"
		    active-color="#409eff"
		    inactive-color="#DCDFE6">
		</el-switch>
	</template>
</el-table-column>