|
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111 |
- <script lang='ts' setup>
- import { reactive } from 'vue';
- const OBUList = reactive({
- cno: '',
- carNo: '',
- carColors: '',
- OBUno: '',
- })
- const options = [
- {
- value: 'Option1',
- label: 'Option1',
- },
- {
- value: 'Option2',
- label: 'Option2',
- },
- {
- value: 'Option3',
- label: 'Option3',
- },
- {
- value: 'Option4',
- label: 'Option4',
- },
- {
- value: 'Option5',
- label: 'Option5',
- },
- ]
- const tableData = [
- {
- carId: '贵CEP186_0',
- customerNo: '52010116110441017',
- customerName: '周金碧',
- certificatesType: '身份证(含临时身份证)',
- identificationNo: '522125196110110029',
- phone: '15885137270',
- handler: '周金碧',
- handlerTime: '2018/03/17 21:15:13',
- department: '技术部',
- },
- ]
- const handleClick = () => {
- console.log('click')
- }
- </script>
- <template>
- <div class="OBU-query content-warpper">
- <el-form :inline="true" :model="OBUList" class="demo-form-inline">
- <el-form-item label="证件类型">
- <el-select v-model="OBUList.carColors" class="m-2" placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- <el-form-item label="证件号码">
- <el-input v-model="OBUList.OBUno" placeholder="证件号码" />
- </el-form-item>
- <el-form-item label="客户编号">
- <el-input v-model="OBUList.OBUno" placeholder="客户编号" />
- </el-form-item>
- <el-form-item label="客户名称">
- <el-input v-model="OBUList.OBUno" placeholder="客户名称" />
- </el-form-item>
- <el-form-item label="手机号码">
- <el-input v-model="OBUList.OBUno" placeholder="手机号码" />
- </el-form-item>
- <el-form-item label="指定经办人">
- <el-input v-model="OBUList.OBUno" placeholder="指定经办人" />
- </el-form-item>
-
- <el-form-item label="每条页数">
- <el-select v-model="OBUList.carColors" class="m-2" placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- />
- </el-select>
- </el-form-item>
- <el-form-item><el-button type="primary" icon="Search">查询</el-button></el-form-item>
- <el-form-item><el-button type="warning" plain icon="Refresh">重置</el-button></el-form-item>
- </el-form>
- <el-table :data="tableData" style="width: 100%">
- <el-table-column type="index" label="序号" width="64" fixed align="center" />
- <el-table-column prop="customerNo" label="客户编号" width="180" align="center" />
- <el-table-column prop="customerName" label="客户名称" width="100" align="center" />
- <el-table-column prop="certificatesType" label="客户证件类型" width="180" align="center" />
- <el-table-column prop="identificationNo" label="客户证件号码" width="180" align="center" />
- <el-table-column prop="phone" label="手机号" width="100" align="center" />
- <el-table-column prop="handler" label="指定经办人" width="120" align="center" />
- <el-table-column prop="handlerTime" label="经办时间" width="100" align="center" />
- <el-table-column prop="department" label="部门" width="180" align="center" />
- <el-table-column fixed="right" label="操作" width="160" align="center" >
- <template #default>
- <el-button type="success" size="small" @click="handleClick">修改</el-button>
- <el-button type="primary" size="small">查看</el-button>
- </template>
- </el-table-column>
- </el-table>
- </div>
- </template>
- <style scoped>
-
- </style>
|