前台

选择
          <el-col :span="12" class="mb20">
                    <el-form-item label="性别" prop="sex">
                        <el-select v-model="form.sex" placeholder="请选择性别" >
                            <el-option
                                v-for="item in [
                          {value:'0',label:'男'},
                          {value:'1',label:'女'}
                        ]"
                                :key="item.value"
                                :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                </el-col>

Switch开关
	    <el-form-item label="是否有附件" prop="isAttachments">
            <el-switch v-model="form.isAttachments"
                       inline-prompt
                       active-value="1"
                       active-text="有"
                       inactive-value="0"
                       inactive-text="无">
            </el-switch>
	    </el-form-item>

多文本
<el-form-item label="事件时间轴" prop="sortOrder">
	<el-input v-model="form.meterMemo" type="textarea" :rows="4" placeholder="事件时间轴" resize="none"  maxlength="1200" show-word-limit></el-input>
</el-form-item>

字典
<el-form-item label="活动类型" prop="activeDictType">
	  <el-select  v-model="form.activeDictType" placeholder="请选择" @change="getactivetype($event)" clearable>
		  <el-option
			  v-for="(item,index) in active_type"
			  :key="index"
			  :label="item.label"
			  :value="item.value">
		  </el-option>
	  </el-select>
</el-form-item>

const { active_type } = useDict('active_type');

const getactivetype = (e:any) => {
    if(validateNull(e)){
        form.postDictType = ""
        form.postDictValue = ""

    }else {
        const item=post_type.value.find(u=>u.value==e);
        form.postDictType=item&&item.label
        form.postDictValue=item&&item.value
    }
}

按钮隐藏

<el-button  :style="'display:'+btnSub(scope.row)"  @click="handleDelete([scope.row.taskId])">删除</el-button>

const btnSub =(param)=>{
console.log(param.taskId)
    // return "'display: none'"
    return "";
    // return "none"; block
}

按钮颜色
<el-button  :style="'color:' +btnColor()">申请</el-button>

const  btnColor = ()=>{
    if(validateNull(useUserInfo().userInfos.company))
        return '#d0d0d0'
    else
        return 'blue'
}

table 行转换

                <el-table-column prop="" label="建设进度"  show-overflow-tooltip>
                    <template #default="scope">
                        {{scope.row.progress +'%'}}
                    </template>
                </el-table-column>

<el-table-column prop="" label="状态" :formatter="stateExplain" show-overflow-tooltip />
const   stateExplain = (row, column, cellValue, index)=>{
    // statusValue
    let lResult = ""
    switch (row.statusValue){
        case 0:
            lResult = "草稿"
            break;
        case 1:
            lResult = "已提交"
            break;
        case 2:
            lResult = "审核中"
            break;
        case 3:
            lResult = "已通过"
            break;
        case 4:
            lResult = "已驳回"
            break;
        default:
            lResult = ""
    }

    return lResult;
}

table 静态例子

<el-table	:data=" [{  date: '2016-05-02',  name: '王小虎',  address: '上海市普陀区金沙江路 1518 弄' },
 {   date: '2016-05-04',  name: '王小虎',  address: '上海市普陀区金沙江路 1517 弄' },
 {   date: '2016-05-01',  name: '王小虎',  address: '上海市普陀区金沙江路 1519 弄' },
 {   date: '2016-05-03',  name: '王小虎',  address: '上海市普陀区金沙江路 1516 弄' }]"	style="width: 100%">
	<el-table-column type="index" width="50" />
	<el-table-column	prop="date"	label="日期"	width="180"></el-table-column>
	<el-table-column	prop="name"	label="姓名"	width="180"></el-table-column>
	<el-table-column	prop="address" label="地址" show-overflow-tooltip>	</el-table-column>
</el-table>