relocatehousehold.vue 100 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831183218331834183518361837183818391840184118421843184418451846184718481849185018511852185318541855185618571858185918601861186218631864186518661867186818691870187118721873187418751876187718781879188018811882188318841885188618871888188918901891189218931894189518961897189818991900190119021903190419051906190719081909191019111912191319141915191619171918191919201921192219231924192519261927192819291930193119321933193419351936193719381939194019411942194319441945194619471948194919501951195219531954195519561957195819591960196119621963196419651966196719681969197019711972197319741975197619771978197919801981198219831984198519861987198819891990199119921993199419951996199719981999200020012002200320042005200620072008200920102011201220132014201520162017201820192020202120222023202420252026202720282029203020312032203320342035203620372038203920402041204220432044204520462047204820492050205120522053205420552056205720582059206020612062206320642065206620672068206920702071207220732074207520762077207820792080208120822083208420852086208720882089209020912092209320942095209620972098209921002101210221032104210521062107210821092110211121122113211421152116211721182119212021212122212321242125212621272128212921302131213221332134213521362137213821392140214121422143214421452146214721482149215021512152215321542155215621572158215921602161216221632164216521662167216821692170217121722173217421752176217721782179218021812182218321842185218621872188218921902191219221932194219521962197219821992200220122022203220422052206220722082209221022112212221322142215221622172218221922202221222222232224222522262227222822292230223122322233223422352236223722382239224022412242224322442245224622472248224922502251225222532254225522562257225822592260226122622263226422652266226722682269227022712272227322742275227622772278227922802281228222832284228522862287228822892290229122922293229422952296229722982299230023012302230323042305230623072308230923102311231223132314231523162317231823192320232123222323232423252326232723282329233023312332233323342335233623372338233923402341234223432344234523462347234823492350235123522353235423552356235723582359236023612362236323642365236623672368236923702371237223732374237523762377237823792380238123822383238423852386238723882389239023912392239323942395239623972398239924002401240224032404240524062407240824092410241124122413241424152416241724182419242024212422242324242425242624272428242924302431243224332434243524362437243824392440244124422443244424452446244724482449245024512452245324542455245624572458245924602461246224632464246524662467246824692470247124722473247424752476247724782479248024812482248324842485248624872488248924902491249224932494249524962497249824992500250125022503250425052506250725082509251025112512251325142515251625172518251925202521252225232524252525262527252825292530253125322533253425352536253725382539254025412542254325442545254625472548254925502551255225532554255525562557255825592560256125622563256425652566256725682569257025712572257325742575257625772578257925802581258225832584258525862587258825892590259125922593259425952596259725982599260026012602260326042605260626072608260926102611261226132614261526162617261826192620262126222623262426252626262726282629263026312632263326342635263626372638263926402641264226432644264526462647264826492650265126522653265426552656265726582659266026612662266326642665266626672668266926702671267226732674267526762677267826792680268126822683268426852686268726882689269026912692269326942695269626972698269927002701270227032704270527062707270827092710271127122713271427152716271727182719272027212722272327242725272627272728272927302731273227332734273527362737273827392740274127422743274427452746274727482749275027512752275327542755275627572758275927602761276227632764276527662767276827692770277127722773277427752776277727782779278027812782278327842785278627872788278927902791279227932794279527962797279827992800280128022803280428052806280728082809281028112812281328142815281628172818281928202821282228232824282528262827282828292830283128322833283428352836283728382839284028412842284328442845284628472848284928502851285228532854285528562857285828592860286128622863286428652866286728682869287028712872287328742875287628772878287928802881
  1. <template>
  2. <div class="relocate">
  3. <div class="relocate-top">
  4. <div :class="switchi==0?'LeftCheck':''"
  5. @click="switchi=0;agreementSigningStatus='未签约';vacateState='未腾房';getList()">
  6. 未签订
  7. </div>
  8. <div :class="switchi==1?'LeftCheck':''"
  9. @click="switchi=1;agreementSigningStatus='已签约';vacateState='未腾房';getList()">
  10. 已签订
  11. </div>
  12. <div :class="switchi==2?'LeftCheck':''"
  13. @click="switchi=2;agreementSigningStatus='已签约';vacateState='已腾房';getList()">
  14. 已腾空
  15. </div>
  16. </div>
  17. <div class="relocate-name">
  18. <div class="relocate-name-one">
  19. <div class="relocate-name-one-top">
  20. <div class="relocate-name-one-top-left">
  21. <div>
  22. <span>编号:</span>
  23. <el-input placeholder="请输入编号" clearable></el-input>
  24. </div>
  25. <div>
  26. <span>户主姓名:</span>
  27. <el-input v-model="householderName" placeholder="请输入户主姓名" clearable></el-input>
  28. </div>
  29. <!-- <div>
  30. <span>户主身份证号:</span>
  31. <el-input v-model="householderIdCard" placeholder="请输入户主身份证号" clearable></el-input>
  32. </div> -->
  33. <!-- <div v-if="switchi>0">
  34. <span>安置方式:</span>
  35. <el-select v-model="flowState" placeholder="请选择安置方式" clearable>
  36. <el-option label="货币安置" value="货币"></el-option>
  37. <el-option label="迁建安置" value="迁建"></el-option>
  38. <el-option label="混合安置" value="混合"></el-option>
  39. </el-select>
  40. </div> -->
  41. <div class="button-background">
  42. <el-button @click="getList();page = 1">查询</el-button>
  43. <el-button @click="query=true">更多查询</el-button>
  44. </div>
  45. </div>
  46. <div class="relocate-name-one-top-right">
  47. <ul v-if="authority==0&&switchi==0">
  48. <li @click="getStrtte()"><i class="el-icon-plus"></i><span>新增</span></li>
  49. <li @click="brade()"><i class="el-icon-sort"></i><span>分户</span></li>
  50. <el-dropdown>
  51. <li><i class="el-icon-download"></i><span>导出模板</span></li>
  52. <el-dropdown-menu>
  53. <el-dropdown-item>
  54. <span
  55. @click="exportdata('api/auth/householdcx/exportExcelOne')">拆迁户基本信息模板</span>
  56. </el-dropdown-item>
  57. <el-dropdown-item>
  58. <span
  59. @click="exportdata('api/auth/householdcx/exportExcelTwo')">被拆迁房屋土地使用权面积和建筑面积认定书模板</span>
  60. </el-dropdown-item>
  61. <el-dropdown-item>
  62. <span
  63. @click="exportdata('api/auth/householdcx/exportExcelThree')">被拆迁房屋用地面积认定表模板</span>
  64. </el-dropdown-item>
  65. <el-dropdown-item>
  66. <span
  67. @click="exportdata('api/auth/householdcx/exportExcelFour')">生产经营用房面积核定表模板</span>
  68. </el-dropdown-item>
  69. <el-dropdown-item>
  70. <span
  71. @click="exportdata('api/auth/householdcx/exportExcelFive')">被拆迁安置人口、可安置面积认定表模板</span>
  72. </el-dropdown-item>
  73. <el-dropdown-item>
  74. <span @click="exportdata('api/auth/householdcx/exportExcelSix')">评估结果模板</span>
  75. </el-dropdown-item>
  76. <el-dropdown-item>
  77. <span @click="exportdata('api/auth/householdcx/exportExcelNine')">非住宅信息模板</span>
  78. </el-dropdown-item>
  79. </el-dropdown-menu>
  80. </el-dropdown>
  81. <el-dropdown>
  82. <li><i class="el-icon-upload2"></i><span>导入数据</span></li>
  83. <el-dropdown-menu>
  84. <el-dropdown-item>
  85. <el-upload :action="exportExcelOneURL" :data="householdcxData"
  86. :headers="tokenData" :show-file-list="false"
  87. :on-success="householdcxSucces">
  88. <span>拆迁户基本信息</span>
  89. </el-upload>
  90. </el-dropdown-item>
  91. <el-dropdown-item>
  92. <el-upload :action="exportExcelTwoURL" :data="householdcxData"
  93. :headers="tokenData" :show-file-list="false"
  94. :on-success="householdcxSucces">
  95. <span>被拆迁房屋土地使用权面积和建筑面积认定书</span>
  96. </el-upload>
  97. </el-dropdown-item>
  98. <el-dropdown-item>
  99. <el-upload :action="exportExcelThreeurl" :data="householdcxData"
  100. :headers="tokenData" :show-file-list="false"
  101. :on-success="householdcxSucces">
  102. <span>被拆迁房屋用地面积认定表</span>
  103. </el-upload>
  104. </el-dropdown-item>
  105. <el-dropdown-item>
  106. <el-upload :action="exportExcelFourURL" :data="householdcxData"
  107. :headers="tokenData" :show-file-list="false"
  108. :on-success="householdcxSucces">
  109. <span>生产经营用房面积核定表</span>
  110. </el-upload>
  111. </el-dropdown-item>
  112. <el-dropdown-item>
  113. <el-upload :action="exportExcelFiveURL" :data="householdcxData"
  114. :headers="tokenData" :show-file-list="false"
  115. :on-success="householdcxSucces">
  116. <span>被拆迁安置人口、可安置面积认定表</span>
  117. </el-upload>
  118. </el-dropdown-item>
  119. <el-dropdown-item>
  120. <el-upload :action="exportExcelSixURL" :data="householdcxData"
  121. :headers="tokenData" :show-file-list="false"
  122. :on-success="householdcxSucces">
  123. <span>导入评估结果</span>
  124. </el-upload>
  125. </el-dropdown-item>
  126. <el-dropdown-item>
  127. <el-upload :action="exportExcelNineURL" :data="householdcxData"
  128. :headers="tokenData" :show-file-list="false"
  129. :on-success="householdcxSucces">
  130. <span>导入非住宅信息</span>
  131. </el-upload>
  132. </el-dropdown-item>
  133. </el-dropdown-menu>
  134. </el-dropdown>
  135. </ul>
  136. </div>
  137. </div>
  138. <div class="relocate-name-one-tow">
  139. <div class="WithoutInterval">
  140. <el-table :data="ImportInformation.list" height="566" align="center" highlight-current-row
  141. @current-change="Checkbranch">
  142. <el-table-column prop="moveBackCode" label="编号">
  143. </el-table-column>
  144. <el-table-column prop="householderName" label="户主姓名">
  145. </el-table-column>
  146. <el-table-column prop="householderIdCard" label="户主身份证号">
  147. </el-table-column>
  148. <el-table-column prop="street" label="原房地址(镇/村/门牌号)">
  149. <template slot-scope="scope">
  150. <span>{{scope.row.street}}/{{scope.row.village}}/{{scope.row.oldHouseAddress}}</span>
  151. </template>
  152. </el-table-column>
  153. <!-- <el-table-column prop="oldHouseAddress" label="原房地址">
  154. </el-table-column> -->
  155. <el-table-column prop="buildArea" label="原房建筑面积(m²)">
  156. </el-table-column>
  157. <el-table-column v-if="switchi!=0" prop="placementWay" label="安置方式">
  158. </el-table-column>
  159. <el-table-column v-if="switchi==2" prop="accountsPayable" label="应付款">
  160. </el-table-column>
  161. <el-table-column v-if="switchi==2" prop="amountPaid" label="已付款">
  162. <template slot-scope="scope">
  163. <span style="color: #439dc1;cursor: pointer;" @click="getPayrecord(scope.row.id)">{{scope.row.amountPaid}}</span>
  164. </template>
  165. </el-table-column>
  166. <el-table-column v-if="switchi!=0" prop="signingDateOfCompensationAgreement"
  167. label="补偿协议签订日期">
  168. <template slot-scope="scope">
  169. <span
  170. :style="{'color':(examineStatus(scope.row.signingDateOfCompensationAgreement)?'red':'#828282')}">{{scope.row.signingDateOfCompensationAgreement}}</span>
  171. </template>
  172. </el-table-column>
  173. <el-table-column label="操作" width="200" align="center">
  174. <template slot-scope="scope">
  175. <el-button type="text" size="small"
  176. @click="ExamineControl=true;getgetexaminefile(scope.row)"
  177. v-if="switchi==0&&scope.row.signingReviewState=='未审核'">签约审核</el-button>
  178. <el-button type="text" size="small"
  179. @click="datahousehold=scope.row;coverControl=true"
  180. v-if="switchi==0&&scope.row.signingReviewState=='已审核'">协议签订</el-button>
  181. <el-button type="text" size="small" @click='edititem(scope.row)' v-if="switchi==0">
  182. 编辑</el-button>
  183. <el-button type="text" size="small" @click='smallhouseholdcx(scope.row)'
  184. style="color: orangered;" v-if="switchi==0">删除</el-button>
  185. <el-button type="text" size="small" @click="operation(scope.row,'腾房')"
  186. v-if="switchi==1">腾房</el-button>
  187. <el-button type="text" size="small" :disabled='scope.row.cancellationState=="已注销"'
  188. @click="operation(scope.row,'注销')" v-if="switchi==2">注销</el-button>
  189. <el-button type="text" size="small" :disabled='scope.row.paymentState=="已付款"'
  190. @click="datahousehold=scope.row;covercommit=true" v-if="switchi==2">付款</el-button>
  191. <el-button type="text" size="small" :disabled='authority==1'
  192. @click="operation(scope.row,'发放发票')"
  193. v-if="switchi==2&&scope.row.placementWay!='迁建'">发放发票</el-button>
  194. <el-button type="text" size="small" @click='edititem(scope.row)' v-if="switchi!=0">
  195. 查看</el-button>
  196. <el-button type="text" size="small" :disabled='authority==1'
  197. @click="From(scope.row)" v-if="switchi==1">撤销签订</el-button>
  198. </template>
  199. </el-table-column>
  200. </el-table>
  201. </div>
  202. </div>
  203. <div class="block" style="margin-bottom: 0;">
  204. <el-pagination background hide-on-single-page :total="ImportInformation.totalCount"
  205. @current-change="handleCurrentChange" :current-page.sync="page" :page-size="10"
  206. layout="total,prev, pager, next, jumper">
  207. </el-pagination>
  208. </div>
  209. </div>
  210. </div>
  211. <!-- ====分户==== -->
  212. <div class="tk">
  213. <el-dialog title="分户" :visible.sync="branchousehold" width="672px">
  214. <div class="branch">
  215. <div class="form">
  216. <el-form :model="branch" :rules="branchrules" ref="Demobranch">
  217. <el-form-item label="分户户主姓名" prop="newHouseholdName" label-width="150px"
  218. style="width: 100%;">
  219. <el-input v-model="branch.newHouseholdName" placeholder="请输入分户户主姓名"></el-input>
  220. </el-form-item>
  221. <el-form-item label="分户户主身份证" prop="newHouseholdIdCard" label-width="150px"
  222. style="width: 100%;">
  223. <el-input v-model="branch.newHouseholdIdCard" placeholder="请输入分户户主身份证"></el-input>
  224. </el-form-item>
  225. </el-form>
  226. </div>
  227. <div style="text-align: center">
  228. <el-transfer style="text-align: left; display: inline-block" v-model="branchvalue"
  229. :data="branchdata" :titles="['原户家庭成员', '新户家庭成员']">
  230. </el-transfer>
  231. </div>
  232. </div>
  233. <span slot="footer" class="dialog-footer">
  234. <el-button type="primary" @click="account('Demobranch')">确 定</el-button>
  235. <el-button @click="branchousehold = false">取 消</el-button>
  236. </span>
  237. </el-dialog>
  238. </div>
  239. <!-- =====新增户===== -->
  240. <div class="tk">
  241. <el-dialog title="新增" :visible.sync="addVisible" width="690px">
  242. <div class="form">
  243. <el-form :model='addlist' :rules="addlistrules" ref="addlist">
  244. <el-form-item label="被拆迁人" label-width="120px" prop="householderName">
  245. <el-input v-model="addlist.householderName" placeholder="请输入内容"></el-input>
  246. </el-form-item>
  247. <el-form-item label="户主身份证号" label-width="120px" prop="householderIdCard">
  248. <el-input v-model="addlist.householderIdCard" placeholder="请输入内容"></el-input>
  249. </el-form-item>
  250. <el-form-item label="征收房屋性质" label-width="120px" prop="levyHouseNature">
  251. <el-select placeholder="请选择征收房屋性质" v-model="addlist.levyHouseNature" clearable
  252. style="width: 100%;">
  253. <el-option label="住宅" value="住宅"></el-option>
  254. <el-option label="非住宅" value="非住宅"></el-option>
  255. </el-select>
  256. </el-form-item>
  257. <el-form-item label="镇(街道)" prop="street" label-width="120px">
  258. <el-select placeholder="请选择征收房屋性质" v-model="addlist.street" clearable :disabled='namestreet.length==1'
  259. style="width: 100%;">
  260. <el-option :label="item" :value="item" v-for="(item,index) in namestreet" :key="index"></el-option>
  261. </el-select>
  262. <!-- <el-input v-model="addlist.street" placeholder="请输入内容"></el-input> -->
  263. </el-form-item>
  264. <el-form-item label="村" prop="village" label-width="120px">
  265. <el-input v-model="addlist.village" placeholder="请输入内容"></el-input>
  266. </el-form-item>
  267. <el-form-item label="门牌号" prop="oldHouseAddress" label-width="120px">
  268. <el-input v-model="addlist.oldHouseAddress" placeholder="请输入内容"></el-input>
  269. </el-form-item>
  270. <el-form-item label="地段等级" prop="oldHouseAddress" label-width="120px">
  271. <el-select v-model="addlist.locationClassification" placeholder="请选择地段等级" clearable style="width: 100%;">
  272. <el-option v-for="(i,index) in earth" :key="index" :label="i" :value="i"></el-option>
  273. </el-select>
  274. </el-form-item>
  275. </el-form>
  276. </div>
  277. <span slot="footer" class="dialog-footer">
  278. <el-button type="primary" @click="addhousehold('addlist')">确 定</el-button>
  279. <el-button @click="addVisible = false">取 消</el-button>
  280. </span>
  281. </el-dialog>
  282. </div>
  283. <!-- =======编辑======= -->
  284. <div class="al">
  285. <el-drawer size='50%' :visible.sync="sethousehold" :with-header="false">
  286. <div class="tc-top">
  287. <h2>{{datahousehold.householderName}}</h2>
  288. </div>
  289. <div class="tca-menu">
  290. <div id="header">
  291. <div class="item_box" @click="householdindex=0" :class="householdindex==0?'active':''">
  292. 详细资料
  293. </div>
  294. <div class="item_box" @click="householdindex=1;getfile()"
  295. :class="householdindex==1?'active':''">
  296. 拆迁户资料
  297. </div>
  298. <div class="item_box" @click="householdindex=2" :class="householdindex==2?'active':''">
  299. 报表打印
  300. </div>
  301. </div>
  302. </div>
  303. <div class="tc-middle" v-if="householdindex==0">
  304. <h3>征迁信息:</h3>
  305. <div class="arrr">
  306. <el-collapse v-model="activeName" accordion>
  307. <el-collapse-item title="基本信息" name="1">
  308. <div class="form">
  309. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  310. <el-form-item label="编号" label-width="130px" prop="projectName">
  311. <el-input v-model="datahousehold.moveBackCode" disabled autocomplete="off">
  312. </el-input>
  313. </el-form-item>
  314. <el-form-item label="户主姓名" class="msg" label-width="130px" prop="projectCode">
  315. <el-input v-model="datahousehold.householderName" autocomplete="off">
  316. </el-input>
  317. </el-form-item>
  318. <el-form-item label="户主身份证号" label-width="130px" prop="projectName">
  319. <el-input v-model="datahousehold.householderIdCard" autocomplete="off">
  320. </el-input>
  321. </el-form-item>
  322. <el-form-item label="镇(街道)" class="msg" label-width="130px" prop="projectCode">
  323. <el-input v-model="datahousehold.street" autocomplete="off"></el-input>
  324. </el-form-item>
  325. <el-form-item label="村" class="msg" label-width="130px" prop="projectCode">
  326. <el-input v-model="datahousehold.village" autocomplete="off"></el-input>
  327. </el-form-item>
  328. <el-form-item label="门牌号" label-width="130px" prop="projectName">
  329. <el-input v-model="datahousehold.oldHouseAddress" autocomplete="off">
  330. </el-input>
  331. </el-form-item>
  332. <el-form-item label="征收房屋性质" label-width="130px">
  333. <el-select placeholder="请选择征收房屋性质" v-model="datahousehold.levyHouseNature" @change='PlacementSelect()'
  334. clearable style="width: 100%;">
  335. <el-option label="住宅" value="住宅"></el-option>
  336. <el-option label="非住宅" value="非住宅"></el-option>
  337. </el-select>
  338. </el-form-item>
  339. <!-- <el-form-item label="安置方式" label-width="130px" prop="projectName">
  340. <el-select placeholder="请选择安置方式" :disabled='datahousehold.levyHouseNature=="非住宅"' v-model="datahousehold.placementWay" clearable style="width: 100%;">
  341. <el-option label="货币" value="货币"></el-option>
  342. <el-option label="混合" value="混合"></el-option>
  343. <el-option label="迁建" value="迁建"></el-option>
  344. </el-select>
  345. </el-form-item> -->
  346. <el-form-item label="地段等级" label-width="130px" prop="projectName">
  347. <el-select placeholder="请选择地段等级" v-model="datahousehold.locationClassification" clearable style="width: 100%;">
  348. <el-option v-for="(i,index) in earth" :key="index" :label="i" :value="i"></el-option>
  349. </el-select>
  350. </el-form-item>
  351. </el-form>
  352. </div>
  353. </el-collapse-item>
  354. <div v-if="datahousehold.levyHouseNature!='非住宅'">
  355. <el-collapse-item title="建筑面积认定信息" name="2">
  356. <div class="form">
  357. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  358. <el-form-item label="户主姓名" class="msg" label-width="200px" prop="projectCode">
  359. <el-input v-model="datahousehold.householderName" autocomplete="off">
  360. </el-input>
  361. </el-form-item>
  362. <el-form-item label="被拆迁房屋位置" class="msg" label-width="200px"
  363. prop="projectCode">
  364. <el-input v-model="datahousehold.oldHouseAddress" autocomplete="off">
  365. </el-input>
  366. </el-form-item>
  367. <el-form-item label="楼房层数" class="msg" label-width="200px" prop="projectCode">
  368. <el-input v-model="datahousehold.legalBuildFlatLayer" autocomplete="off">
  369. </el-input>
  370. </el-form-item>
  371. <el-form-item label="楼房间数" class="msg" label-width="200px" prop="projectCode">
  372. <el-input v-model="datahousehold.legalBuildFlatRoom" autocomplete="off">
  373. </el-input>
  374. </el-form-item>
  375. <el-form-item label="楼房占地面积(m²)" class="msg" label-width="200px" prop="projectCode">
  376. <el-input v-model="datahousehold.legalBuildFlatAreaCovered"
  377. autocomplete="off"></el-input>
  378. </el-form-item>
  379. <el-form-item label="楼房建筑面积(m²)" class="msg" label-width="200px" prop="projectCode">
  380. <el-input v-model="datahousehold.legalBuildFlatBuiltupArea"
  381. autocomplete="off"></el-input>
  382. </el-form-item>
  383. <el-form-item label="平房间数" class="msg" label-width="200px" prop="projectCode">
  384. <el-input v-model="datahousehold.legalBuildHouseRoom" autocomplete="off">
  385. </el-input>
  386. </el-form-item>
  387. <el-form-item label="平房占地面积(m²)" class="msg" label-width="200px" prop="projectCode">
  388. <el-input v-model="datahousehold.legalBuildHouseAreaCovered"
  389. autocomplete="off"></el-input>
  390. </el-form-item>
  391. <el-form-item label="平房建筑面积(m²)" class="msg" label-width="200px" prop="projectCode">
  392. <el-input v-model="datahousehold.legalBuildHouseBuiltupArea"
  393. autocomplete="off"></el-input>
  394. </el-form-item>
  395. <el-form-item label="合法土地使用权面积(m²)" class="msg" label-width="200px"
  396. prop="projectCode">
  397. <el-input v-model="datahousehold.legalLandArea" autocomplete="off">
  398. </el-input>
  399. </el-form-item>
  400. <el-form-item label="房屋建筑面积(m²)" class="msg" label-width="200px" prop="projectCode">
  401. <el-input v-model="datahousehold.buildArea" autocomplete="off"></el-input>
  402. </el-form-item>
  403. <el-form-item label="斜面结构屋面积(m²)" class="msg" label-width="200px"
  404. prop="projectCode">
  405. <el-input v-model="datahousehold.slopeBuildArea" autocomplete="off">
  406. </el-input>
  407. </el-form-item>
  408. <el-form-item label="合法集体所有土地住宅数量" class="msg" label-width="200px"
  409. prop="projectCode">
  410. <el-input v-model="datahousehold.legalHouseTotal" autocomplete="off">
  411. </el-input>
  412. </el-form-item>
  413. <el-form-item label="住宅数量-红线内" class="msg" label-width="200px"
  414. prop="projectCode">
  415. <el-input v-model="datahousehold.redLineInHouseCount" autocomplete="off">
  416. </el-input>
  417. </el-form-item>
  418. <el-form-item label="住宅数量-红线外" class="msg" label-width="200px"
  419. prop="projectCode">
  420. <el-input v-model="datahousehold.redLineOutHouseCount" autocomplete="off">
  421. </el-input>
  422. </el-form-item>
  423. <el-form-item label="平房间数-红线外" class="msg" label-width="200px"
  424. prop="projectCode">
  425. <el-input v-model="datahousehold.redLineHouseRoom" autocomplete="off">
  426. </el-input>
  427. </el-form-item>
  428. <el-form-item label="平房建筑面积(m²)-红线外" class="msg" label-width="200px"
  429. prop="projectCode">
  430. <el-input v-model="datahousehold.redLineHouseBuiltupArea"
  431. autocomplete="off"></el-input>
  432. </el-form-item>
  433. <el-form-item label="楼房层数-红线外" class="msg" label-width="200px"
  434. prop="projectCode">
  435. <el-input v-model="datahousehold.redLineFlatLayer" autocomplete="off">
  436. </el-input>
  437. </el-form-item>
  438. <el-form-item label="楼房间数-红线外" class="msg" label-width="200px"
  439. prop="projectCode">
  440. <el-input v-model="datahousehold.redLineFlatRoom" autocomplete="off">
  441. </el-input>
  442. </el-form-item>
  443. <el-form-item label="建筑面积(m²)-红线外" class="msg" label-width="200px"
  444. prop="projectCode">
  445. <el-input v-model="datahousehold.redLineBuildArea" autocomplete="off">
  446. </el-input>
  447. </el-form-item>
  448. </el-form>
  449. </div>
  450. </el-collapse-item>
  451. <el-collapse-item title="被拆迁房屋用地面积认定信息" name="3">
  452. <div class="form">
  453. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  454. <el-form-item label="镇(街道)" class="msg" label-width="180px" prop="projectCode">
  455. <el-input v-model="datahousehold.street" autocomplete="off"></el-input>
  456. </el-form-item>
  457. <el-form-item label="村" class="msg" label-width="180px" prop="projectCode">
  458. <el-input v-model="datahousehold.village" autocomplete="off"></el-input>
  459. </el-form-item>
  460. <el-form-item label="门牌号" class="msg" label-width="180px" prop="projectCode">
  461. <el-input v-model="datahousehold.oldHouseAddress" autocomplete="off">
  462. </el-input>
  463. </el-form-item>
  464. <el-form-item label="房屋用地面积(m²)" class="msg" label-width="180px" prop="projectCode">
  465. <el-input v-model="datahousehold.housingLandArea" autocomplete="off">
  466. </el-input>
  467. </el-form-item>
  468. <el-form-item label="被拆迁人总用地面积(m²)" class="msg" label-width="180px"
  469. prop="projectCode">
  470. <el-input v-model="datahousehold.totalLandArea" autocomplete="off">
  471. </el-input>
  472. </el-form-item>
  473. </el-form>
  474. </div>
  475. </el-collapse-item>
  476. <el-collapse-item title="生产经营用房面积核定信息" name="4">
  477. <div class="form">
  478. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  479. <el-form-item label="姓名" class="msg" label-width="220px" prop="projectCode">
  480. <el-input v-model="datahousehold.householderName" autocomplete="off">
  481. </el-input>
  482. </el-form-item>
  483. <el-form-item label="被拆迁人性别" class="msg" label-width="220px" prop="projectCode">
  484. <el-input v-model="datahousehold.sex" autocomplete="off"></el-input>
  485. </el-form-item>
  486. <el-form-item label="出生日期" class="msg" label-width="220px" prop="projectCode">
  487. <el-date-picker type="date" value-format="yyyy-MM-dd" placeholder="选择日期"
  488. v-model="datahousehold.birthday" style="width: 100%;"></el-date-picker>
  489. </el-form-item>
  490. <el-form-item label="联系电话" class="msg" label-width="220px" prop="projectCode">
  491. <el-input v-model="datahousehold.phone" autocomplete="off"></el-input>
  492. </el-form-item>
  493. <el-form-item label="企业名称" class="msg" label-width="220px" prop="projectCode">
  494. <el-input v-model="datahousehold.enterpriseName" autocomplete="off">
  495. </el-input>
  496. </el-form-item>
  497. <el-form-item label="企业性质" class="msg" label-width="220px" prop="projectCode">
  498. <el-input v-model="datahousehold.enterpriseNature" autocomplete="off">
  499. </el-input>
  500. </el-form-item>
  501. <el-form-item label="经营地址" class="msg" label-width="220px" prop="projectCode">
  502. <el-input v-model="datahousehold.businessAddress" autocomplete="off">
  503. </el-input>
  504. </el-form-item>
  505. <el-form-item label="经营项目" class="msg" label-width="220px" prop="projectCode">
  506. <el-input v-model="datahousehold.businessItems" autocomplete="off">
  507. </el-input>
  508. </el-form-item>
  509. <el-form-item label="初始登记时间" class="msg" label-width="220px" prop="projectCode">
  510. <el-date-picker type="date" value-format="yyyy-MM-dd" placeholder="选择日期"
  511. v-model="datahousehold.registrationTime" style="width: 100%;">
  512. </el-date-picker>
  513. </el-form-item>
  514. <el-form-item label="营业执照号码" class="msg" label-width="220px" prop="projectCode">
  515. <el-input v-model="datahousehold.businessLicense" autocomplete="off">
  516. </el-input>
  517. </el-form-item>
  518. <el-form-item label="拆迁公告发布前6个月纳税情况" class="msg" label-width="220px"
  519. prop="projectCode">
  520. <el-input v-model="datahousehold.taxPayment" autocomplete="off"></el-input>
  521. </el-form-item>
  522. <el-form-item label="从事生产经营活动房屋间数" class="msg" label-width="220px"
  523. prop="projectCode">
  524. <el-input v-model="datahousehold.businessHouseRoom" autocomplete="off">
  525. </el-input>
  526. </el-form-item>
  527. <el-form-item label="从事生产经营活动房屋面积(m²)" class="msg" label-width="220px"
  528. prop="projectCode">
  529. <el-input v-model="datahousehold.businessHouseArea" autocomplete="off">
  530. </el-input>
  531. </el-form-item>
  532. </el-form>
  533. </div>
  534. </el-collapse-item>
  535. <el-collapse-item title="被拆迁安置人口、可安置面积认定信息" name="5">
  536. <div class="form">
  537. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  538. <el-form-item label="可计入安置人口" class="msg" label-width="300px"
  539. prop="projectCode">
  540. <el-input v-model="datahousehold.population"
  541. oninput="value=value.replace(/^d+$/,'')" autocomplete="off">
  542. </el-input>
  543. </el-form-item>
  544. <el-form-item label="可增加安置人口" class="msg" label-width="300px"
  545. prop="projectCode">
  546. <el-input v-model="datahousehold.increasePopulation" autocomplete="off">
  547. </el-input>
  548. </el-form-item>
  549. <el-form-item label="仅育一个子女,该子女未婚增加安置人数" class="msg" label-width="300px"
  550. prop="projectCode">
  551. <el-input v-model="datahousehold.onlyChildAndUnmarried"
  552. oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off">
  553. </el-input>
  554. </el-form-item>
  555. <el-form-item label="已满18周岁未满法定婚龄增加人数" class="msg" label-width="300px"
  556. prop="projectCode">
  557. <el-input v-model="datahousehold.underMarriageAge"
  558. oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off">
  559. </el-input>
  560. </el-form-item>
  561. <el-form-item label="已满法定婚龄未婚增加人数" class="msg" label-width="300px"
  562. prop="projectCode">
  563. <el-input v-model="datahousehold.marriageableAgeAndUnmarried"
  564. oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off">
  565. </el-input>
  566. </el-form-item>
  567. <el-form-item label="已婚未生育增加人数" class="msg" label-width="300px"
  568. prop="projectCode">
  569. <el-input v-model="datahousehold.marriedNotBearing"
  570. oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off">
  571. </el-input>
  572. </el-form-item>
  573. <el-form-item label="合计安置人口" class="msg" label-width="300px" prop="projectCode">
  574. <el-input v-model="datahousehold.populationTotal"
  575. oninput="value=value.replace(/[^\d]/g,'')" autocomplete="off">
  576. </el-input>
  577. </el-form-item>
  578. <el-form-item label="被拆迁人可安置面积(m²)" class="msg" label-width="300px"
  579. prop="projectCode">
  580. <el-input v-model="datahousehold.resettlementArea" autocomplete="off">
  581. </el-input>
  582. </el-form-item>
  583. <el-form-item label="补助建筑面积(m²)" class="msg" label-width="300px" prop="projectCode">
  584. <el-input v-model="datahousehold.subsidyArea" autocomplete="off">
  585. </el-input>
  586. </el-form-item>
  587. <el-form-item label="享受过保障性住房面积(m²)" class="msg" label-width="300px"
  588. prop="projectCode">
  589. <el-input v-model="datahousehold.indemnificatoryHousingArea"
  590. autocomplete="off">
  591. </el-input>
  592. </el-form-item>
  593. <el-form-item label="应当合并计算或扣减的面积(m²)" class="msg" label-width="300px"
  594. prop="projectCode">
  595. <el-input v-model="datahousehold.deductArea" autocomplete="off">
  596. </el-input>
  597. </el-form-item>
  598. <el-form-item label="其中可安置面积合并或扣减应分摊的面积(m²)" class="msg" label-width="300px"
  599. prop="projectCode">
  600. <el-input v-model="datahousehold.share1" autocomplete="off">
  601. </el-input>
  602. </el-form-item>
  603. <el-form-item label="补助面积合并或扣减应分摊的面积(m²)" class="msg" label-width="300px"
  604. prop="projectCode">
  605. <el-input v-model="datahousehold.share2" autocomplete="off">
  606. </el-input>
  607. </el-form-item>
  608. <el-form-item label="实际可安置面积(m²)" class="msg" label-width="300px"
  609. prop="projectCode">
  610. <el-input v-model="datahousehold.realPlaceArea" autocomplete="off">
  611. </el-input>
  612. </el-form-item>
  613. <el-form-item label="实际总可安置面积(m²)" class="msg" label-width="300px"
  614. prop="projectCode">
  615. <el-input v-model="datahousehold.resettlementAreaTotal" autocomplete="off">
  616. </el-input>
  617. </el-form-item>
  618. <el-form-item label="被拆房屋建筑面积人均不足30平方米部分(m²)" class="msg" label-width="300px"
  619. prop="projectCode">
  620. <el-input v-model="datahousehold.perCapitaLt30Area" autocomplete="off">
  621. </el-input>
  622. </el-form-item>
  623. <el-form-item label="安置地基间数" class="msg" label-width="300px" prop="projectCode">
  624. <el-input v-model="datahousehold.placeFoundationRoom" autocomplete="off">
  625. </el-input>
  626. </el-form-item>
  627. <el-form-item label="建筑占地面积(m²)" class="msg" label-width="300px" prop="projectCode">
  628. <el-input v-model="datahousehold.placeFoundationBuildingArea"
  629. autocomplete="off">
  630. </el-input>
  631. </el-form-item>
  632. <el-form-item label="宗地面积(m²)" class="msg" label-width="300px" prop="projectCode">
  633. <el-input v-model="datahousehold.placeFoundationParcelArea"
  634. autocomplete="off">
  635. </el-input>
  636. </el-form-item>
  637. <el-form-item label="不予安置建筑占地面积(m²)" class="msg" label-width="300px"
  638. prop="projectCode">
  639. <el-input v-model.number="datahousehold.noResettlementBuildingAreaCovered"
  640. autocomplete="off"></el-input>
  641. </el-form-item>
  642. <el-form-item label="不予安置建筑面积(m²)" class="msg" label-width="300px"
  643. prop="projectCode">
  644. <el-input v-model.number="datahousehold.noResettlementBuildingArea"
  645. autocomplete="off"></el-input>
  646. </el-form-item>
  647. <el-form-item label="迁建-安置地段等级" label-width="300px" prop="projectName">
  648. <el-select placeholder="请选择地段等级"
  649. v-model="datahousehold.resettlementSectionGrade" clearable
  650. style="width: 100%;">
  651. <el-option label="一类" value="一"></el-option>
  652. <el-option label="二类" value="二"></el-option>
  653. <el-option label="三类" value="三"></el-option>
  654. <el-option label="四类" value="四"></el-option>
  655. </el-select>
  656. </el-form-item>
  657. </el-form>
  658. </div>
  659. </el-collapse-item>
  660. <!-- <el-collapse-item title="迁建安置认定信息" name="6">
  661. <div class="form">
  662. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  663. <el-form-item label="迁建安置用地坐落" class="msg" label-width="220px"
  664. prop="projectCode" style="width: 100%;">
  665. <el-input v-model.number="datahousehold.resettlementAddress"
  666. autocomplete="off"></el-input>
  667. </el-form-item>
  668. <el-form-item label="迁建安置间数" class="msg" label-width="220px" prop="projectCode">
  669. <el-input v-model.number="datahousehold.numberOfFoundation"
  670. autocomplete="off"></el-input>
  671. </el-form-item>
  672. <el-form-item label="建筑占地面积(m²)" class="msg" label-width="220px"
  673. prop="projectCode">
  674. <el-input v-model.number="datahousehold.areaOfFoundation"
  675. autocomplete="off"></el-input>
  676. </el-form-item>
  677. <el-form-item label="宗地面积合计(m²)" class="msg" label-width="220px"
  678. prop="projectCode">
  679. <el-input v-model.number="datahousehold.totalResettlementArea"
  680. autocomplete="off"></el-input>
  681. </el-form-item>
  682. <el-form-item label="东西间隔" class="msg" label-width="220px" prop="projectCode">
  683. <el-input v-model.number="datahousehold.distanceEastWest"><template
  684. slot="append">米</template></el-input>
  685. </el-form-item>
  686. <el-form-item label="南北间隔" class="msg" label-width="220px" prop="projectCode">
  687. <el-input v-model.number="datahousehold.distanceNorthSouth"><template
  688. slot="append">米</template></el-input>
  689. </el-form-item>
  690. </el-form>
  691. </div>
  692. </el-collapse-item> -->
  693. <el-collapse-item title="评估结果" name="6">
  694. <div class="form">
  695. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  696. <el-form-item label="产权人" label-width="305px" prop="projectCode"
  697. style="width: 100%;">
  698. <el-input v-model="datahousehold.householderName" autocomplete="off">
  699. </el-input>
  700. </el-form-item>
  701. <el-form-item label="被迁房屋面积(㎡)-主体" label-width="305px" prop="projectCode"
  702. style="width: 100%;">
  703. <el-input v-model="datahousehold.buildArea" autocomplete="off">
  704. </el-input>
  705. </el-form-item>
  706. <el-form-item label="被迁房屋面积(㎡)-斜面" label-width="305px" prop="projectName"
  707. style="width: 100%;">
  708. <el-input v-model="datahousehold.slopeBuildArea" autocomplete="off">
  709. </el-input>
  710. </el-form-item>
  711. <el-form-item label="被迁主体房屋补偿金额(元)-重置价" label-width="305px" prop="projectCode"
  712. style="width: 100%;">
  713. <el-input v-model="datahousehold.houseSubjectCompensateChongzhijia"
  714. autocomplete="off">
  715. </el-input>
  716. </el-form-item>
  717. <el-form-item label="被迁主体房屋补偿金额(元)-重置价结合成新" label-width="305px"
  718. prop="projectName" style="width: 100%;">
  719. <el-input
  720. v-model="datahousehold.houseSubjectCompensateChongzhijiajiehechengxin"
  721. autocomplete="off">
  722. </el-input>
  723. </el-form-item>
  724. <el-form-item label="被迁斜面结构屋补偿金额(元)-重置价" label-width="305px" prop="projectCode"
  725. style="width: 100%;">
  726. <el-input v-model="datahousehold.houseSlopeCompensateChongzhijia"
  727. autocomplete="off">
  728. </el-input>
  729. </el-form-item>
  730. <el-form-item label="被迁斜面结构屋补偿金额(元)-重置价结合成新" label-width="305px"
  731. prop="projectName" style="width: 100%;">
  732. <el-input
  733. v-model="datahousehold.houseSlopeCompensateChongzhijiajiehechengxin"
  734. autocomplete="off">
  735. </el-input>
  736. </el-form-item>
  737. <el-form-item label="被拆屋建筑面积超可安置面积部分货币补偿" label-width="305px" prop="projectName"
  738. style="width: 100%;">
  739. <el-input v-model="datahousehold.housesExceedingTheResettableAreaCompensate"
  740. autocomplete="off">
  741. </el-input>
  742. </el-form-item>
  743. <el-form-item label="被拆房屋建筑面积人均不足30㎡部分补偿" label-width="305px" prop="projectName"
  744. style="width: 100%;">
  745. <el-input v-model="datahousehold.perCapitaLt30AreaCompensate"
  746. autocomplete="off">
  747. </el-input>
  748. </el-form-item>
  749. <el-form-item label="装修及附属物补偿金额(元)" label-width="305px" prop="projectName"
  750. style="width: 100%;">
  751. <el-input v-model="datahousehold.renovationCompensate" autocomplete="off">
  752. </el-input>
  753. </el-form-item>
  754. <el-form-item label="从事生产经营活动经济补偿(元)" label-width="305px" prop="projectName"
  755. style="width: 100%;">
  756. <el-input v-model="datahousehold.productionCompensate" autocomplete="off">
  757. </el-input>
  758. </el-form-item>
  759. <el-form-item label="备注" label-width="305px" prop="projectName"
  760. style="width: 100%;">
  761. <el-input v-model="datahousehold.evaluationResultsRemarks"
  762. autocomplete="off">
  763. </el-input>
  764. </el-form-item>
  765. </el-form>
  766. </div>
  767. </el-collapse-item>
  768. </div>
  769. <div v-if="datahousehold.levyHouseNature=='非住宅'">
  770. <el-collapse-item title="非住宅认定信息" name="2">
  771. <div class="form">
  772. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  773. <el-form-item label="土地用途" class="msg" label-width="200px" prop="projectCode">
  774. <el-input v-model="datahousehold.nonResidentialLandUse" autocomplete="off">
  775. </el-input>
  776. </el-form-item>
  777. <el-form-item label="土地面积(㎡)" class="msg" label-width="200px" prop="projectCode">
  778. <el-input v-model="datahousehold.nonResidentialLandArea" autocomplete="off">
  779. </el-input>
  780. </el-form-item>
  781. <el-form-item label="房屋建筑面积(㎡)" class="msg" label-width="200px" prop="projectCode">
  782. <el-input v-model="datahousehold.nonResidentialBuildArea" autocomplete="off">
  783. </el-input>
  784. </el-form-item>
  785. <el-form-item label="商业建筑面积(㎡)" class="msg" label-width="200px" prop="projectCode">
  786. <el-input v-model="datahousehold.nonResidentialBusinessArea" autocomplete="off">
  787. </el-input>
  788. </el-form-item>
  789. <el-form-item label="办公建筑面积(㎡)" class="msg" label-width="200px" prop="projectCode">
  790. <el-input v-model="datahousehold.nonResidentialWorkArea" autocomplete="off">
  791. </el-input>
  792. </el-form-item>
  793. <el-form-item label="工业建筑面积(㎡)" class="msg" label-width="200px" prop="projectCode">
  794. <el-input v-model="datahousehold.nonResidentialIndustryArea" autocomplete="off">
  795. </el-input>
  796. </el-form-item>
  797. <el-form-item label="被拆房屋评估价值" class="msg" label-width="200px" prop="projectCode">
  798. <el-input v-model="datahousehold.nonResidentialHouseAssessment" autocomplete="off">
  799. </el-input>
  800. </el-form-item>
  801. <el-form-item label="装修、附属物补偿费金额" class="msg" label-width="200px" prop="projectCode">
  802. <el-input v-model="datahousehold.nonResidentialRenovationCompensate" autocomplete="off">
  803. </el-input>
  804. </el-form-item>
  805. </el-form>
  806. </div>
  807. </el-collapse-item>
  808. </div>
  809. <el-collapse-item title="腾房/注销/付款情况说明" name="8" v-if="switchi==2">
  810. <div class="form">
  811. <el-form :model="strpdetails" :disabled='agreementSigningStatus=="已签约"'>
  812. <el-form-item label="腾房情况说明" label-width="150px" prop="projectCode"
  813. style="width: 100%;">
  814. <el-input v-model='datahousehold.vacateRemarks' type="textarea" :rows="4"
  815. placeholder="请输入情况说明" style="width: 100%;">
  816. </el-input>
  817. </el-form-item>
  818. <el-form-item label="注销情况说明" label-width="150px" prop="projectCode"
  819. style="width: 100%;">
  820. <el-input v-model='datahousehold.cancellationRemarks' type="textarea"
  821. :rows="4" placeholder="请输入情况说明" style="width: 100%;">
  822. </el-input>
  823. </el-form-item>
  824. <el-form-item label="付款情况说明" label-width="150px" prop="projectCode"
  825. style="width: 100%;">
  826. <el-input v-model='datahousehold.paymentRemarks' type="textarea" :rows="4"
  827. placeholder="请输入情况说明" style="width: 100%;">
  828. </el-input>
  829. </el-form-item>
  830. </el-form>
  831. </div>
  832. </el-collapse-item>
  833. </el-collapse>
  834. </div>
  835. <div class="tc-middle-add">
  836. <h3>家庭成员:</h3>
  837. <el-button :disabled='authority==1' size="mini" type="primary" @click="empty()">新增</el-button>
  838. </div>
  839. <div class="WithoutInterval">
  840. <el-table :data="peopledata" :header-cell-style="{background:'#e2e2e2'}" style="width: 100%">
  841. <el-table-column prop="name" label="姓名">
  842. </el-table-column>
  843. <el-table-column prop="relation" label="关系">
  844. </el-table-column>
  845. <el-table-column prop="idCard" label="身份证号">
  846. </el-table-column>
  847. <el-table-column fixed="right" label="操作" width="130">
  848. <template slot-scope="scope">
  849. <el-button @click="updateProject(scope.row)" type="text" size="small"
  850. :disabled='authority==1'>
  851. 编辑</el-button>
  852. <el-button @click="deleteProject(scope.row)" type="text" size="small"
  853. :disabled='authority==1' style="color: #FF4500 ;">
  854. 删除</el-button>
  855. </template>
  856. </el-table-column>
  857. </el-table>
  858. </div>
  859. <div class="dialog-footer" style="margin: 20px auto;">
  860. <el-button :disabled="agreementSigningStatus=='已签约'" type="primary" @click='edithousehold()'>保 存
  861. </el-button>
  862. <el-button @click='sethousehold=false'>取消</el-button>
  863. </div>
  864. </div>
  865. <div class="nrya" style="width: 100%;height: calc(100% - 112px);" v-if="householdindex==1">
  866. <file-manage type="2" :fileId='householdId' ref="file" :currentContro='currentContro' :loadFileList='loadFileList' :authority='2'>
  867. </file-manage>
  868. </div>
  869. <div class="agreement" v-if="householdindex==2">
  870. <div class="agreement-lest">
  871. <div class="PlanningLibrary-left">
  872. <div class="PlanningLibrary-left-top">
  873. <div class="PlanningLibrary-left-top-right">
  874. <i class="el-icon-info"></i><span>公示列表</span>
  875. </div>
  876. </div>
  877. <div class="PlanningLibrary-left-data">
  878. <ul>
  879. <li :class="AgreementIndex==0?'Check':''" @click="AgreementIndex=0"><i
  880. class="el-icon-menu"></i>
  881. <Tooltip text="被拆迁房屋土地使用权面积和建筑面积认定书"></Tooltip>
  882. </li>
  883. <li :class="AgreementIndex==1?'Check':''" @click="AgreementIndex=1"><i
  884. class="el-icon-menu"></i>
  885. <Tooltip text="被拆迁房屋用地面积认定表"></Tooltip>
  886. </li>
  887. <li :class="AgreementIndex==2?'Check':''" @click="AgreementIndex=2"><i
  888. class="el-icon-menu"></i>
  889. <Tooltip text="被拆迁人安置人口、可安置面积认定"></Tooltip>
  890. </li>
  891. <li :class="AgreementIndex==3?'Check':''" @click="AgreementIndex=3"><i
  892. class="el-icon-menu"></i>
  893. <Tooltip text="生产经营用房面积核定表"></Tooltip>
  894. </li>
  895. <li :class="AgreementIndex==4?'Check':''" @click="AgreementIndex=4"><i
  896. class="el-icon-menu"></i>
  897. <Tooltip text="集体所有土地房屋签订拆迁协议审批流程表(不含迁建安置)"></Tooltip>
  898. </li>
  899. <!-- <li :class="AgreementIndex==5?'Check':''" @click="AgreementIndex=5"><i
  900. class="el-icon-menu"></i>
  901. <Tooltip text="集体所有土地房屋签订拆迁协议审批流程表(含迁建安置)"></Tooltip>
  902. </li> -->
  903. <li :class="AgreementIndex==15?'Check':''" @click="AgreementIndex=15"><i
  904. class="el-icon-menu"></i>
  905. <Tooltip text="被拆房屋建筑面积、安置人口、可安置面积等综合认定审批表"></Tooltip>
  906. </li>
  907. <!-- <li :class="AgreementIndex==6?'Check':''" @click="AgreementIndex=6"><i class="el-icon-menu"></i>
  908. <Tooltip text="征收集体所有土地房屋拆迁调产安置(房票)补偿明细单 "></Tooltip>
  909. </li>
  910. <li :class="AgreementIndex==7?'Check':''" @click="AgreementIndex=7"><i class="el-icon-menu"></i>
  911. <Tooltip text="征收集体所有土地房屋拆迁货币安置补偿明细单"></Tooltip>
  912. </li>
  913. <li :class="AgreementIndex==8?'Check':''" @click="AgreementIndex=8"><i class="el-icon-menu"></i>
  914. <Tooltip text="征收集体所有土地房屋拆迁迁建安置补偿明细单"></Tooltip>
  915. </li>
  916. <li :class="AgreementIndex==9?'Check':''" @click="AgreementIndex=9"><i class="el-icon-menu"></i>
  917. <Tooltip text="被拆迁房屋腾空确认书 "></Tooltip>
  918. </li>
  919. <li :class="AgreementIndex==10?'Check':''" @click="AgreementIndex=10"><i class="el-icon-menu"></i>
  920. <Tooltip text="征收集体所有土地房屋拆迁调产安置补偿协议(房票安置)"></Tooltip>
  921. </li> -->
  922. </ul>
  923. </div>
  924. </div>
  925. </div>
  926. <div class="agreement-right">
  927. <agreement :agreement='AgreementIndex' :datahousehold='datahousehold'
  928. :strpdetails='strpdetails'></agreement>
  929. </div>
  930. </div>
  931. </el-drawer>
  932. </div>
  933. <!-- 新增 编辑 家庭成员 -->
  934. <div class="al">
  935. <el-drawer size='40%' :title="Demolitions.id?'编辑':'新增'" :visible.sync="member">
  936. <div class="form">
  937. <el-form :model="Demolitions" :rules="rules" ref="Demolition">
  938. <el-form-item label="姓名" label-width="160px" prop="name">
  939. <el-input v-model="Demolitions.name" autocomplete="off"></el-input>
  940. </el-form-item>
  941. <el-form-item label="身份证号" label-width="160px" prop="idCard">
  942. <el-input v-model="Demolitions.idCard" autocomplete="off"></el-input>
  943. </el-form-item>
  944. <el-form-item label="家庭成员关系" label-width="160px">
  945. <el-input v-model="Demolitions.relation" autocomplete="off"></el-input>
  946. </el-form-item>
  947. <el-form-item label="农/居身份" label-width="160px">
  948. <el-select v-model="Demolitions.householdNature" placeholder="请选择" clearable>
  949. <el-option label="居民" value="居民"></el-option>
  950. <el-option label="农民" value="农民"></el-option>
  951. <el-option label="参照农民" value="参照农民"></el-option>
  952. </el-select>
  953. </el-form-item>
  954. <el-form-item label="户口迁入时间" label-width="160px">
  955. <el-col>
  956. <el-date-picker value-format="yyyy-MM-dd" type="date" placeholder="选择日期"
  957. v-model="Demolitions.joinHouseholdTime" style="width: 100%;"></el-date-picker>
  958. </el-col>
  959. </el-form-item>
  960. <el-form-item label="被拆迁房屋来源" label-width="160px">
  961. <!-- <el-input v-model="Demolitions.houseOwnershipSource" autocomplete="off"></el-input> -->
  962. <el-select v-model="Demolitions.houseOwnershipSource" placeholder="请选择" clearable>
  963. <el-option label="继承" value="继承"></el-option>
  964. <el-option label="初始登记" value="初始登记"></el-option>
  965. <el-option label="分户析产" value="分户析产"></el-option>
  966. <el-option label="个人建房审批" value="个人建房审批"></el-option>
  967. <el-option label="其他" value="其他"></el-option>
  968. </el-select>
  969. </el-form-item>
  970. <el-form-item label="是否独生子女" label-width="160px">
  971. <el-select v-model="Demolitions.onlyChild" placeholder="请选择" clearable>
  972. <el-option v-for="(item,index) in options" :key="index" :label="item.label"
  973. :value="item.value">
  974. </el-option>
  975. </el-select>
  976. </el-form-item>
  977. <el-form-item label="婚否" label-width="160px">
  978. <el-select v-model="Demolitions.marriedNotBearing" placeholder="请选择" clearable>
  979. <el-option v-for="(item,index) in options" :key="index" :label="item.label"
  980. :value="item.value">
  981. </el-option>
  982. </el-select>
  983. </el-form-item>
  984. <el-form-item label="是否享受住房保障" label-width="160px">
  985. <el-select v-model="Demolitions.enjoyedWlfSituation" placeholder="请选择" clearable>
  986. <el-option v-for="(item,index) in options" :key="index" :label="item.label"
  987. :value="item.value">
  988. </el-option>
  989. </el-select>
  990. </el-form-item>
  991. <el-form-item label="排序" label-width="160px" prop="req">
  992. <el-input v-model="Demolitions.req" autocomplete="off"></el-input>
  993. </el-form-item>
  994. <el-form-item label="备注" label-width="160px" style="width: 100%;">
  995. <el-input v-model="Demolitions.remarks" autocomplete="off"></el-input>
  996. </el-form-item>
  997. </el-form>
  998. </div>
  999. <div class="dialog-footer">
  1000. <el-button type="primary" @click="determine('Demolition')">确 定</el-button>
  1001. <el-button @click="member = false">取消</el-button>
  1002. </div>
  1003. </el-drawer>
  1004. </div>
  1005. <!-- 导入错误 -->
  1006. <div class="tk">
  1007. <el-dialog title="错误" :visible.sync="errorControl" width="35%" max-width='350px'>
  1008. <div style="max-height: 250px;overflow: auto;">
  1009. <span style="color: red;margin-bottom: 5px;display: block;"
  1010. v-for="(item,index) in errorData" :key="index">{{item}}<br></span>
  1011. </div>
  1012. </el-dialog>
  1013. </div>
  1014. <!-- 签约审核 -->
  1015. <div class="tk">
  1016. <el-dialog title="签约审核" :visible.sync="ExamineControl" width="30%">
  1017. <div class="indexControl">
  1018. <div class="indexControl-ont">
  1019. <div class="indexControl-ont-title">是否公示</div>
  1020. <ul>
  1021. <li>
  1022. <div>
  1023. <div v-if="getexaminefileid.publicityOneState=='已公示'"><img
  1024. src="../../../../assets/file-publicity1.png" alt=""></div>
  1025. <div v-else><img src="../../../../assets/file-publicity2.png" alt=""></div>
  1026. <span>房屋评估公示表</span>
  1027. <p
  1028. :style="{'background-color':(getexaminefileid.publicityOneState=='已公示'?'#55bf9c':'#ff703b')}">
  1029. {{getexaminefileid.publicityOneState}}</p>
  1030. </div>
  1031. </li>
  1032. <li>
  1033. <div>
  1034. <div v-if="getexaminefileid.publicityTwoState=='已公示'"><img
  1035. src="../../../../assets/file-publicity1.png" alt=""></div>
  1036. <div v-else><img src="../../../../assets/file-publicity2.png" alt=""></div>
  1037. <span>安置情况公示表</span>
  1038. <p
  1039. :style="{'background-color':(getexaminefileid.publicityTwoState=='已公示'?'#55bf9c':'#ff703b')}">
  1040. {{getexaminefileid.publicityTwoState}}</p>
  1041. </div>
  1042. </li>
  1043. </ul>
  1044. </div>
  1045. <div class="indexControl-ont">
  1046. <div class="indexControl-ont-title">文件列表</div>
  1047. <ul>
  1048. <li v-for="(i,index) in fileList" :key="index" @click="getfileList(i)">
  1049. <div>
  1050. <div v-if="i.tree.length!=0"><img src="../../../../assets/file-full.png" alt="">
  1051. </div>
  1052. <div v-if="i.tree.length==0"><img src="../../../../assets/file-empty.png" alt="">
  1053. </div>
  1054. <h2 class="tooltip-wrap">
  1055. <Tooltip :text="i.name"></Tooltip>
  1056. </h2>
  1057. <p :style="{'background-color':(i.tree.length==0?'#ff703b':'#55bf9c')}">
  1058. {{i.tree.length!=0?'已上传':'未上传'}}</p>
  1059. </div>
  1060. </li>
  1061. </ul>
  1062. </div>
  1063. </div>
  1064. <span slot="footer" class="dialog-footer">
  1065. <el-button @click="ExamineControl = false">取消</el-button>
  1066. <el-button type="primary" @click="VacateExamine()">审核通过</el-button>
  1067. </span>
  1068. </el-dialog>
  1069. </div>
  1070. <!-- 签约审核文件预览 -->
  1071. <div class="tk">
  1072. <el-dialog v-if="Examine" :title="fileListindex[0].name" :visible.sync="Examine" width="50%">
  1073. <div class="toexamine">
  1074. <div class="nrya">
  1075. <div class="rt-nr">
  1076. <el-tree :data="fileListindex" ref="tree" :props="defaultProp" current-node-key="1"
  1077. node-key="id" @node-click="nodeClic" default-expand-all>
  1078. <div class="custom-tree-node" slot-scope="{ node, data}"
  1079. style="width: 100%;padding-left: 18px;">
  1080. <div style="width: 100%;display: flex;align-items:end;height: 20px; padding: 0;">
  1081. <span v-if="data.tree==null&&data.type=='file'">
  1082. <img v-if="node.label.split('.').pop().toLowerCase()=='png'||node.label.split('.').pop().toLowerCase()=='jpg'"
  1083. src="../../../../assets/file-Imgicon.png">
  1084. <img v-else-if="node.label.split('.').pop().toLowerCase()=='pdf'"
  1085. src="../../../../assets/file-pdficon.png">
  1086. <img v-else-if="node.label.split('.').pop().toLowerCase()=='xls'||node.label.split('.').pop().toLowerCase()=='xlsx'"
  1087. src="../../../../assets/flie-xlsxicon.png">
  1088. <img v-else-if="node.label.split('.').pop().toLowerCase()=='docx'"
  1089. src="../../../../assets/file-docxicon.png">
  1090. <img v-else-if="node.label.split('.').pop().toLowerCase()=='text'||node.label.split('.').pop().toLowerCase()=='txt'"
  1091. src="../../../../assets/flie-texticon.png">
  1092. <img v-else src="../../../../assets/flie-othericon.png">
  1093. </span>
  1094. <span v-else>
  1095. <img :src="data.empty ? defaultClose : defaultOpen"
  1096. style="width: 16px;height: 16px;" alt />
  1097. <img src="../../../../assets/folderIcon.png" style="margin: 0 0 0 7px;">
  1098. </span>
  1099. <span class="tooltip-wrap">
  1100. <Tooltip :text="node.label"></Tooltip>
  1101. </span>
  1102. <span class="fbtn"
  1103. :style="{'display': (data.type == 'file' ? '':'none !important')}"
  1104. @click.stop="downFile(data)">下载</span>
  1105. </div>
  1106. </div>
  1107. </el-tree>
  1108. </div>
  1109. <div class="rt-nt">
  1110. <iframe :src="dataurl" width="100%" height="100%"></iframe>
  1111. </div>
  1112. </div>
  1113. </div>
  1114. </el-dialog>
  1115. </div>
  1116. <!-- 腾房 注销 付款 -->
  1117. <div class="tk">
  1118. <el-dialog :title="getexaminefileid.householderName" :visible.sync="control" width="700px"
  1119. :modal-append-to-body="false">
  1120. <div class="operation">
  1121. <div class="branch">
  1122. <div class="Upload-butom-ont">
  1123. <div class="Upload-butom-tow" v-if="selectFileName!='发放发票'">
  1124. <h3>{{selectFileName}}日期:</h3>
  1125. <el-date-picker v-if="selectFileName=='腾房'" value-format="yyyy-MM-dd" type="date"
  1126. placeholder="选择日期" v-model="vacatedDate" style="width: 250px;"></el-date-picker>
  1127. <el-date-picker v-if="selectFileName=='注销'" value-format="yyyy-MM-dd" type="date"
  1128. placeholder="选择日期" v-model="cancellationDate" style="width: 250px;">
  1129. </el-date-picker>
  1130. <el-date-picker v-if="selectFileName=='付款'" value-format="yyyy-MM-dd" type="date"
  1131. placeholder="选择日期" v-model="paymentDate" style="width: 250px;"></el-date-picker>
  1132. </div>
  1133. <div class="tc-middle-add">
  1134. <h3 :class="this.selectFileName!='注销'?'apse':''">{{this.selectFileName}}凭证:</h3>
  1135. </div>
  1136. <div class="tc-middle-name">
  1137. <ul>
  1138. <li v-for="itemid in filelist.tree" :key="itemid.name" @click="nodeClic(itemid),Exconrtl=true">
  1139. <i class="el-icon-error" @click.stop="deleteFile(itemid)"></i>
  1140. <img v-if="itemid.name.split('.').pop().toLowerCase()=='pdf'"
  1141. src="../../../../assets/file-pdf.png" alt="">
  1142. <img v-else-if="itemid.name.split('.').pop().toLowerCase()=='png'||itemid.name.split('.').pop().toLowerCase()=='jpg'"
  1143. src="../../../../assets/file-img.png" alt="">
  1144. <img v-else-if="itemid.name.split('.').pop().toLowerCase()=='text'"
  1145. src="../../../../assets/file-excel.png" alt="">
  1146. <img v-else src="../../../../assets/file-other.png">
  1147. <div>
  1148. <Tooltip :text="itemid.name"></Tooltip>
  1149. </div>
  1150. </li>
  1151. <el-upload action='' :auto-upload="false" :headers="tokenData"
  1152. :on-change="handleChang" :show-file-list="false">
  1153. <li>
  1154. <div class="add">
  1155. <div class="add-top">
  1156. <span class="el-icon-plus"></span>
  1157. </div>
  1158. <div class="add-buttom">
  1159. 添加文件
  1160. </div>
  1161. </div>
  1162. </li>
  1163. </el-upload>
  1164. </ul>
  1165. </div>
  1166. </div>
  1167. <div class="Upload-butom-ont">
  1168. <div class="tc-middle-add">
  1169. <h3>情况说明:</h3>
  1170. </div>
  1171. <div class="tc-middle-name">
  1172. <div class="form" style="padding: 0;">
  1173. <el-form :model="Demolitions">
  1174. <el-form-item label="情况说明" label-width="130px" style="width: 100%;">
  1175. <el-input v-model='Reremar' type="textarea" :rows="4" placeholder="请输入情况说明"
  1176. style="width: 100%;"></el-input>
  1177. </el-form-item>
  1178. </el-form>
  1179. </div>
  1180. </div>
  1181. </div>
  1182. </div>
  1183. <span slot="footer" class="dialog-footer">
  1184. <el-button type="primary" @click="Vacate()">确 定</el-button>
  1185. <el-button @click="control = false">取 消</el-button>
  1186. </span>
  1187. </div>
  1188. </el-dialog>
  1189. </div>
  1190. <!-- 查询条件 -->
  1191. <div class="tk">
  1192. <el-dialog title="更多筛选" :visible.sync="query" width="500px" :modal-append-to-body="false">
  1193. <div class="form">
  1194. <el-form>
  1195. <el-form-item label="户主身份证号码" label-width="130px" style="width: 100%;">
  1196. <el-input v-model="householderIdCard" placeholder="请输入户主身份证号码" clearable></el-input>
  1197. </el-form-item>
  1198. <el-form-item label="安置方式" label-width="130px" style="width: 100%;" v-if="switchi>0">
  1199. <el-select v-model="flowState" placeholder="请选择安置方式" clearable style="width: 100%;">
  1200. <el-option label="货币安置" value="货币"></el-option>
  1201. <el-option label="迁建安置" value="迁建"></el-option>
  1202. <el-option label="混合安置" value="混合"></el-option>
  1203. </el-select>
  1204. </el-form-item>
  1205. <el-form-item label="注销状态" label-width="130px" style="width: 100%;" v-if="switchi>1">
  1206. <el-select v-model="cancellationState" placeholder="请选择注销状态" clearable style="width: 100%;">
  1207. <el-option label="未注销" value="未注销"></el-option>
  1208. <el-option label="已注销" value="已注销"></el-option>
  1209. </el-select>
  1210. </el-form-item>
  1211. <el-form-item label="付款状态" label-width="130px" style="width: 100%;" v-if="switchi>1">
  1212. <el-select v-model="paymentState" placeholder="请选择付款状态" clearable style="width: 100%;">
  1213. <el-option label="未付款" value="未付款"></el-option>
  1214. <el-option label="已付款" value="已付款"></el-option>
  1215. </el-select>
  1216. </el-form-item>
  1217. </el-form>
  1218. </div>
  1219. <span slot="footer" class="dialog-footer">
  1220. <el-button type="primary" @click="getList(2)">确 定</el-button>
  1221. <el-button @click="query = false">取 消</el-button>
  1222. </span>
  1223. </el-dialog>
  1224. </div>
  1225. <div class="tk">
  1226. <el-dialog title="预览" :visible.sync="Exconrtl" :modal-append-to-body='false' top="10%" width="50%">
  1227. <div class="toexamine">
  1228. <iframe sandbox="allow-scripts allow-top-navigation allow-same-origin allow-popups" :src="dataurl"
  1229. width="100%" height="100%"></iframe>
  1230. </div>
  1231. </el-dialog>
  1232. </div>
  1233. <!-- 付款记录 -->
  1234. <div class="tk">
  1235. <el-dialog title="付款记录" :visible.sync="payreControl" :modal-append-to-body='false' top="10%" width="50%">
  1236. <div class="WithoutInterval">
  1237. <el-table :data="payrecord" height="500px" :header-cell-style="{background:'#e2e2e2'}" style="width: 100%">
  1238. <el-table-column prop="payAmount" label="付款金额">
  1239. </el-table-column>
  1240. <el-table-column prop="payDate" label="付款时间">
  1241. </el-table-column>
  1242. <el-table-column prop="remarks" label="备注">
  1243. </el-table-column>
  1244. <el-table-column fixed="right" label="操作" width="150">
  1245. <template slot-scope="scope">
  1246. <el-button @click="getdocument(scope.row)" type="text" size="small"
  1247. :disabled='authority==1'>
  1248. 查看文件</el-button>
  1249. <el-button @click="deletepayrecord(scope.row)" type="text" size="small"
  1250. :disabled='authority==1' style="color: #FF4500 ;">
  1251. 撤销付款</el-button>
  1252. </template>
  1253. </el-table-column>
  1254. </el-table>
  1255. </div>
  1256. </el-dialog>
  1257. </div>
  1258. <!-- 签订协议 -->
  1259. <div v-if="coverControl">
  1260. <SignAcontract @getlist='getList' :strpdetails='strpdetails' :datahouseholdmax='datahousehold'></SignAcontract>
  1261. <div class="cover" @click="coverControl=false,getList()"></div>
  1262. </div>
  1263. <!-- 签订协议 -->
  1264. <div v-if="covercommit">
  1265. <Scommit @getlist='getList' :strpdetails='strpdetails' :datahouseholdmax='datahousehold'></Scommit>
  1266. <div class="cover" @click="covercommit=false,getList()"></div>
  1267. </div>
  1268. </div>
  1269. </template>
  1270. <script>
  1271. import Tooltip from '../../../assembly/tooltip.vue'
  1272. import fileManage from '../../../assembly/file.vue'
  1273. import agreement from '../../../assembly/agreement.vue'
  1274. import SignAcontract from './SignAcontract.vue'
  1275. import Scommit from './Scommit.vue'
  1276. import {
  1277. number
  1278. } from 'echarts'
  1279. export default {
  1280. name: "survey",
  1281. props: ['strpdetails', 'authority'],
  1282. components: {
  1283. fileManage,
  1284. agreement,
  1285. SignAcontract,
  1286. Tooltip,
  1287. Scommit
  1288. },
  1289. data() {
  1290. return {
  1291. payreControl:false,
  1292. payrecord:[],
  1293. currentContro:'1',
  1294. //签协议控制
  1295. coverControl: false,
  1296. //签约审核
  1297. ExamineControl: false,
  1298. //付款控制
  1299. covercommit:false,
  1300. vacatedDate: '', //补腾空日期
  1301. cancellationDate: '', //注销日期
  1302. paymentDate: '', //付款日期
  1303. Examine: false,
  1304. defaultOpen: require("../../../../assets/file-plus.png"),
  1305. defaultClose: require("../../../../assets/file-reduce.png"),
  1306. getexaminefile: false,
  1307. fileList: [],
  1308. fileListindex: [],
  1309. defaultProp: {
  1310. children: 'tree',
  1311. label: 'name',
  1312. },
  1313. dataurl: '',
  1314. getexaminefileid: '',
  1315. //上传错误
  1316. errorControl: false,
  1317. errorData: '',
  1318. //分户
  1319. Visiblebranch: false,
  1320. branchdata: [],
  1321. branchvalue: [],
  1322. branchousehold: false,
  1323. branch: {
  1324. oldHouseholdId: '', //户id
  1325. newHouseholdName: '', //分户户主姓名
  1326. newHouseholdIdCard: '', //分户户主身份证号
  1327. members: [] //转移至新户的家庭成员ID
  1328. },
  1329. branchrules: {
  1330. newHouseholdName: [{
  1331. required: true,
  1332. message: '请输入分户户主姓名',
  1333. trigger: 'blur'
  1334. }],
  1335. newHouseholdIdCard: [{
  1336. required: true,
  1337. message: ' ',
  1338. trigger: 'blur'
  1339. }],
  1340. },
  1341. AgreementIndex: 1, //打印协议的第几个
  1342. // authority:1,
  1343. switchi: 0,
  1344. agreementSigningStatus: '未签约',
  1345. vacateState: '',
  1346. //=====导入======
  1347. exportExcelOneURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelOne',
  1348. exportExcelTwoURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelTwo',
  1349. exportExcelThreeurl: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelThree',
  1350. exportExcelFourURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelFour',
  1351. exportExcelFiveURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelFive',
  1352. exportExcelSixURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelSix',
  1353. exportExcelNineURL: window.sessionStorage.getItem('url') + 'api/auth/householdcx/importExcelNine',
  1354. tokenData: {
  1355. token: window.sessionStorage.getItem('token')
  1356. },
  1357. householdcxData: {
  1358. projectId: '',
  1359. },
  1360. //=====查询======
  1361. query: false,
  1362. householderName: '', //姓名
  1363. householderIdCard: '', //户主身份证
  1364. flowState: '', //安置方式
  1365. cancellationState: '', //注销状态
  1366. paymentState: '', //付款状态
  1367. page: 1, //页码
  1368. ImportInformation: {}, //征迁户列表
  1369. //新增列表
  1370. addVisible: false,
  1371. addlist: {
  1372. householderName: '',
  1373. householderIdCard: '',
  1374. levyHouseNature: '',
  1375. street: '',
  1376. village: '',
  1377. oldHouseAddress: '',
  1378. locationClassification:''
  1379. },
  1380. addlistrules: {
  1381. householderName: [{
  1382. required: true,
  1383. message: 'x',
  1384. trigger: 'blur'
  1385. }],
  1386. householderIdCard: [{
  1387. required: true,
  1388. message: 'x',
  1389. trigger: 'blur'
  1390. }],
  1391. levyHouseNature: [{
  1392. required: true,
  1393. message: 'x',
  1394. trigger: 'blur'
  1395. }],
  1396. street: [{
  1397. required: true,
  1398. message: ' ',
  1399. trigger: 'blur'
  1400. }],
  1401. village: [{
  1402. required: true,
  1403. message: ' ',
  1404. trigger: 'blur'
  1405. }],
  1406. oldHouseAddress: [{
  1407. required: true,
  1408. message: ' ',
  1409. trigger: 'blur'
  1410. }],
  1411. locationClassification: [{
  1412. required: true,
  1413. message: ' ',
  1414. trigger: 'blur'
  1415. }],
  1416. },
  1417. earth:[],
  1418. //编辑
  1419. sethousehold: false,
  1420. datahousehold: [],
  1421. activeName: '1', //手风琴
  1422. householdindex: 0,
  1423. //户id
  1424. loadFileList: ['被拆迁人家庭人口情况表', '户籍信息', '婚姻状况证明', '家庭成员关系证明', '大中专毕业生入学办理农转非证明', '非农户口未享受过城镇住房保障政策证明', '其他'],
  1425. householdId: '',
  1426. peopledata: [],
  1427. //编辑 新增户
  1428. member: false,
  1429. Demolitions: {
  1430. householdId: '',
  1431. name: '',
  1432. idCard: '',
  1433. relation: '',
  1434. householdNature: '',
  1435. placementWay: '',
  1436. joinHouseholdTime: '',
  1437. houseOwnershipSource: '',
  1438. onlyChild: '',
  1439. marriedNotBearing: '',
  1440. enjoyedWlfSituation: '',
  1441. remarks: '',
  1442. req: '',
  1443. },
  1444. rules: {
  1445. name: [{
  1446. required: true,
  1447. message: '请输入姓名',
  1448. trigger: 'blur'
  1449. }],
  1450. idCard: [{
  1451. required: true,
  1452. message: '请输入身份证号',
  1453. trigger: 'blur'
  1454. }],
  1455. req: [{
  1456. required: true,
  1457. message: '请输入排序',
  1458. trigger: 'blur'
  1459. }]
  1460. },
  1461. options: [{
  1462. label: '是',
  1463. value: 1
  1464. }, {
  1465. label: '否',
  1466. value: 0
  1467. }],
  1468. control: false, //上传文件和备注
  1469. filelist: [],
  1470. Exconrtl: false,
  1471. selectFileName: '',
  1472. selectFileNameUrl:'',
  1473. Reremar: '',
  1474. namestreet:[],
  1475. }
  1476. },
  1477. watch: {},
  1478. computed: {
  1479. examineStatus() {
  1480. return (value) => {
  1481. if (value == null) {
  1482. return ' '
  1483. }
  1484. const a = value.split(' ');
  1485. const b = a[0].split('-');
  1486. const nowTime = new Date();
  1487. const oldTime = new Date(b[0], b[1] - 1, b[2]);
  1488. const over = (nowTime - oldTime) / (1000 * 60 * 60 * 24) > 60; //大于3 代表是否大于3天,如果想判断30天就把3改成30
  1489. return over
  1490. }
  1491. }
  1492. },
  1493. mounted() {
  1494. if (!this.$route.query.projectId) {
  1495. this.householdcxData.projectId = this.strpdetails.bussiness.id
  1496. }
  1497. // console.log(this.strpdetails.bussiness.street)
  1498. this.getList()
  1499. this.earth=this.strpdetails.bussiness.sectionGradeParamOne.split(",")
  1500. if(this.earth.length==1){
  1501. this.addlist.locationClassification=this.earth[0]
  1502. }
  1503. },
  1504. methods: {
  1505. //获取签订记录
  1506. getdocument(row){
  1507. this.$http.get('api/auth/file/fileList?type=' + 2 + '&id=' + row.householdId, null).then((res) => {
  1508. if (res.status == 200 && res.data.code == 0) {
  1509. this.fileListindex = res.data.list
  1510. var data=[]
  1511. if(this.fileListindex){
  1512. this.fileListindex.forEach((item,index)=>{
  1513. if(item.empty==false){
  1514. if(item.name=='3、审批后资料'){
  1515. item.tree.forEach((nale,ixde)=>{
  1516. if(nale.name=='3、打款凭证'){
  1517. nale.tree.forEach((nana,ixde)=>{
  1518. if(nana.name==row.id){
  1519. data[0]=nana
  1520. }
  1521. })
  1522. }
  1523. })
  1524. }
  1525. }
  1526. })
  1527. }
  1528. this.fileListindex=data
  1529. this.Examine=true
  1530. } else {
  1531. this.$message.error("查找文件列表失败!");
  1532. }
  1533. });
  1534. },
  1535. //撤销付款记录
  1536. deletepayrecord(row){
  1537. this.$http.get('api/auth/payrecord/cancelPay?id='+row.id,null).then((res) => {
  1538. if (res.status == 200 && res.data.code == 0) {
  1539. this.getPayrecord(row.householdId)
  1540. this.getList()
  1541. this.$message.success('撤销付款成功!');
  1542. } else {
  1543. this.$message.error("撤销付款失败!");
  1544. }
  1545. })
  1546. },
  1547. //获取付款记录
  1548. getPayrecord(row){
  1549. this.$http.get('api/auth/payrecord/list?householdId='+row,null).then((res) => {
  1550. if (res.status == 200 && res.data.code == 0) {
  1551. this.payreControl=true
  1552. this.payrecord=res.data.list
  1553. } else {
  1554. this.$message.error("获取失败!");
  1555. }
  1556. })
  1557. },
  1558. //获取街道对应街道前缀
  1559. getStrtte(){
  1560. this.$http.get('api/auth/householdprefix/list?projectId='+this.strpdetails.bussiness.id,null).then((res) => {
  1561. if (res.status == 200 && res.data.code == 0) {
  1562. var data=res.data.list
  1563. data.forEach((iten,index)=>{
  1564. data[index].limit=true
  1565. })
  1566. this.getnameSterrt(data)
  1567. } else {
  1568. this.$message.error("获取失败!");
  1569. }
  1570. })
  1571. },
  1572. getnameSterrt(row){
  1573. this.$http.get('api/v1/pri/userInfo', null).then((res) => {
  1574. if (res.status == 200 && res.data.code == 0) {
  1575. if(res.data.user.street){
  1576. this.addVisible=true
  1577. var data=res.data.user.street.split(",")
  1578. row.forEach((item)=>{
  1579. data.forEach((iten)=>{
  1580. if(item.street==iten){
  1581. this.namestreet.push(iten)
  1582. }
  1583. })
  1584. })
  1585. if(this.namestreet.length==1){
  1586. this.addlist.street=this.namestreet[0]
  1587. }
  1588. }else{
  1589. this.$message.error('请先把账号绑定街道!');
  1590. }
  1591. } else {
  1592. this.$message.error('失败!');
  1593. }
  1594. })
  1595. },
  1596. //房屋性质选中非住宅安置方式只有货币
  1597. PlacementSelect(){
  1598. if(this.datahousehold.levyHouseNature=='非住宅'){this.datahousehold.placementWay="货币"}
  1599. },
  1600. getfileList(i) {
  1601. if (i.tree.length != 0) {
  1602. this.fileListindex = []
  1603. this.fileListindex.push(i)
  1604. this.dataurl = ''
  1605. this.Examine = true
  1606. } else {
  1607. this.$message.error("暂无文件!");
  1608. }
  1609. },
  1610. //审核
  1611. VacateExamine() {
  1612. var data = this.getexaminefileid
  1613. for(var i=0;i<this.fileList.length;i++){
  1614. if(this.fileList[i].tree.length==0){
  1615. this.$message.error("请先补充完整资料!")
  1616. return
  1617. }
  1618. }
  1619. if (data.publicityOneState != '已公示') {
  1620. this.$message.error("请先进行房屋评估公示!")
  1621. return
  1622. } else if (data.publicityTwoState != '已公示') {
  1623. this.$message.error("请先进行安置情况公示!")
  1624. return
  1625. }
  1626. data.signingReviewState = '已审核'
  1627. data.projectId = this.strpdetails.bussiness.id,
  1628. this.$http.post('api/auth/householdcx/update', data).then((res) => {
  1629. if (res.status == 200 && res.data.code == 0) {
  1630. this.getList()
  1631. this.ExamineControl = false;
  1632. this.$message.success('审核成功!');
  1633. } else {
  1634. this.$message.error("审核失败!");
  1635. }
  1636. })
  1637. },
  1638. getgetexaminefile(row) {
  1639. this.getexaminefileid = row
  1640. this.$http.get('api/auth/file/fileList?type=' + 2 + '&id=' + row.id, null).then((res) => {
  1641. if (res.status == 200 && res.data.code == 0) {
  1642. this.fileList = res.data.list
  1643. var data=[]
  1644. var dataindex=true
  1645. if (this.fileList) {
  1646. this.fileList.forEach((item, index) => {
  1647. if (item.empty == false) {
  1648. if(item.name=='1、审批前资料'){
  1649. data=item.tree
  1650. data.forEach((nale, ixde) => {
  1651. if(!nale.tree){
  1652. nale.tree=[]
  1653. }
  1654. if(nale.name=='4、生产经营用房面积核定表'){
  1655. if(!row.businessHouseArea){
  1656. dataindex=ixde
  1657. }
  1658. }
  1659. })
  1660. }
  1661. }
  1662. })
  1663. }
  1664. if(dataindex!=true){
  1665. data.splice(dataindex,1)
  1666. }
  1667. this.fileList = data
  1668. } else {
  1669. this.$message.error("查找文件列表失败!");
  1670. }
  1671. });
  1672. },
  1673. // 树节点点击
  1674. nodeClic(val) {
  1675. if (val.tree) {
  1676. val.empty = !val.empty
  1677. return;
  1678. }
  1679. var data = new FormData;
  1680. data.append("downloadFileUri", val.url);
  1681. data.append("id", this.getexaminefileid.id);
  1682. data.append("type", 2);
  1683. this.$http.post('api/auth/file/download', data, {
  1684. responseType: 'blob'
  1685. }).then((res) => {
  1686. if (res.headers['content-type'] == "application/octet-stream;charset=utf-8" || res.headers[
  1687. 'content-type'] == "application/octet-stream;charset=UTF-8") {
  1688. //此处有个坑。这里用content保存文件流,最初是content=res,
  1689. //检查了下才发现,后端对文件流做了一层封装,所以将content指向res.data即可
  1690. //另外,流的转储属于浅拷贝,所以此处的content转储仅仅是便于理解,并没有实际作用=_=
  1691. const content = res.data
  1692. const type = {
  1693. xml: 'text/xml',
  1694. zip: 'application/zip',
  1695. doc: 'application/msword',
  1696. bin: 'application/octet-stream',
  1697. exe: 'application/octet-stream',
  1698. so: 'application/octet-stream',
  1699. dll: 'application/octet-stream',
  1700. pdf: 'application/pdf',
  1701. ai: 'application/postscript',
  1702. xls: 'application/vnd.ms-excel',
  1703. ppt: 'application/vnd.ms-powerpoint',
  1704. dir: 'application/x-director',
  1705. js: 'application/x-javascript',
  1706. swf: 'application/x-shockwave-flash',
  1707. xhtml: 'application/xhtml+xml',
  1708. xht: 'application/xhtml+xml',
  1709. mid: 'audio/midi',
  1710. midi: 'audio/midi',
  1711. mp3: 'audio/mpeg',
  1712. rm: 'audio/x-pn-realaudio',
  1713. rpm: 'audio/x-pn-realaudio-plugin',
  1714. wav: 'audio/x-wav',
  1715. bmp: 'image/bmp',
  1716. gif: 'image/gif',
  1717. jpeg: 'image/jpeg',
  1718. jpg: 'image/jpeg',
  1719. png: 'image/png',
  1720. css: 'text/css',
  1721. html: 'text/html',
  1722. htm: 'text/html',
  1723. txt: 'text/plain',
  1724. xsl: 'text/xml',
  1725. mpeg: 'video/mpeg',
  1726. mpg: 'video/mpeg',
  1727. avi: 'video/x-msvideo',
  1728. movie: 'video/x-sgi-movie',
  1729. xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
  1730. }
  1731. const blob = new Blob([content], { // 关键代码
  1732. type: type[val.url.split('.').pop().toLowerCase()]
  1733. }) //构造一个blob对象来处理数据
  1734. this.dataurl = window.URL.createObjectURL(blob)
  1735. }
  1736. });
  1737. },
  1738. //分户
  1739. account(formName) {
  1740. this.$refs[formName].validate((valid) => {
  1741. if (valid) {
  1742. this.branch.members = this.branchvalue
  1743. this.$http.post('api/auth/householdcx/householdSplit', this.branch).then((res) => {
  1744. if (res.status == 200 && res.data.code == 0) {
  1745. this.$message.success('分户成功!');
  1746. this.getList()
  1747. this.branchvalue = []
  1748. this.branch.newHouseholdName = ''
  1749. this.branch.newHouseholdIdCard = ''
  1750. // this.Visiblebranch=false
  1751. this.branchousehold = false
  1752. } else {
  1753. this.$message.error("分户失败!");
  1754. }
  1755. });
  1756. } else {
  1757. return false;
  1758. }
  1759. });
  1760. },
  1761. //选中列表
  1762. Checkbranch(row) {
  1763. if (row) {
  1764. this.branch.oldHouseholdId = row.id
  1765. }
  1766. },
  1767. async brade() {
  1768. if (this.branch.oldHouseholdId != '') {
  1769. this.branchdata = []
  1770. await this.gethousehoid(this.branch.oldHouseholdId)
  1771. // if(this.branch.oldHouseholdId.length>1){this.$message.error("此户不能进行分户!");return}
  1772. for (let i = 0; i < this.peopledata.length; i++) {
  1773. this.branchdata.push({
  1774. key: this.peopledata[i].id,
  1775. label: this.peopledata[i].name,
  1776. // label:this.peopledata[i].name+'-'+this.peopledata[i].idCard,
  1777. disabled: false
  1778. });
  1779. }
  1780. this.branchousehold = true
  1781. } else {
  1782. this.$message.error("请选择户!");
  1783. }
  1784. },
  1785. getList(row) {
  1786. if (row == 1) {
  1787. this.coverControl = false
  1788. } else if (row == 2) {
  1789. this.query = false
  1790. }else if(row==3){
  1791. this.covercommit=false
  1792. }
  1793. var url
  1794. if (this.$route.query.projectId) {
  1795. url = 'api/auth/householdcx/problemlist'
  1796. } else {
  1797. url = 'api/auth/householdcx/list'
  1798. }
  1799. this.$http.get(`${url}?projectId=` + this.strpdetails.bussiness.id + '&page=' + this.page + '&list=' + 10 +
  1800. '&agreementSigningStatus=' + this.agreementSigningStatus + '&vacateState=' + this.vacateState +
  1801. '&householderName=' + this.householderName + '&placementWay=' + this.flowState +
  1802. '&householderIdCard=' + this.householderIdCard + '&cancellationState=' + this.cancellationState +
  1803. '&paymentState=' + this.paymentState, null).then((res) => {
  1804. if (res.status == 200 && res.data.code == 0) {
  1805. this.ImportInformation = res.data.page
  1806. } else {
  1807. this.$message.error("提交失败!");
  1808. }
  1809. });
  1810. },
  1811. //腾空
  1812. Vacate() {
  1813. var data = this.getexaminefileid
  1814. if (this.selectFileName == '腾房') {
  1815. if (this.filelist.tree.length == 0) {
  1816. this.$message.error("请上传资料!");
  1817. return
  1818. }
  1819. if (this.vacatedDate == '') {
  1820. this.$message.error("请填写腾房日期!");
  1821. return
  1822. }
  1823. data.vacateState = '已腾房'
  1824. data.vacateRemarks = this.Reremar
  1825. data.vacatedDate = this.vacatedDate
  1826. } else if (this.selectFileName == '注销') {
  1827. if (this.cancellationDate == '') {
  1828. this.$message.error("请填写注销日期!");
  1829. return
  1830. }
  1831. data.cancellationState = '已注销'
  1832. data.cancellationRemarks = this.Reremar
  1833. data.cancellationDate = this.cancellationDate
  1834. } else if (this.selectFileName == '付款') {
  1835. if (this.filelist.tree.length == 0) {
  1836. this.$message.error("请上传资料!");
  1837. return
  1838. }
  1839. if (this.paymentDate == '') {
  1840. this.$message.error("请填写付款日期!");
  1841. return
  1842. }
  1843. data.paymentState = '已付款'
  1844. data.paymentRemarks = this.Reremar
  1845. data.paymentDate = this.paymentDate
  1846. }
  1847. data.projectId = this.strpdetails.bussiness.id,
  1848. this.$http.post('api/auth/householdcx/update', data).then((res) => {
  1849. if (res.status == 200 && res.data.code == 0) {
  1850. this.control = false
  1851. this.getList()
  1852. this.$message.success(this.selectFileName + '成功!');
  1853. } else {
  1854. this.$message.error("失败!");
  1855. }
  1856. })
  1857. },
  1858. //撤销签顶
  1859. From(row) {
  1860. this.datahousehold = row
  1861. this.datahousehold.projectId = this.strpdetails.bussiness.id,
  1862. this.datahousehold.agreementSigningStatus = '未签约'
  1863. this.datahousehold.signingProgress = '完成'
  1864. this.$confirm('确定要撤销签订吗?').then(_ => {
  1865. this.$http.post('api/auth/householdcx/update', this.datahousehold).then((res) => {
  1866. if (res.status == 200 && res.data.code == 0) {
  1867. this.getList()
  1868. this.$message.success('撤销成功!');
  1869. } else {
  1870. this.$message.error("撤销失败!");
  1871. }
  1872. })
  1873. })
  1874. },
  1875. // 页码
  1876. handleCurrentChange(val) {
  1877. this.page = val;
  1878. this.getList();
  1879. },
  1880. //新增
  1881. addhousehold(addlist) {
  1882. // var data = {
  1883. // householderName: this.addname,
  1884. // projectId: this.strpdetails.bussiness.id
  1885. // }
  1886. this.$refs[addlist].validate((valid) => {
  1887. if (valid) {
  1888. this.addlist.projectId = this.strpdetails.bussiness.id
  1889. this.$http.post('api/auth/householdcx/save', this.addlist).then((res) => {
  1890. if (res.status == 200 && res.data.code == 0) {
  1891. for (let key in this.addlist) {
  1892. this.addlist[key] = ''
  1893. }
  1894. this.getList()
  1895. this.addVisible = false
  1896. this.$message.success('添加成功!');
  1897. } else {
  1898. this.$message.error("添加失败!");
  1899. }
  1900. })
  1901. } else {
  1902. return false;
  1903. }
  1904. });
  1905. },
  1906. //删除
  1907. smallhouseholdcx(row) {
  1908. var data = []
  1909. data.push(row.id)
  1910. this.$confirm('确定要删除该拆迁户吗?').then(_ => {
  1911. this.$http.post("api/auth/householdcx/delete", data).then((res) => {
  1912. if (res.status == 200 && res.data.code == 0) {
  1913. this.getList()
  1914. this.$message.success("删除成功!");
  1915. } else {
  1916. this.$message.error("删除失败!");
  1917. }
  1918. });
  1919. })
  1920. },
  1921. // 导出模板
  1922. exportdata(row) {
  1923. var url = row + '?projectId=' + this.strpdetails.bussiness.id
  1924. this.$http.get(url, {
  1925. responseType: 'blob'
  1926. }, null).then((res) => {
  1927. var name = res.headers['content-disposition']
  1928. var index = res.headers['content-disposition'].lastIndexOf("=");
  1929. name = decodeURIComponent(name.substring(index + 6, name.length))
  1930. if (res.headers['content-type'] == "application/octet-stream;charset=utf-8" || res.headers[
  1931. 'content-type'] == "application/octet-stream;charset=UTF-8") {
  1932. const content = res.data
  1933. const blob = new Blob([content], {
  1934. type: res.data.type
  1935. }) //构造一个blob对象来处理数据
  1936. const fileName = name
  1937. if ('download' in document.createElement('a')) { //支持a标签download的浏览器
  1938. const link = document.createElement('a') //创建a标签
  1939. link.download = fileName //a标签添加属性
  1940. link.style.display = 'none'
  1941. link.href = URL.createObjectURL(blob)
  1942. document.body.appendChild(link)
  1943. link.click() //执行下载
  1944. URL.revokeObjectURL(link.href) //释放url
  1945. document.body.removeChild(link) //释放标签
  1946. } else { //其他浏览器
  1947. navigator.msSaveBlob(blob, fileName)
  1948. }
  1949. } else {
  1950. this.$message.error('下载文件失败!');
  1951. }
  1952. })
  1953. },
  1954. //导入数据成功后操作
  1955. householdcxSucces(res) {
  1956. if (res.code == 0) {
  1957. this.$message.success('导入成功!');
  1958. this.getList()
  1959. } else if (res.errorMsgs) {
  1960. // this.$message.error(res.errorMsgs);
  1961. this.errorData = res.errorMsgs
  1962. this.errorControl = true
  1963. } else {
  1964. this.$message.error(res.msg);
  1965. }
  1966. },
  1967. edititem(row) {
  1968. this.activeName = '1'
  1969. this.householdindex = 0
  1970. this.sethousehold = true
  1971. this.datahousehold = JSON.parse(JSON.stringify(row))
  1972. this.householdId = row.id
  1973. this.gethousehoid(row.id)
  1974. },
  1975. //获取家庭成员
  1976. async gethousehoid(row) {
  1977. await this.$http.get('api/auth/householdMember/list?householdId=' + row, null).then((res) => {
  1978. if (res.status == 200 && res.data.code == 0) {
  1979. this.peopledata = res.data.list
  1980. } else {
  1981. this.$message.error("获取失败!");
  1982. }
  1983. })
  1984. },
  1985. // 家庭成员编辑
  1986. updateProject(row) {
  1987. this.member = true
  1988. this.Demolitions = JSON.parse(JSON.stringify(row))
  1989. },
  1990. //修改征迁信息确定按钮
  1991. edithousehold() {
  1992. this.sethousehold = false;
  1993. this.datahousehold.projectId = this.strpdetails.bussiness.id,
  1994. this.$http.post('api/auth/householdcx/update', this.datahousehold).then((res) => {
  1995. if (res.status == 200 && res.data.code == 0) {
  1996. this.getList()
  1997. this.$message.success('修改成功!');
  1998. } else {
  1999. this.$message.error("修改失败!");
  2000. this.getList()
  2001. }
  2002. })
  2003. },
  2004. // 家庭成员删除
  2005. deleteProject(row) {
  2006. var data = []
  2007. data.push(row.id)
  2008. this.$confirm('确定要删除吗?').then(_ => {
  2009. this.$http.post('api/auth/householdMember/delete', data).then((res) => {
  2010. if (res.status == 200 && res.data.code == 0) {
  2011. this.gethousehoid(this.householdId)
  2012. this.$message.success('删除成功');
  2013. } else {
  2014. this.$message.error("删除失败!");
  2015. }
  2016. })
  2017. });
  2018. },
  2019. // 获取文件
  2020. getfile() {
  2021. this.$nextTick(res => {
  2022. this.$refs.file.getList();
  2023. })
  2024. },
  2025. empty() {
  2026. this.member = true
  2027. Object.keys(this.Demolitions).forEach(key => (this.Demolitions[key] = ''));
  2028. },
  2029. // 新增 编辑户
  2030. determine(formName) {
  2031. this.$refs[formName].validate((valid) => {
  2032. if (valid) {
  2033. if (!this.Demolitions.id) {
  2034. this.Demolitions.householdId = this.householdId
  2035. this.$http.post('api/auth/householdMember/save', this.Demolitions).then((res) => {
  2036. if (res.status == 200 && res.data.code == 0) {
  2037. this.member = false
  2038. this.$message.success('新增成功');
  2039. this.gethousehoid(this.householdId)
  2040. } else {
  2041. this.$message.error("新增失败!");
  2042. }
  2043. })
  2044. } else {
  2045. this.$http.post('api/auth/householdMember/update', this.Demolitions).then((res) => {
  2046. if (res.status == 200 && res.data.code == 0) {
  2047. this.member = false
  2048. this.gethousehoid(this.householdId)
  2049. this.$message.success('修改成功');
  2050. } else {
  2051. this.$message.error("修改失败!");
  2052. }
  2053. })
  2054. }
  2055. } else {
  2056. return false;
  2057. }
  2058. });
  2059. },
  2060. operation(res, red) {
  2061. this.Reremar=''
  2062. this.getexaminefileid = res
  2063. this.selectFileName = red
  2064. if(red=='腾房'){
  2065. this.selectFileNameUrl='3、审批后资料\\3、腾房凭证'
  2066. }else if(red=='注销'){
  2067. this.selectFileNameUrl='3、审批后资料\\4、注销凭证'
  2068. }
  2069. this.getfilelist()
  2070. this.control = true
  2071. },
  2072. getfilelist() {
  2073. this.$http.get('api/auth/file/fileList?type=' + 2 + '&id=' + this.getexaminefileid.id, null).then((
  2074. res) => {
  2075. if (res.status == 200 && res.data.code == 0) {
  2076. this.filelist = res.data.list
  2077. var data = [{
  2078. name: this.selectFileName + '资料',
  2079. empty: false,
  2080. type: "folder",
  2081. url: this.selectFileNameUrl,
  2082. tree: []
  2083. }, ]
  2084. if (this.filelist) {
  2085. this.filelist.forEach((item, index) => {
  2086. if (item.empty == false) {
  2087. if(item.name=='3、审批后资料'){
  2088. item.tree.forEach((nale,ixde)=>{
  2089. if(nale.url==data[0].url){
  2090. data[0].tree=nale.tree
  2091. }
  2092. })
  2093. }
  2094. }
  2095. })
  2096. }
  2097. this.filelist = data[0]
  2098. } else {
  2099. this.$message.error("查找文件列表失败!");
  2100. }
  2101. });
  2102. },
  2103. // 上传文件
  2104. handleChang(file) {
  2105. let that = this;
  2106. let formData = new FormData();
  2107. formData.append('file', file.raw);
  2108. formData.append('type', 2);
  2109. formData.append('id', this.getexaminefileid.id);
  2110. formData.append('destfolder', this.selectFileNameUrl);
  2111. that.$http.post('api/auth/file/upload', formData).then((res) => {
  2112. if (res.status == 200 && res.data.code == 0) {
  2113. that.$message.success("上传文件成功!");
  2114. this.getfilelist();
  2115. } else {
  2116. that.$message.error("上传文件失败!");
  2117. }
  2118. });
  2119. },
  2120. //删除文件
  2121. deleteFile(item) {
  2122. var data = new FormData;
  2123. data.append("delFileUri", item.url);
  2124. data.append("id", this.getexaminefileid.id);
  2125. data.append("type", 2);
  2126. this.$confirm('确定要删除该文件吗?').then(_ => {
  2127. this.$http.post('api/auth/file/removeFile', data).then((res) => {
  2128. if (res.status == 200 && res.data.code == 0) {
  2129. this.$message.success('删除该文件成功!');
  2130. this.getfilelist();
  2131. } else {
  2132. this.$message.error('删除该文件失败!');
  2133. }
  2134. })
  2135. })
  2136. }
  2137. }
  2138. }
  2139. </script>
  2140. <style scoped lang="less">
  2141. //签约审核
  2142. .indexControl {
  2143. .indexControl-ont {
  2144. .indexControl-ont-title {
  2145. font-size: 14px;
  2146. color: #999999;
  2147. margin: 10px 0;
  2148. }
  2149. ul {
  2150. display: flex;
  2151. flex-wrap: wrap;
  2152. li {
  2153. cursor: pointer;
  2154. width: 23%;
  2155. margin: 0 1%;
  2156. margin-bottom: 10px;
  2157. div {
  2158. // width: 60px;
  2159. text-align: center;
  2160. // margin: 0 auto;
  2161. div {
  2162. width: 55px;
  2163. height: 55px;
  2164. // background-color: #FA922E;
  2165. margin: 0 auto;
  2166. }
  2167. span {
  2168. text-align: center;
  2169. margin-bottom: 5px;
  2170. display: block;
  2171. }
  2172. .tooltip-wrap {
  2173. margin: 0 2px;
  2174. overflow: hidden;
  2175. text-overflow: ellipsis;
  2176. word-break: break-all;
  2177. font-size: 14px;
  2178. display: inline-block;
  2179. display: -webkit-box !important;
  2180. -webkit-line-clamp: 1;
  2181. -webkit-box-orient: vertical;
  2182. }
  2183. .tooltip-wrap span {
  2184. /* line-height: 1px; */
  2185. display: initial;
  2186. white-space: break-spaces;
  2187. }
  2188. p {
  2189. margin: 0 auto;
  2190. width: 60px;
  2191. color: #fff;
  2192. background-color: #55bf9c;
  2193. border-radius: 5px;
  2194. }
  2195. }
  2196. }
  2197. }
  2198. }
  2199. }
  2200. .toexamine {
  2201. width: 100%;
  2202. height: 500px;
  2203. // min-height: 500px;
  2204. .nrya {
  2205. width: 100%;
  2206. height: 100%;
  2207. display: flex;
  2208. .rt-nr {
  2209. width: 30%;
  2210. height: 100%;
  2211. overflow: auto;
  2212. /* // 将每一行的设置为相对定位 方便后面before after 使用绝对定位来固定位置 */
  2213. /deep/.el-tree .el-tree-node {
  2214. position: relative;
  2215. padding-left: 10px;
  2216. }
  2217. /* // 子集像右偏移 给数线留出距离 */
  2218. /deep/.el-tree .el-tree-node__children {
  2219. padding: 10px 0 0 30px !important;
  2220. }
  2221. /* //这是竖线 */
  2222. /deep/.el-tree .el-tree-node :last-child:before {
  2223. height: 40px;
  2224. }
  2225. /deep/.el-tree .el-tree>.el-tree-node:before {
  2226. border-left: none;
  2227. }
  2228. /deep/.el-tree .el-tree>.el-tree-node:after {
  2229. border-top: none;
  2230. }
  2231. /* //这自定义的线 的公共部分 */
  2232. /deep/.el-tree .el-tree-node:before,
  2233. /deep/.el-tree-node:after {
  2234. content: "";
  2235. left: -4px;
  2236. position: absolute;
  2237. right: auto;
  2238. border-width: 1px;
  2239. }
  2240. /deep/.el-tree .tree :first-child .el-tree-node:before {
  2241. border-left: none;
  2242. }
  2243. /* // 竖线 */
  2244. /deep/.el-tree .el-tree-node:before {
  2245. border-left: 1px solid #b5b5b5;
  2246. bottom: 0px;
  2247. height: 100%;
  2248. top: -25px;
  2249. width: 1px;
  2250. }
  2251. /* //横线 */
  2252. /deep/.el-tree .el-tree-node:after {
  2253. border-top: 1px solid #b5b5b5;
  2254. height: 20px;
  2255. top: 14px;
  2256. width: 24px;
  2257. }
  2258. /deep/.el-tree .el-tree-node__expand-icon.is-leaf {
  2259. width: 8px;
  2260. }
  2261. /* //去掉elementui自带的展开按钮 一个向下的按钮,打开时向右 */
  2262. /deep/.el-tree .el-tree-node__content>.el-tree-node__expand-icon {
  2263. display: none;
  2264. }
  2265. /deep/ .el-tree-node__content {
  2266. padding-left: 0px !important;
  2267. }
  2268. /* //每一行的高度 */
  2269. /deep/.el-tree>div:before {
  2270. display: none;
  2271. }
  2272. /deep/.el-tree>div:after {
  2273. display: none;
  2274. }
  2275. /deep/.el-tree-node.is-expanded>.el-tree-node__children {
  2276. padding: 10px 0 0 30px !important;
  2277. }
  2278. .fbtn {
  2279. color: #aaa;
  2280. font-size: 12px;
  2281. display: none !important;
  2282. margin: 0 2%;
  2283. }
  2284. .custom-tree-node:hover .fbtn {
  2285. display: inline !important;
  2286. }
  2287. .tooltip-wrap {
  2288. margin: 0 2px;
  2289. max-width: 59%;
  2290. overflow: hidden;
  2291. text-overflow: ellipsis;
  2292. word-break: break-all;
  2293. font-size: 14px;
  2294. display: inline-block;
  2295. display: -webkit-box !important;
  2296. -webkit-line-clamp: 1;
  2297. -webkit-box-orient: vertical;
  2298. span {
  2299. line-height: 1px;
  2300. display: initial;
  2301. white-space: break-spaces;
  2302. }
  2303. }
  2304. }
  2305. .rt-nt {
  2306. width: 70%;
  2307. height: 100%;
  2308. iframe {
  2309. border: 1px solid #ccc;
  2310. box-sizing: border-box;
  2311. }
  2312. }
  2313. }
  2314. }
  2315. .relocate {
  2316. width: 100%;
  2317. height: 100%;
  2318. font-size: 14px;
  2319. .relocate-top {
  2320. height: 45px;
  2321. border-bottom: 1px solid #dedede;
  2322. display: flex;
  2323. padding-left: 10px;
  2324. div {
  2325. height: 44px;
  2326. line-height: 44px;
  2327. margin: 0 20px;
  2328. font-size: 16px;
  2329. color: #999;
  2330. font-weight: 500;
  2331. cursor: pointer;
  2332. }
  2333. .LeftCheck {
  2334. border-bottom: 2px solid #167aa1;
  2335. color: #072a38;
  2336. }
  2337. }
  2338. .relocate-name {
  2339. width: 100%;
  2340. height: calc(100% - 45px);
  2341. .relocate-name-one {
  2342. width: 100%;
  2343. height: 100%;
  2344. padding: 20px 30px;
  2345. box-sizing: border-box;
  2346. overflow-y: auto;
  2347. overflow-x: hidden;
  2348. & {
  2349. scrollbar-width: thin;
  2350. scrollbar-color: #c1c1c1 #eee;
  2351. }
  2352. &::-webkit-scrollbar {
  2353. width: 6px;
  2354. background-color: #eee;
  2355. }
  2356. &::-webkit-scrollbar-thumb {
  2357. background-color: #c1c1c1;
  2358. &:hover {
  2359. background-color: #a8a8a8;
  2360. }
  2361. &:active {
  2362. background-color: #787878;
  2363. }
  2364. }
  2365. .relocate-name-one-top {
  2366. display: flex;
  2367. margin-bottom: 20px;
  2368. .relocate-name-one-top-left {
  2369. width: 60%;
  2370. height: 40px;
  2371. display: flex;
  2372. div {
  2373. display: flex;
  2374. margin-right: 20px;
  2375. span {
  2376. width: 80px;
  2377. height: 40px;
  2378. line-height: 40px;
  2379. display: block;
  2380. text-align: right;
  2381. font-size: 14px;
  2382. color: #4b4b4b;
  2383. }
  2384. .el-input {
  2385. margin: 0;
  2386. width: calc(100% - 80px);
  2387. }
  2388. &:nth-child(1) .el-input {
  2389. width: calc(100% - 42px);
  2390. }
  2391. &:nth-child(1) span {
  2392. width: 42px;
  2393. }
  2394. }
  2395. .button-background {
  2396. margin-left: 20px;
  2397. .el-button {
  2398. border-radius: 6px;
  2399. }
  2400. }
  2401. }
  2402. .relocate-name-one-top-right {
  2403. width: 40%;
  2404. height: 40px;
  2405. ul {
  2406. display: flex;
  2407. justify-content: flex-end;
  2408. li {
  2409. cursor: pointer;
  2410. width: 90px;
  2411. line-height: 40px;
  2412. text-align: center;
  2413. border: 1px solid #dedede;
  2414. border-radius: 8px;
  2415. margin-left: 20px;
  2416. i {
  2417. font-size: 19px;
  2418. color: #47a1c4;
  2419. }
  2420. span {
  2421. color: #707070;
  2422. }
  2423. }
  2424. }
  2425. }
  2426. }
  2427. .relocate-name-one-tow {
  2428. width: 100%;
  2429. height: 566px;
  2430. border: 1px solid #dedede;
  2431. /deep/.WithoutInterval {
  2432. .el-table th.el-table__cell.is-leaf {
  2433. background-color: #dedede;
  2434. }
  2435. .el-table__body-wrapper {
  2436. scrollbar-width: thin;
  2437. scrollbar-color: #c1c1c1 #eee;
  2438. }
  2439. .el-table__body-wrapper::-webkit-scrollbar {
  2440. width: 6px;
  2441. background-color: #eee;
  2442. }
  2443. .el-table__body-wrapper::-webkit-scrollbar-thumb {
  2444. background-color: #c1c1c1;
  2445. &:hover {
  2446. background-color: #a8a8a8;
  2447. }
  2448. &:active {
  2449. background-color: #787878;
  2450. }
  2451. }
  2452. }
  2453. }
  2454. }
  2455. }
  2456. .cover {
  2457. position: absolute;
  2458. top: 0;
  2459. right: 0;
  2460. width: 100%;
  2461. height: 100%;
  2462. z-index: 10;
  2463. background-color: #00000070;
  2464. cursor: pointer;
  2465. }
  2466. }
  2467. .el-dropdown-menu__item {
  2468. span {
  2469. width: 100%;
  2470. height: 100%;
  2471. display: block;
  2472. text-align: center;
  2473. }
  2474. /deep/ .el-upload {
  2475. width: 100%;
  2476. }
  2477. }
  2478. .tc-middle {
  2479. .arrr {
  2480. border: 1px solid #0000003d;
  2481. border-top: none;
  2482. }
  2483. /deep/.el-collapse {
  2484. border-top: none;
  2485. }
  2486. /deep/.el-collapse-item__header {
  2487. color: #707070;
  2488. // border-bottom: 1px solid #e4e7ed;
  2489. border-top: 1px solid #0000003d;
  2490. font-size: 16px;
  2491. padding: 0 10px;
  2492. background-color: #eaeaea;
  2493. }
  2494. /deep/.is-active {
  2495. background-color: #dadada;
  2496. color: #439dc1;
  2497. }
  2498. /deep/.el-collapse-item__header:hover {
  2499. background-color: #dadada;
  2500. color: #439dc1;
  2501. }
  2502. /deep/.el-collapse-item__wrap {
  2503. border: 1px solid #EBEEF5;
  2504. }
  2505. .tc-middle-add {
  2506. display: flex;
  2507. justify-content: space-between;
  2508. .el-button {
  2509. height: 28px;
  2510. margin: 15px 0;
  2511. }
  2512. }
  2513. }
  2514. .agreement {
  2515. width: 100%;
  2516. height: calc(100% - 112px);
  2517. display: flex;
  2518. .agreement-lest {
  2519. width: 190px;
  2520. height: 100%;
  2521. .PlanningLibrary-left {
  2522. height: 100%;
  2523. width: 190px;
  2524. min-width: 150px;
  2525. background: #fff;
  2526. // box-shadow: 6px 6px 8px 0px rgba(0,0,0,0.25);
  2527. border-right: 1px solid #dedede;
  2528. .PlanningLibrary-left-top {
  2529. background-color: #E6E6E6;
  2530. height: 40px;
  2531. padding: 7px;
  2532. box-sizing: border-box;
  2533. .PlanningLibrary-left-top-right {
  2534. display: flex;
  2535. height: 26px;
  2536. i {
  2537. font-size: 24px;
  2538. color: #167AA1;
  2539. margin-right: 5px;
  2540. line-height: 26px;
  2541. }
  2542. span {
  2543. color: #167AA1;
  2544. font-size: 16px;
  2545. display: table-cell;
  2546. vertical-align: middle;
  2547. }
  2548. }
  2549. }
  2550. .PlanningLibrary-left-data {
  2551. box-sizing: border-box;
  2552. ul {
  2553. li {
  2554. cursor: pointer;
  2555. color: #6f6f6f;
  2556. font-size: 14px;
  2557. height: 36px;
  2558. line-height: 36px;
  2559. padding: 0 16px;
  2560. overflow: hidden;
  2561. display: -webkit-box !important;
  2562. -webkit-line-clamp: 1;
  2563. -webkit-box-orient: vertical;
  2564. i {
  2565. color: #F7C800;
  2566. margin-right: 2px;
  2567. }
  2568. }
  2569. }
  2570. }
  2571. //选中背景色
  2572. .Check {
  2573. background-color: #167aa1;
  2574. color: #fff !important;
  2575. }
  2576. }
  2577. }
  2578. .agreement-right {
  2579. width: calc(100% -190px);
  2580. height: 100%;
  2581. padding: 20px;
  2582. box-sizing: border-box;
  2583. overflow-y: auto;
  2584. }
  2585. }
  2586. .branch {
  2587. /deep/.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__inner {
  2588. display: none;
  2589. }
  2590. /deep/.el-button--primary {
  2591. background-color: #47A1C4;
  2592. border: 1px solid #47A1C4;
  2593. }
  2594. /deep/.is-disabled {
  2595. background-color: #47A1C498;
  2596. border: 1px solid #47A1C4;
  2597. }
  2598. /deep/.el-checkbox__input.is-checked .el-checkbox__inner {
  2599. background-color: #47a1c4;
  2600. border-color: #47a1c4;
  2601. }
  2602. /deep/.el-checkbox__label {
  2603. color: #47a1c4;
  2604. }
  2605. /deep/.el-checkbox__label:hover {
  2606. color: #47a1c4;
  2607. }
  2608. }
  2609. .operation {
  2610. width: 100%;
  2611. height: 425px;
  2612. .branch {
  2613. width: 100%;
  2614. height: calc(100% - 40px);
  2615. overflow-y: auto;
  2616. .Upload-butom-ont {
  2617. width: 100%;
  2618. .Upload-butom-tow {
  2619. width: 100%;
  2620. height: 40px;
  2621. display: flex;
  2622. h3 {
  2623. color: #439dc1;
  2624. margin: 15px 0;
  2625. line-height: 10px;
  2626. &::before {
  2627. content: "*";
  2628. color: #f56c6c;
  2629. margin-right: 5px;
  2630. }
  2631. }
  2632. }
  2633. .tc-middle-add {
  2634. h3 {
  2635. color: #439dc1;
  2636. margin: 15px 0;
  2637. &::before {
  2638. content: "*";
  2639. color: rgba(0, 0, 0, 0);
  2640. margin-right: 5px;
  2641. }
  2642. }
  2643. .apse {
  2644. &::before {
  2645. content: "*";
  2646. color: #f56c6c;
  2647. margin-right: 5px;
  2648. }
  2649. }
  2650. }
  2651. .tc-middle-name {
  2652. width: 100%;
  2653. flex-wrap: wrap;
  2654. ul {
  2655. width: 100%;
  2656. display: flex;
  2657. flex-wrap: wrap;
  2658. li {
  2659. width: 100px;
  2660. height: 110px;
  2661. cursor: pointer;
  2662. margin: 10px;
  2663. margin-bottom: 0;
  2664. position: relative;
  2665. border: 1px solid #dedede;
  2666. border-radius: 10px;
  2667. padding: 10px;
  2668. box-sizing: border-box;
  2669. &:hover {
  2670. i {
  2671. display: block;
  2672. }
  2673. }
  2674. i {
  2675. position: absolute;
  2676. top: -9px;
  2677. right: -9px;
  2678. color: #FF4500;
  2679. font-size: 25px;
  2680. display: none;
  2681. }
  2682. img {
  2683. width: 55px;
  2684. margin: 0 auto;
  2685. display: block;
  2686. }
  2687. div {
  2688. width: 100%;
  2689. display: block;
  2690. text-align: center;
  2691. color: #5e5e5e;
  2692. margin: 2px;
  2693. margin-top: 8px;
  2694. overflow: hidden;
  2695. text-overflow: ellipsis;
  2696. word-break: break-all;
  2697. font-size: 14px;
  2698. display: inline-block;
  2699. display: -webkit-box !important;
  2700. -webkit-line-clamp: 1;
  2701. -webkit-box-orient: vertical;
  2702. span {
  2703. display: initial;
  2704. white-space: break-spaces;
  2705. }
  2706. }
  2707. .add {
  2708. width: 100%;
  2709. height: 100%;
  2710. .add-top {
  2711. margin: 0 auto;
  2712. width: 80%;
  2713. height: 60%;
  2714. border: 2px dotted #c6c6c6;
  2715. border-radius: 5px;
  2716. position: relative;
  2717. span {
  2718. display: inline;
  2719. position: absolute;
  2720. top: calc(50% - 15px);
  2721. left: calc(50% - 15px);
  2722. font-size: 30px;
  2723. color: #bbb;
  2724. }
  2725. }
  2726. .add-buttom {
  2727. color: #5e5e5e;
  2728. }
  2729. }
  2730. }
  2731. }
  2732. }
  2733. }
  2734. }
  2735. }
  2736. </style>