insurerDialog.vue 6.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193
  1. <!--
  2. maintenance 选择供应商
  3. -->
  4. <template>
  5. <el-dialog title="选择保险公司" :visible.sync="dialog.insurer" width="1000px">
  6. <div>
  7. <div id="firm">
  8. <div class="title-search query-form" style="padding: 10px;margin-bottom: 10px;">
  9. <el-input
  10. placeholder="输入厂家名称进行查找"
  11. v-model="search"
  12. size="small"
  13. style="width:300px; margin-right: 10px;"
  14. clearable
  15. ></el-input>
  16. <el-button size="small" @click="filterSearch">查找</el-button>
  17. </div>
  18. <el-radio-group v-model="radio" style="width:100%;">
  19. <el-table class="data-table" border ref="maintenance" :data="tableData" style="width: 100%" height="300px">
  20. <el-table-column header-align='center' label="保险公司名称">
  21. <template slot-scope="scope">
  22. <el-tooltip :content="scope.row.name" placement="top">
  23. <el-radio v-model="radio" :label="scope.row">{{scope.row.name}}</el-radio>
  24. </el-tooltip>
  25. </template>
  26. </el-table-column>
  27. <el-table-column header-align='center' prop="website" label="网址"></el-table-column>
  28. <el-table-column header-align='center' prop="man" label="联系人"></el-table-column>
  29. <el-table-column header-align='center' prop="phone" label="联系电话"></el-table-column>
  30. <el-table-column header-align='center' prop="faxes" label="传真"></el-table-column>
  31. <el-table-column header-align='center' prop="email" label="电子邮件"></el-table-column>
  32. </el-table>
  33. </el-radio-group>
  34. <div class="right" style="background: #fff;">
  35. <p style="height:40px;line-height:40px;text-align:center;color:#9E9E9E; float: left;">
  36. 找不到想要的型号? 赶快去
  37. <i style="color:#46B0FF;cursor: pointer;">厂家库</i>维护吧
  38. </p>
  39. <my-pagination :page="page" @change="changePage" style="margin-top:10px;"></my-pagination>
  40. </div>
  41. </div>
  42. </div>
  43. <div slot="footer">
  44. <el-button
  45. type="primary"
  46. @click="getChange"
  47. >确 定</el-button>
  48. </div>
  49. </el-dialog>
  50. </template>
  51. <script>
  52. import myPagination from "@/components/ledger/lib/myPagination";
  53. import {getLib} from "@/api/scan/request"
  54. import {mapGetters} from "vuex";
  55. import tools from "@/utils/scan/tools"
  56. export default {
  57. components: {
  58. myPagination
  59. },
  60. props: {
  61. dialog: {
  62. type: Object,
  63. default: function () {
  64. return {
  65. insurer: true
  66. };
  67. }
  68. },
  69. firmDataType: {
  70. type: String
  71. }
  72. },
  73. computed: {
  74. ...mapGetters("layout", ["projectId", "secret", "userId"]),
  75. },
  76. data() {
  77. return {
  78. search: "", //搜索文案
  79. radio: "",
  80. tableData: [],
  81. page: {
  82. size: 50,
  83. sizes: [10, 30, 50, 100, 150, 200],
  84. total: 0,
  85. currentPage: 1
  86. }
  87. };
  88. },
  89. created() {
  90. // this.getData()
  91. },
  92. mounted() {
  93. },
  94. methods: {
  95. //过滤
  96. filterSearch() {
  97. this.tableData = this.allData.map(item => {
  98. if (item.name.indexOf(this.search) != -1) {
  99. return item
  100. } else {
  101. return undefined
  102. }
  103. }).filter(cb => cb)
  104. },
  105. getData() {
  106. console.log("insurer")
  107. this.page = {
  108. size: 50,
  109. sizes: [10, 30, 50, 100, 150, 200],
  110. total: 0,
  111. currentPage: 1
  112. }
  113. getLib({"type": ["insurance"]}).then(res => {
  114. if (res.data.result == "success") {
  115. let data = res.data.content.insurance.map(item => {
  116. if (item.contacts && item.contacts.length) {
  117. item.contacts.map(child => {
  118. if (child.projectId == this.projectId) {
  119. item.phone = child.phone
  120. item.man = child.name
  121. item.fox = child.fox
  122. item.email = child.email
  123. }
  124. return child
  125. })
  126. }
  127. if (!item.man) {
  128. item.man = "--"
  129. item.phone = "--"
  130. item.fox = "--"
  131. item.email = "--"
  132. }
  133. return item
  134. })
  135. this.allData = tools.deepCopy(data)
  136. this.tableData = this.pagination(this.page.currentPage, this.page.size, this.allData)
  137. this.page.total = data.length
  138. } else {
  139. this.$message.error("请求失败:" + res.data.resultMsg)
  140. }
  141. })
  142. },
  143. //分页改变
  144. changePage() {
  145. this.pagination(this.page.currentPage, this.page.size, this.allData)
  146. },
  147. //发生修改
  148. getChange() {
  149. if (!!this.radio) {
  150. this.$emit("changeInsurer", this.radio,this.firmDataType)
  151. this.dialog.insurer = false
  152. this.radio = ''
  153. } else {
  154. this.$message("请选择一个生产厂商")
  155. }
  156. },
  157. //分页事件
  158. pagination(pageNo, pageSize, array) {
  159. let offset = (pageNo - 1) * pageSize;
  160. return offset + pageSize >= array.length
  161. ? array.slice(offset, array.length)
  162. : array.slice(offset, offset + pageSize);
  163. }
  164. },
  165. watch: {
  166. dialog: {
  167. deep: true,
  168. handler: function () {
  169. if (this.dialog.insurer) {
  170. this.getData()
  171. }
  172. }
  173. }
  174. }
  175. };
  176. </script>
  177. <style lang="less">
  178. #firm {
  179. .el-table thead {
  180. tr {
  181. th {
  182. background-color: #f5f7fa;
  183. }
  184. }
  185. }
  186. }
  187. </style>