ZDSetInfo.vue 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329
  1. <template>
  2. <!-- @blur="selectBlur($event, index)" -->
  3. <div style="width: 100%;padding: 1rem;">
  4. <el-row >
  5. <el-col :span="6">征地补偿标准:</el-col>
  6. <el-col :span="18">
  7. <el-select v-model="bcbz" style="width: 90%;" @change="selectZDBZ" placeholder="请选择">
  8. <el-option v-for=" item in bcbzList" :key="item.value" :label="item.label"
  9. :value="item.value"></el-option>
  10. </el-select>
  11. </el-col>
  12. </el-row>
  13. <el-row class="subtitle">
  14. <el-col :span="12">统一年产值</el-col>
  15. </el-row>
  16. <el-row>
  17. <el-col :span="6">土地年产值:</el-col>
  18. <el-col :span="16"><el-input style="width: 100%;" type="number" placeholder="请输入" v-model="curBCBZ.BCBZ.TDCZ"
  19. @change="changeZDBZ"></el-input>
  20. </el-col>
  21. <el-col :span="2">元/亩</el-col>
  22. </el-row>
  23. <el-row class="subtitle">
  24. <el-col :span="12">土地补偿费</el-col>
  25. <el-col :span="12" style="font-size: small;color: aqua;">统一年产值 X 综合补偿倍数</el-col>
  26. </el-row>
  27. <el-row>
  28. <el-col :span="6">综合补偿倍数:</el-col>
  29. <el-col :span="16"><el-input style="width: 100%;" type="number" placeholder="请输入" v-model="curBCBZ.BCBZ.TDBCBS"
  30. @change="changeZDBZ"></el-input></el-col>
  31. </el-row>
  32. <el-row>
  33. <el-col :span="6">土地补偿费:</el-col>
  34. <el-col :span="16">
  35. <el-input placeholder="自动计算" readonly v-model="curBCBZ.BCBZ.TDBCF"></el-input></el-col>
  36. <el-col :span="2">元/亩</el-col>
  37. </el-row>
  38. <el-row class="subtitle">
  39. <el-col :span="12">安置补偿费</el-col>
  40. <el-col :span="12" style="font-size: small;color: aqua;">统一年产值 X 综合补偿倍数</el-col>
  41. </el-row>
  42. <el-row>
  43. <el-col :span="6">综合补偿倍数</el-col>
  44. <el-col :span="16"><el-input type="number" style="width: 100%;" placeholder="请输入" v-model="curBCBZ.BCBZ.AZBCBS"
  45. @change="changeZDBZ"></el-input></el-col>
  46. </el-row>
  47. <el-row>
  48. <el-col :span="6">安置补偿费:</el-col>
  49. <el-col :span="16"><el-input v-model="curBCBZ.BCBZ.AZBCF" readonly placeholder="自动计算"></el-input></el-col>
  50. <el-col :span="2">元/亩</el-col>
  51. </el-row>
  52. <el-row class="subtitle">
  53. <el-col :span="12">补偿费及安置补助费合计</el-col>
  54. <el-col :span="12" style="font-size: small;color: aqua;">统一年产值 X 综合补偿倍数</el-col>
  55. </el-row>
  56. <el-row >
  57. <el-col :span="6">征地补偿合计:</el-col> <el-col :span="16"><el-input v-model="curBCBZ.BCBZ.BCHJ" readonly
  58. placeholder="自动计算"></el-input></el-col> <el-col :span="2">元/亩</el-col>
  59. </el-row>
  60. <el-row justify="center" type="flex">
  61. <el-button type="primary" @click="save()">保存</el-button>
  62. <el-button type="primary" @click="saveAs()">另存为</el-button>
  63. <el-button type="primary" @click="reset()">重置</el-button>
  64. </el-row>
  65. <el-dialog title="标准名称设置" modal="false" :visible.sync="dialogFormVisible" modal-append-to-body>
  66. <el-form :model="ruleForm" :rules="rules" ref="ruleForm">
  67. <el-form-item label="名称" prop="name">
  68. <el-input v-model="ruleForm.name" autocomplete="off"></el-input>
  69. </el-form-item>
  70. </el-form>
  71. <div slot="footer" class="dialog-footer">
  72. <el-button @click="dialogFormVisible = false">取消</el-button>
  73. <el-button type="primary" @click="submitForm('ruleForm')">确 定</el-button>
  74. </div>
  75. </el-dialog>
  76. </div>
  77. </template>
  78. <script>
  79. export default {
  80. props: ["zdValue"],
  81. name: 'ZDShowInfo',
  82. data() {
  83. return {
  84. dialogFormVisible: false,
  85. ruleForm: {
  86. name: null,
  87. },
  88. rules: {
  89. name: [
  90. { required: true, message: '请输入名称', trigger: 'blur' },
  91. // { min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }
  92. ]
  93. },
  94. /**
  95. * 补偿标准绑定值
  96. */
  97. bcbz: '',
  98. // curLabel: '',
  99. /**
  100. * 补偿标准列表
  101. */
  102. bcbzList: JSON.parse(JSON.stringify(window.ZSBC.ZDBCList)),
  103. /**
  104. * 当前标准
  105. */
  106. curBCBZ: {
  107. label: "",
  108. value: "",
  109. BCBZ: {
  110. /**
  111. * 土地统一年产值
  112. */
  113. TDCZ: 0,
  114. /**
  115. * 土地补偿倍数
  116. */
  117. TDBCBS: 0,
  118. /**
  119. * 土地补偿费
  120. */
  121. TDBCF: 0,
  122. /**
  123. * 安置补偿倍数
  124. */
  125. AZBCBS: 0,
  126. /**
  127. * 安置补偿费
  128. */
  129. AZBCF: 0,
  130. /**
  131. * 补偿合计
  132. */
  133. BCHJ: 0,
  134. }
  135. }
  136. }
  137. },
  138. mounted() {
  139. this.initForm()
  140. },
  141. methods:
  142. {
  143. initForm() {
  144. debugger
  145. if (this.zdValue && this.zdValue != "") {
  146. this.bcbz = this.zdValue
  147. var item = this.bcbzList.find(t => t.value == this.bcbz)
  148. this.curBCBZ = item
  149. }
  150. },
  151. selectZDBZ() {
  152. debugger
  153. if (this.bcbz && this.bcbz != "") {
  154. this.curBCBZ = this.bcbzList.find(t => t.value == this.bcbz)
  155. }
  156. this.changeZDBZ()
  157. },
  158. /**
  159. * 选择标准改变
  160. */
  161. changeZDBZ() {
  162. this.curBCBZ.BCBZ.TDBCF = this.curBCBZ.BCBZ.TDCZ * this.curBCBZ.BCBZ.TDBCBS
  163. this.curBCBZ.BCBZ.AZBCF = this.curBCBZ.BCBZ.TDCZ * this.curBCBZ.BCBZ.AZBCBS
  164. this.curBCBZ.BCBZ.BCHJ = this.curBCBZ.BCBZ.TDBCF + this.curBCBZ.BCBZ.AZBCF
  165. },
  166. /**
  167. * 重置
  168. */
  169. reset() {
  170. // var val = this.bcbz
  171. this.bcbzList = JSON.parse(JSON.stringify(window.ZSBC.ZDBCList))
  172. var item = this.bcbzList.find(t => t.value == this.bcbz)
  173. debugger
  174. this.curBCBZ = {
  175. label: item.label, value: item.value, BCBZ: {
  176. /**
  177. * 土地统一年产值
  178. */
  179. TDCZ: item.BCBZ.TDCZ,
  180. /**
  181. * 土地补偿倍数
  182. */
  183. TDBCBS: item.BCBZ.TDBCBS,
  184. /**
  185. * 土地补偿费
  186. */
  187. TDBCF: item.BCBZ.TDBCF,
  188. /**
  189. * 安置补偿倍数
  190. */
  191. AZBCBS: item.BCBZ.AZBCBS,
  192. /**
  193. * 安置补偿费
  194. */
  195. AZBCF: item.BCBZ.AZBCF,
  196. /**
  197. * 补偿合计
  198. */
  199. BCHJ: item.BCBZ.BCHJ,
  200. }
  201. }
  202. // var item = this.bcbzList.find(t => t.value == this.bcbz)
  203. // this.bcbz = val;
  204. },
  205. /**
  206. * 保存修改
  207. */
  208. save() {
  209. if (this.bcbz == "") {
  210. this.$layer.alert("请选择补偿标准");
  211. return;
  212. }
  213. debugger
  214. var index = window.ZSBC.ZDBCList.findIndex(t => t.value == this.bcbz)
  215. if (index > -1) {
  216. window.ZSBC.ZDBCList[index] = this.curBCBZ
  217. this.$layer.alert("保存完成");
  218. }
  219. },
  220. /***
  221. * 另存为
  222. */
  223. saveAs() {
  224. // if (this.bcbz == "") {
  225. // this.$layer.alert("请选择补偿标准");
  226. // return
  227. // }
  228. this.dialogFormVisible = true;
  229. },
  230. submitForm(formName) {
  231. this.$refs[formName].validate((valid) => {
  232. if (valid) {
  233. // alert('submit!');
  234. this.dialogFormVisible = false
  235. this.saveData()
  236. // this.$layer.alert("保存完成");
  237. } else {
  238. console.log('error submit!!');
  239. return false;
  240. }
  241. });
  242. },
  243. /**
  244. * 另存数据
  245. */
  246. saveData() {
  247. debugger
  248. var val = (window.ZSBC.ZDBCList.length + 1).toString()
  249. var newBCBZ = {
  250. label: this.ruleForm.name,
  251. value: val,
  252. BCBZ: {
  253. /**
  254. * 土地统一年产值
  255. */
  256. TDCZ: this.curBCBZ.BCBZ.TDCZ,
  257. /**
  258. * 土地补偿倍数
  259. */
  260. TDBCBS: this.curBCBZ.BCBZ.TDBCBS,
  261. /**
  262. * 土地补偿费
  263. */
  264. TDBCF: this.curBCBZ.BCBZ.TDBCF,
  265. /**
  266. * 安置补偿倍数
  267. */
  268. AZBCBS: this.curBCBZ.BCBZ.AZBCBS,
  269. /**
  270. * 安置补偿费
  271. */
  272. AZBCF: this.curBCBZ.BCBZ.AZBCF,
  273. /**
  274. * 补偿合计
  275. */
  276. BCHJ: this.curBCBZ.BCBZ.BCHJ,
  277. },
  278. }
  279. window.ZSBC.ZDBCList.push(newBCBZ)
  280. this.bcbzList = window.ZSBC.ZDBCList;
  281. this.bcbz = val
  282. }
  283. }
  284. }
  285. </script>
  286. <style lang="scss">
  287. @import "@/../../zt.scss";
  288. </style>
  289. <style scoped>
  290. .el-row
  291. {
  292. margin-bottom: 0.5rem;
  293. }
  294. .subtitle {
  295. color: #02a7f0;
  296. font-weight: 400;
  297. }
  298. /* .el -input>input, .el-select-dropdown, .el-textarea>textarea
  299. {
  300. color: #fff !important;
  301. background-color: rgba(4, 28, 50, 0.5) !important;
  302. border: 1px solid rgba(15, 122, 200, 0.4) !important;
  303. text-align: center;
  304. } */
  305. /* .el-input
  306. {
  307. text-align: center;
  308. } */
  309. </style>