细节

src/styles/newcrue.scss

@@ -114,6 +114,12 @@
     border-radius: 8px;
     height: 32px;
   }
+
+  ::v-deep .el-textarea__inner {
+    background-color: rgba(236, 242, 254, 1);
+    border: none;
+    border-radius: 8px;
+  }
 }
 
 // table表头滚动条对齐

src/views/ybss/fwbzdz/components/AddSyfw.vue

@@ -5,15 +5,16 @@
         </div>
         <div class="row_body long">
             <div class="row_label">房屋地址</div>
-            <el-input v-model="formData.fwdz"></el-input>
+            <el-input v-model="formData.fwDz"></el-input>
         </div>
-        <div class="row_body nomal">
+        <div class="row_body long">
             <div class="row_label">房屋特点</div>
-            <el-input @focus="focusFwtd" placeholder="请选中房屋特点"></el-input>
+            <el-input @focus="focusFwtd" placeholder="请选中房屋特点" v-loading="fwtdLoading" v-model="fwtd"></el-input>
         </div>
         <div class="row_body nomal">
             <div class="row_label">户内面积</div>
             <el-input v-model="formData.fwMj"></el-input>
+            <div class="row_label" style="text-align: left;">㎡</div>
         </div>
         <div class="row_body nomal">
             <div class="row_label">户内间数</div>
@@ -25,15 +26,15 @@
         <div class="row_body nomal">
             <div v-if="formData.zjlx == '身份证'" style="display: flex;">
                 <div class="row_label">房主姓名</div>
-                <el-input v-model="fzXm"></el-input>
+                <el-input v-model="formData.fzXm"></el-input>
             </div>
             <div v-if="formData.zjlx == '护照'" style="display: flex;">
                 <div class="row_label">房主英文姓</div>
-                <el-input v-model="fzYwx"></el-input>
+                <el-input v-model="formData.fzYwx"></el-input>
             </div>
             <div v-if="formData.zjlx == '护照'" style="display: flex;">
                 <div class="row_label">房主英文名</div>
-                <el-input v-model="fzYwm"></el-input>
+                <el-input v-model="formData.fzYwm"></el-input>
             </div>
         </div>
         <div class="row_body nomal">
@@ -55,6 +56,7 @@
         <div class="row_body nomal">
             <div class="row_label">证件号码</div>
             <el-input v-model="formData.zjhm"></el-input>
+            <div class="btn">查询</div>
         </div>
         <div class="row_body long">
             <div class="row_label">户籍地址</div>
@@ -89,27 +91,31 @@
             <button class="btn_nomal">取消</button>
             <button class="btn_primary" @click="save">确定</button>
         </div>
-        <fwtd ref="fwtd" :options="options"></fwtd>
+        <fwtd ref="fwtd" :options="options" @getfwtd="getfwtd"></fwtd>
     </div>
 </template>
 <script>
 import fwtd from './fwtd.vue';
