|
|
@@ -0,0 +1,346 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <el-row class="handle-box" style="margin-bottom: 10px">
|
|
|
+ <el-col :span="24">
|
|
|
+ <span>买受人 </span>
|
|
|
+ <el-input v-model="search.buyerName" class="ch-input ch-input-size" placeholder="买受人" size="small" @keyup.enter.native="handleSearch()" />
|
|
|
+ <span>房屋 </span>
|
|
|
+ <el-input v-model="search.houseName" class="ch-input ch-input-size" placeholder="房屋" size="small" @keyup.enter.native="handleSearch()" />
|
|
|
+ <span>合同状态 </span>
|
|
|
+ <el-select v-model="search.status" clearable filterable placeholder="合同状态" size="small" @change="handleSearch">
|
|
|
+ <el-option v-for="item in dc_data.CONTRACT_STATUS" :key="item.value" :label="item.label" :value="item.value" />
|
|
|
+ </el-select>
|
|
|
+ <span>签约日期 </span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="search.signingDateFrom"
|
|
|
+ type="date"
|
|
|
+ placeholder="年月日"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ />
|
|
|
+ <span>至 </span>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="search.signingDateTo"
|
|
|
+ type="date"
|
|
|
+ placeholder="年月日"
|
|
|
+ value-format="yyyy-MM-dd"
|
|
|
+ />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="handle-box" style="margin-bottom: 10px">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-button class="ch-button-warning" size="small" style="float: right" @click="handleReset()"><i class="el-icon-search" /> 重置</el-button>
|
|
|
+ <el-button class="ch-button" size="small" style="float: right" @click="handleSearch()"><i class="el-icon-search" /> 查询</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row class="handle-box">
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-table v-loading="loading" :data="AllData" row-class-name="g_table_row" stripe>
|
|
|
+ <el-table-column type="index" width="60" />
|
|
|
+ <el-table-column label="合同编号" prop="contractNumber" />
|
|
|
+ <el-table-column label="网签备案号" prop="recordNumber" />
|
|
|
+ <el-table-column label="买受人" prop="buyerName" />
|
|
|
+ <el-table-column label="房屋" prop="houseName" />
|
|
|
+ <el-table-column label="实测建筑面积（㎡）" prop="" />
|
|
|
+ <el-table-column label="买卖单价（㎡）" prop="" />
|
|
|
+ <el-table-column label="买受人产权份额占比" prop="" />
|
|
|
+ <el-table-column label="付款方式" prop="" />
|
|
|
+ <el-table-column label="应收房款（元）" prop="" />
|
|
|
+ <el-table-column label="应收专项维修资金（元）" prop="" />
|
|
|
+ <el-table-column label="合同状态" prop="contractStatus" />
|
|
|
+ <el-table-column label="签约日期" prop="comment" />
|
|
|
+ <el-table-column label="创建时间" prop="createdAt" />
|
|
|
+ <el-table-column header-align="center" label="操作" width="180">
|
|
|
+ <template scope="scope">
|
|
|
+ <el-button size="mini" type="primary" @click="handleEdit(scope.row)">签约</el-button>
|
|
|
+ <el-button size="mini" type="primary" @click="handleEdit(scope.row)">编辑</el-button>
|
|
|
+ <!-- <el-button size="mini" type="danger" @click="handleDel(scope.row)">删除</el-button>-->
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="table-page">
|
|
|
+ <el-pagination
|
|
|
+ :current-page.sync="currentPage"
|
|
|
+ :page-sizes="[10, 20, 50, 100]"
|
|
|
+ :page-size="pageSize"
|
|
|
+ background
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="allpage"
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-dialog :title="dialogTitle" :visible.sync="dialogVisible" top="50px" width="75%" @open="dlgOpen">
|
|
|
+ <el-form ref="form" :model="form" :rules="rules" style="width: 100%;padding: 5px">
|
|
|
+ <el-row>
|
|
|
+ <el-col style="padding-bottom: 10px">
|
|
|
+ <span class="card_title">基本信息</span>
|
|
|
+ <el-card shadow="always" style="padding: 15px 5px 5px 15px">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="3" class="col-txt"><span>姓名</span></el-col>
|
|
|
+ <el-col :span="20" class="col-input">
|
|
|
+ <el-form-item>
|
|
|
+ <el-input v-model="form.name" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="3" class="col-txt"><span>性别</span></el-col>
|
|
|
+ <el-col :span="8" class="col-input">
|
|
|
+ <el-form-item>
|
|
|
+ <el-select v-model="form.gender" clearable filterable placeholder="性别" style="width: 100%">
|
|
|
+ <el-option
|
|
|
+ v-for="item in dc_data.STU_GENDER"
|
|
|
+ :key="item.value"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.value"
|
|
|
+ />
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4" class="col-txt"><span>生日</span></el-col>
|
|
|
+ <el-col :span="8" class="col-input">
|
|
|
+ <el-form-item>
|
|
|
+ <el-date-picker
|
|
|
+ v-model="form.birthday"
|
|
|
+ placeholder="生日"
|
|
|
+ style="width: 100%"
|
|
|
+ type="datetime"
|
|
|
+ value-format="yyyy-MM-dd HH:mm:ss"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="3" class="col-txt"><span>说明</span></el-col>
|
|
|
+ <el-col :span="20" class="col-input">
|
|
|
+ <el-form-item>
|
|
|
+ <el-input v-model="form.comment" :rows="2" type="textarea" />
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-card>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="dialogVisible = false">取 消</el-button>
|
|
|
+ <el-button type="primary" @click="confirmSubmit()">确 定</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import Base from '@/views/base/base'
|
|
|
+import BaseData from '@/views/base/baseData'
|
|
|
+
|
|
|
+import Speech from 'speak-tts'
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: 'DemoStudent',
|
|
|
+ mixins: [Base, BaseData],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ dc_key: ['CONTRACT_STATUS'],
|
|
|
+ // 列表相关
|
|
|
+ search: {
|
|
|
+ gender: '',
|
|
|
+ name: ''
|
|
|
+ },
|
|
|
+ AllData: [],
|
|
|
+ loading: false,
|
|
|
+ // 弹框相关
|
|
|
+ dialogVisible: false,
|
|
|
+ dialogTitle: '新增',
|
|
|
+ isAdd: true,
|
|
|
+ form: this.initForm(),
|
|
|
+ rules: {},
|
|
|
+ // 语音播报
|
|
|
+ speech: null
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.speechInit()
|
|
|
+ this.initDict(this.dc_key).then((res) => {
|
|
|
+ this.getData()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ speechInit: function() {
|
|
|
+ this.speech = new Speech()
|
|
|
+ this.speech.setLanguage('zh-CN')
|
|
|
+ this.speech.init().then(() => {
|
|
|
+ // console.log('语音播报初始化完成')
|
|
|
+ })
|
|
|
+ },
|
|
|
+ speak() {
|
|
|
+ this.speech.speak({ text: '琳琳下午好,今天天气很好!锄禾日当午,汗滴禾下土。谁知盘中餐,粒粒皆辛苦。' }).then(() => {
|
|
|
+ // console.log('播报完成')
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getData: function() {
|
|
|
+ const _this = this
|
|
|
+ _this.loading = true
|
|
|
+ _this.AllData = []
|
|
|
+
|
|
|
+ this.search.pageNum = this.currentPage
|
|
|
+ this.search.pageSize = this.pageSize
|
|
|
+ this.baseRequest('list', this.search).then((res) => {
|
|
|
+ if (res.data.rows) {
|
|
|
+ res.data.rows.forEach(function(item) {
|
|
|
+ const json = _this.getItemJson(item)
|
|
|
+ _this.AllData.push(json)
|
|
|
+ })
|
|
|
+ _this.allpage = res.data.total
|
|
|
+ }
|
|
|
+ _this.loading = false
|
|
|
+ }).catch((e) => {
|
|
|
+ // console.log(e)
|
|
|
+ })
|
|
|
+ // this.initOutData()
|
|
|
+ },
|
|
|
+ handleSearch: function() {
|
|
|
+ this.getData()
|
|
|
+ },
|
|
|
+ handleReset: function() {
|
|
|
+ for (const i in this.search) {
|
|
|
+ if (i !== 'pageNum' && i !== 'pageSize') {
|
|
|
+ this.search[i] = ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.handleSearch()
|
|
|
+ },
|
|
|
+ initOutData: function() {
|
|
|
+ const _this = this
|
|
|
+ this.OutData = []
|
|
|
+ const title = [' 姓名', ' 性别', ' 生日', ' 说明', ' 创建时间']
|
|
|
+ this.OutData.push(title)
|
|
|
+
|
|
|
+ return this.baseRequest('listAll', this.search).then((res) => {
|
|
|
+ if (res.data) {
|
|
|
+ res.data.forEach(function(item) {
|
|
|
+ const jsonMap = _this.getItemJson(item)
|
|
|
+ const jsonArray = []
|
|
|
+ jsonArray.push(jsonMap.name)
|
|
|
+ jsonArray.push(jsonMap.gender)
|
|
|
+ jsonArray.push(jsonMap.birthday)
|
|
|
+ jsonArray.push(jsonMap.comment)
|
|
|
+ jsonArray.push(jsonMap.createdAt)
|
|
|
+
|
|
|
+ _this.OutData.push(jsonArray)
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ })
|
|
|
+ },
|
|
|
+ getItemJson: function(item) {
|
|
|
+ item.gender = this.dc_map.STU_GENDER[item.gender]
|
|
|
+ item.birthday = this.$common.transDate(item.birthday, this.$constant.DATE_PATTERN.DATE_TIME_s_h)
|
|
|
+ item.createdAt = this.$common.transDate(item.createdAt, this.$constant.DATE_PATTERN.DATE_TIME_s_h)
|
|
|
+ return item
|
|
|
+ },
|
|
|
+ initForm: function() {
|
|
|
+ return {
|
|
|
+ id: '',
|
|
|
+ name: '',
|
|
|
+ gender: '',
|
|
|
+ birthday: '',
|
|
|
+ comment: ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ confirmOutput() {
|
|
|
+ this.initOutData().then(() => {
|
|
|
+ const OutSize = [{ wch: 15 }, { wch: 15 }, { wch: 15 }, { wch: 15 }, { wch: 15 }]
|
|
|
+ const fileName = 'demoStudent导出 ' + new Date().Format('yyyyMMddhhmm')
|
|
|
+ this.$outputXlsxFile(this.OutData, OutSize, fileName)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ dlgOpen: function() {
|
|
|
+ const _this = this
|
|
|
+
|
|
|
+ if (_this.form.id !== '') {
|
|
|
+ const postData = {
|
|
|
+ id: _this.form.id
|
|
|
+ }
|
|
|
+ this.baseRequest('getById', postData).then((res) => {
|
|
|
+ if (res.data) {
|
|
|
+ _this.form = Object.assign({}, _this.form, res.data)
|
|
|
+ _this.form.birthday = _this.$common.transServDate(res.data.birthday)
|
|
|
+ _this.form.createdAt = _this.$common.transServDate(res.data.createdAt)
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /* 编辑*/
|
|
|
+ handleEdit: function(val) {
|
|
|
+ this.isAdd = false
|
|
|
+ this.form.id = val.id
|
|
|
+ this.dialogVisible = true
|
|
|
+ this.dialogTitle = '编辑'
|
|
|
+ },
|
|
|
+ /* 新增*/
|
|
|
+ handleAdd: function() {
|
|
|
+ this.form = this.initForm()
|
|
|
+ this.isAdd = true
|
|
|
+ this.dialogVisible = true
|
|
|
+ this.dialogTitle = '新增'
|
|
|
+ },
|
|
|
+ confirmSubmit: function() {
|
|
|
+ const _this = this
|
|
|
+
|
|
|
+ this.$refs.form.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ let soaUrl = 'edit'
|
|
|
+ const extraData = {}
|
|
|
+ const postData = Object.assign({}, _this.form, extraData)
|
|
|
+
|
|
|
+ if (this.isAdd) {
|
|
|
+ soaUrl = 'add'
|
|
|
+ }
|
|
|
+ this.opRecord(postData, soaUrl)
|
|
|
+ } else {
|
|
|
+ // console.log('error submit!!')
|
|
|
+ return false
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ baseRequest(opUrl, postData) {
|
|
|
+ return this.$channel.globeRequest('ContractManageController', opUrl, postData, 'project')
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+ .ch-input .el-input__inner {
|
|
|
+ border-color: #32323A;
|
|
|
+ }
|
|
|
+ .ch-input-size {
|
|
|
+ width: 150px;
|
|
|
+ }
|
|
|
+ .ch-button {
|
|
|
+ border-color: #32323A;
|
|
|
+ background-color: #32323A;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .ch-button-warning {
|
|
|
+ margin-left: 10px;
|
|
|
+ border-color: #E6A23C;
|
|
|
+ background-color: #E6A23C;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .ch-button-export {
|
|
|
+ margin-left: 10px;
|
|
|
+ border-color: #98CC1F;
|
|
|
+ background-color: #98CC1F;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ /deep/.el-dialog__header {
|
|
|
+ padding: 10px 20px;
|
|
|
+ }
|
|
|
+ /deep/.el-dialog__body {
|
|
|
+ padding: 10px 20px;
|
|
|
+ }
|
|
|
+</style>
|