-import { dictionaryList,saveFwAndFz } from "@/api/fwbzdz/fwbzdz";
+import { dictionaryList, saveFwAndFz } from "@/api/fwbzdz/fwbzdz";
 
 export default {
     components: { fwtd },
     data() {
         return {
+            fwtd: '',
             formData: {
-                fwdz: '',
-                fwtd: '',
+                dzbm: '',
+                fwDz: '',
+                fwlb: '',
+                fwxz: '',
+                fwyt: '',
+                syyt: '',
                 fwMj: '',
                 fwJs: '',
                 fzXm: '',
                 fzYwx: '',
                 fzYwm: '',
                 zjlx: '身份证',
-                gjOp: [],
                 fzgj: '',
                 zjhm: '',
                 hjdz: '',
@@ -123,29 +129,49 @@ export default {
                 { label: '护照', value: '护照' },
                 { label: '身份证', value: '身份证' },
             ],
+            gjOp: [],
             options: [],
-            fwLoading: false
+            fwLoading: false,
+            fwtdLoading: false,
         }
     },
+    computed: {
+        query() {
+            return this.$store.state.thirdTitle.bzdzxq
+        },
+    },
     mounted() {
+
         this.saveFwAndFz = true
+        this.fwtdLoading = true
         dictionaryList().then(res => {
             const data = res.data.data
             console.log('dictionaryList', data)
             this.options = data
             this.gjOp = data.gjdq
-        }).finally(()=>{
+        }).finally(() => {
             this.saveFwAndFz = false
+            this.fwtdLoading = false
         })
     },
     methods: {
         focusFwtd() {
             this.$refs.fwtd.show()
         },
-        save(){
-            saveFwAndFz(this.formData).then(res=>{
-                console.log('saveFwAndFz',res)
-            }).finally(()=>{
+        getfwtd(val) {
+            console.log('getfwtd', val)
+            this.fwtd = val.fwlb.label + '、' + val.fwxz.label + '、' + val.fwyt.label + '、' + val.syyt.label
+            this.formData.fwlb = val.fwlb.value
+            this.formData.fwxz = val.fwxz.value
+            this.formData.fwyt = val.fwyt.value
+            this.formData.syyt = val.syyt.value
+        },
+        save() {
+            this.formData.dzbm = this.query.dzbm
+            this.saveFwAndFz = true
+            saveFwAndFz(this.formData).then(res => {
+                console.log('saveFwAndFz', res)
+            }).finally(() => {
                 this.saveFwAndFz = false
             })
         }
@@ -167,12 +193,14 @@ export default {
         font-weight: 600;
         color: rgba(4, 8, 20, 0.9);
     }
+}
 
-    .btn {
-        font-size: 14px;
-        font-weight: 400;
-        color: rgba(16, 109, 255, 1);
-    }
+.btn {
+    font-size: 14px;
+    font-weight: 400;
+    color: rgba(16, 109, 255, 1);
+    cursor: pointer;
+    margin-left: 12px;
 }
 
 .row_body {
@@ -202,6 +230,10 @@ export default {
     ::v-deep .el-input {
         width: 360px;
     }
+
+    ::v-deep .el-textarea {
+        width: 360px;
+    }
 }
 
 .nomal {

src/views/ybss/fwbzdz/components/GridGroup.vue

@@ -5,21 +5,22 @@
                 <div>{{ lch.lch }}</div>
             </div>
             <div class="grid_content">
-                <div class="grid_item" v-for="lcnpmh in lch.fjList" :key="lcnpmh.id"
+                <div class="grid_item" v-for="lcnpmh in lch.fjList" :key="lcnpmh.dzbm"
                     @click.stop="lcnpmhClicked(lch, lcnpmh)"
-                    :class="{ lcnpmh_active: lcnpmh.id == lcnpmhSelected ? true : false }" @dblclick="toDetail(lcnpmh)">
-                    <div>{{ lcnpmh.lcnpmh }}</div>
+                    :class="{ lcnpmh_active: lcnpmh.dzbm == lcnpmhSelected ? true : false }" @dblclick="toDetail(lcnpmh)">
+                    <div class="has_data">{{ lcnpmh.lcnpmh }}</div>
                     <div style="display: flex;margin-top: 8px;">
                         <img :src="icon_house_color_16" alt="" v-if="lcnpmh.times != 0">
                         <img :src="icon_house_gray_16" alt="" v-else>
-                        <div>实有房屋</div>
+                        <div :class="{ has_data: lcnpmh.times != 0 ? true : false }">实有房屋</div>
                     </div>
                     <div style="display: flex;margin-top: 8px;">
                         <img :src="icon_unit_color_16" alt="" v-if="lcnpmh.sydwNum != 0">
                         <img :src="icon_unit_gray_16" alt="" v-else>
-                        <div>实有单位</div>
+                        <div :class="{ has_data: lcnpmh.sydwNum != 0 ? true : false }">实有单位</div>
                     </div>
-                    <div style="margin-top: 8px;">已采集 {{ lcnpmh.personNum }} 人</div>
+                    <div style="margin-top: 8px;" :class="{ has_data: lcnpmh.personNum != 0 ? true : false }">已采集 {{
+                        lcnpmh.personNum }} 人</div>
                 </div>
             </div>
         </div>
@@ -58,7 +59,7 @@ export default {
         if (this.lcList) {
             this.$set(this.$data, 'lchSelected', this.lcList[0].lch)
             if (this.lcList[0]['fjList']) {
-                this.$set(this.$data, 'lcnpmhSelected', this.lcList[0]['fjList'][0].id)
+                this.$set(this.$data, 'lcnpmhSelected', this.lcList[0]['fjList'][0].dzbm)
             }
         }
     },
@@ -68,8 +69,8 @@ export default {
         },
         // 有 times 亮
         lcnpmhClicked(lch, lcnpmh) {
-            if (this.lcnpmhSelected != lcnpmh.id) {
-                this.$set(this.$data, 'lcnpmhSelected', lcnpmh.id)
+            if (this.lcnpmhSelected != lcnpmh.dzbm) {
+                this.$set(this.$data, 'lcnpmhSelected', lcnpmh.dzbm)
             }
             if (this.lchSelected != lch.lch) {
                 this.$set(this.$data, 'lchSelected', lch.lch)
@@ -151,6 +152,10 @@ export default {
             border: 1px solid rgba(16, 109, 255, 1);
             background-color: rgba(16, 108, 253, 0.10);
         }
+
+        .has_data {
+            color: rgba(0, 0, 0, 0.9);
+        }
     }
 }
 </style>

src/views/ybss/fwbzdz/components/fwtd.vue

@@ -5,25 +5,29 @@
             <div class="fwtd_row">
                 <div class="label">房屋类别</div>
                 <el-radio-group v-model="fwlb">
-                    <el-radio v-for="(item) in options.fwlbs" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
+                    <el-radio v-for="(item) in options.fwlb" :key="item.value" :label="item.value">{{ item.label
+                        }}</el-radio>
                 </el-radio-group>
             </div>
             <div class="fwtd_row">
                 <div class="label">房屋性质</div>
                 <el-radio-group v-model="fwxz">
-                    <el-radio v-for="(item) in options.fwxzs" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
+                    <el-radio v-for="(item) in options.fwxz" :key="item.value" :label="item.value">{{ item.label
+                        }}</el-radio>
                 </el-radio-group>
             </div>
             <div class="fwtd_row">
                 <div class="label">房屋用途</div>
                 <el-radio-group v-model="fwyt">
-                    <el-radio v-for="(item) in options.fwyts" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
+                    <el-radio v-for="(item) in options.fwyt" :key="item.value" :label="item.value">{{ item.label
+                        }}</el-radio>
                 </el-radio-group>
             </div>
             <div class="fwtd_row">
                 <div class="label">使用用途</div>
                 <el-radio-group v-model="syyt">
-                    <el-radio v-for="(item) in options.syyts" :key="item.value" :label="item.value">{{ item.label }}</el-radio>
+                    <el-radio v-for="(item) in options.syyt" :key="item.value" :label="item.value">{{ item.label
+                        }}</el-radio>
                 </el-radio-group>
             </div>
             <div class='footer'>
@@ -40,7 +44,7 @@ export default {
     props: {
         options: {
             type: Array,
-            default: ()=>{
+            default: () => {
                 return []
             }
         }
@@ -49,18 +53,14 @@ export default {
         return {
             dialogVisible: false,
             loading: false,
-            fwlbs: [],
             fwlb: '',
-            fwxzs: [],
             fwxz: '',
-            fwyts: [],
             fwyt: '',
-            syyts: [],
             syyt: ''
         }
     },
     mounted() {
-        
+
     },
     methods: {
         show() {
@@ -70,13 +70,29 @@ export default {
             this.dialogVisible = false
         },
         dialogSave() {
-            this.emit('getfwtd', {})
+            this.$emit('getfwtd', {
+                fwlb: this.getLabel('fwlb', this.fwlb),
+                fwxz: this.getLabel('fwxz', this.fwxz),
+                fwyt: this.getLabel('fwyt', this.fwyt),
+                syyt: this.getLabel('syyt', this.syyt)
+            })
+            this.dialogVisible = false
         },
+        getLabel(str, val) {
+            let value
+            this.options[str].forEach(item => {
+                if (item.value == val) {
+                    value = item
+                }
+            })
+            return value
+        }
     }
 }
 </script>
 <style lang="scss" scoped>
 @import '@/styles/newcrue.scss';
+@import '@/styles/public/button-style.scss';
 
 .fwtd_row {
     display: flex;
@@ -95,6 +111,8 @@ export default {
 
 ::v-deep .el-dialog__body {
     padding: 24px 24px 0 24px;
+    position: relative;
+
 }
 
 .footer {
@@ -104,33 +122,15 @@ export default {
     display: flex;
     flex-direction: row-reverse;
     align-items: center;
+    position: absolute;
+    bottom: 0;
+    right: 12px;
 
     button {
         width: 80px;
         height: 32px;
         margin-right: 12px;
-    }
-
-    .btn_primary {
-        border: none;
-        background-color: rgba(16, 109, 255, 1);
-        color: #fff;
-    }
-
-    .btn_primary:active {
-        background-color: #66b1ff;
-    }
-
-    .btn_default {
-        background-color: #fff;
-        color: rgba(111, 124, 163, 1);
-        border: 1px solid #DCDCDC;
-    }
-
-    .btn_default:active {
-        background-color: #66b1ff;
-        border: 1px solid rgba(16, 109, 255, 0.8);
-        color: rgba(16, 109, 255, 0.8);
+        border-radius: 8px;
     }
 }
 </style>